Menu mới cho nukeviet

Các điều hành viên: Hỗ trợ NukeViet, Phát triển NukeViet

Nội quy chuyên mục
- Khu vực này chỉ dành cho việc phát triển các theme và các tính năng mới cho hệ thống.
- Tên topic chính là tên Theme. Không được đặt tên Theme trùng với Block, Module, Theme đã có.
- Các thảo luận cho theme nào phải được gửi ngay tại topic mà người đầu tiên gửi nó lên.
- Vui lòng không gửi câu hỏi và các yêu cầu trợ giúp tại đây. Topic vi phạm nội quy sẽ bị xóa ngay lập tức!

Menu mới cho nukeviet

Bài viết chưa xemgửi bởi kenzano » 18 Tháng 5 2012, 20:29

Kĩ thuật này mình dùng cho theme default và dùng menu smooth_navigational_menu nhưng với các themes và menu khác cũng tương tự nhé:
Đây là Demo trên website của mình: http://kenzano.byethost4.com
Cách thực hiện:
Mở file ddsmoothmenu.css:
- Với menu ngang các bạn tìm đến dòng
Mã: Chọn tất cả
.ddsmoothmenu ul li a:hover {

và thay đoạn code sau vào:
Mã: Chọn tất cả
    background: #222;
    color: white;
   font-family:"Times New Roman";
   font-size:16px;
   text-align: center;
width:90px;
height:28px;
transition: width 0.5s;
-moz-transition: width 0.5s; /* Firefox 4 */
-webkit-transition: width 0.5s; /* Safari and Chrome */
-o-transition: width 0.5s; /* Opera */
    border-bottom: 1px solid #444;
   border-top: 1px solid #111;
    border-right: 1px solid #111;
   border-left: 1px solid #444;
padding: 10px;
}


Tiếp đó kéo xuống ngay dưới đó tìm đến đoạn code:
Mã: Chọn tất cả
.ddsmoothmenu ul li a:hover {

và thay bằng đoạn code này:
Mã: Chọn tất cả
    background:#666;
   opacity: 0.6;
   overflow:hidden;
   color: #fff;
   width:110px;
}


- Với menu dọc các bạn cũng làm tương tự, các bạn tìm đến đoạn
Mã: Chọn tất cả
.ddsmoothmenu-v ul li a:link, .ddsmoothmenu-v ul li a:visited, .ddsmoothmenu-v ul li a:active {

và thay bằng đoạn code này vào:
Mã: Chọn tất cả
 background: #f2f2f2; /*background of menu items (default state)*/
    color: blue;
   opacity: 0.9;
   text-indent: 8px;
   width:161px;
   height:20px;
   background:#f2f2f2;
      transition:width 0.5s;
      -moz-transition:width 0.5s; /* Firefox 4 */
      -webkit-transition:width 0.5s; /* Safari and Chrome */
      -o-transition:width 0.5s; /* Opera */
}

Tiếp theo tìm đến đoạn
Mã: Chọn tất cả
.ddsmoothmenu-v ul li a:hover {

thay bằng :
Mã: Chọn tất cả
    background: #555;
    color: #fff;
   width: 178px;
   opacity: 0.9;
}

Chúc các bạn thành công!
Sửa lần cuối bởi kenzano vào ngày 12 Tháng 6 2012, 17:37 với 1 lần sửa trong tổng số.
kenzano
Thành viên mới
 
Bài viết: 5
Ngày tham gia: 11 Tháng 3 2012, 12:50
Đã cảm ơn: 1 lần
Được cảm ơn: 5 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi tiendat1995day » 19 Tháng 5 2012, 06:28

bạn ơi hướng dẫn mình làm 2 cái menu này của bạn đi Hình ảnh
Tiến Đạt Pc

http://wWw.YeuICT.Tk/
Hình đại diện của thành viên
tiendat1995day
Thành viên chính thức
Thành viên chính thức
 
Bài viết: 159
Ngày tham gia: 27 Tháng 3 2011, 21:23
Đã cảm ơn: 6 lần
Được cảm ơn: 0 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi kenzano » 19 Tháng 5 2012, 10:19

Đây hoàn toàn là ứng dụng từ 2 website bạn ah. Với thanh menu chia sẻ dọc bên trái bạn vào trang http://www.addthis.com và bấm vào chữ Get the code for your sites! rồi làm theo các bước hướng dẫn trên website để lấy code rồi chèn vào web của bạn. Còn với thanh menu ngang bên dưới, bạn vào http://wibiya.conduit.com/ rồi bấm Get it now và cũng làm theo hướng dẫn. Bạn cứ thử tự làm, nếu có thắc mắc gì, t sẽ giải đáp sau. Chúc bạn thành công.
kenzano
Thành viên mới
 
Bài viết: 5
Ngày tham gia: 11 Tháng 3 2012, 12:50
Đã cảm ơn: 1 lần
Được cảm ơn: 5 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi DuongNguyen » 19 Tháng 5 2012, 10:41

Lại thêm 1 cái hay nữa, thanks
DuongNguyen
Thành viên tâm huyết
 
Bài viết: 1094
Ngày tham gia: 25 Tháng 12 2010, 09:42
Đã cảm ơn: 37 lần
Được cảm ơn: 11 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi thangnmkt » 03 Tháng 6 2012, 18:23

Đây hoàn toàn là ứng dụng từ 2 website bạn ah. Với thanh menu chia sẻ dọc bên trái bạn vào trang http://www.addthis.com và bấm vào chữ Get the code for your sites! rồi làm theo các bước hướng dẫn trên website để lấy code rồi chèn vào web của bạn. Còn với thanh menu ngang bên dưới, bạn vào http://wibiya.conduit.com/ rồi bấm Get it now và cũng làm theo hướng dẫn. Bạn cứ thử tự làm, nếu có thắc mắc gì, t sẽ giải đáp sau. Chúc bạn thành công.


Bạn kenzano hướng dẫn chi tiết giúp mình với được không. Mình làm thử nhưng không biết chèn code vào đâu cả. Cám ơn bạn trước nhé :)
thangnmkt
Thành viên dự bị
 
Bài viết: 1
Ngày tham gia: 19 Tháng 4 2012, 13:16
Đã cảm ơn: 0 lần
Được cảm ơn: 0 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi kenzano » 11 Tháng 6 2012, 17:59

Ở Menu menu chia sẻ dọc nhé, bạn lấy dc code rồi đúng không, mở tệp tin header.tpl trong thư mục layout ra, chèn vào bên dưới thẻ <body>, ở code đó bạn chỉnh lại thông số left và top cho phu hợp với trang web của bạn là xong. Còn cái thanh công cụ dưới thì chỉ cần vào trang đó đăng kí tài khoản rồi điền địa chỉ trang web của mình vào là OK. Không khó lắm phải không bạn?
kenzano
Thành viên mới
 
Bài viết: 5
Ngày tham gia: 11 Tháng 3 2012, 12:50
Đã cảm ơn: 1 lần
Được cảm ơn: 5 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi nicky » 13 Tháng 6 2012, 18:21

Cám ơn Kenzano nhiều nhé. Đã add được rồi. www.phapluatdoanhnghiep.com Các bạn thử cho vài ý kiến nhé.
Than ai,
Nicky Tran.

Tin tuc Franchise: http://www.vietnamfranchise.net
Thanh lap doanh nghiep: http://www.phapluatdoanhnghiep.com
Expat in Vietnam: http://www.dana.vn
Hình đại diện của thành viên
nicky
Thành viên chính thức
Thành viên chính thức
 
Bài viết: 107
Ngày tham gia: 11 Tháng 10 2007, 16:03
Đã cảm ơn: 4 lần
Được cảm ơn: 2 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi kenzano » 14 Tháng 6 2012, 13:52

Không có gì. T thấy trang web của bạn làm khá ổn rồi đó, nhưng nếu đánh giá chi tiết thì có một vài điều t đóng góp với bạn chút nhé:
+ Nên để cái menu hỗ trợ đó vào một vị trí tuyệt đối, ví dụ cho sát vào lề trang web hoặc sát lề trái màn hình.
+ Nên để thống nhất các màu trong website, cụ thể là menu ngang của bạn để mặc định là màu xanh (#003399), các danh mục chính trong website cũng nên theo màu này hoặc ngược lại. Theo ý kiến t tham khảo dc từ một vài người có kinh nghiệm thì trong một website nên để từ 1-2 màu cơ bản thôi.
+ Phần footer "NukeViet is registered trademark of VINADES.,JSC" nên bỏ đi vì dễ gây nhầm lẫn với thương hiệu của bạn, bạn có chỉnh lại trong themes/modern/layout/footer.tpl
Nếu bạn muốn thêm menu dưới vào thì chỉ cần cho thêm đoạn code bạn lấy được khi đăng kí trên http://wibiya.conduit.com/ đặt vào footer.tpl (bên trên thẻ </body>) là được.
Chúc bạn thành công và website ngày càng lớn mạnh
kenzano
Thành viên mới
 
Bài viết: 5
Ngày tham gia: 11 Tháng 3 2012, 12:50
Đã cảm ơn: 1 lần
Được cảm ơn: 5 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi hoatrieutien » 19 Tháng 6 2012, 21:02

có thể giúp mình cái này không
Bạn không được cấp phép để xem tập tin đính kèm trong bài viết này.
hoatrieutien
Thành viên mới
 
Bài viết: 13
Ngày tham gia: 06 Tháng 6 2012, 14:21
Đã cảm ơn: 3 lần
Được cảm ơn: 1 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi mylovevlong » 19 Tháng 6 2012, 22:48

hoatrieutien đã viết:có thể giúp mình cái này không
làm cái này là làm cái gì,bạn fai nói ro ra chứ,có fai ban muon chinh màu cua nó đúng ko
Times for Love - Thời gian cho tình yêu
http://times.12a3.net
mylovevlong
Thành viên năng động
Thành viên năng động
 
Bài viết: 276
Ngày tham gia: 29 Tháng 5 2008, 08:08
Đến từ: Vĩnh long
Đã cảm ơn: 28 lần
Được cảm ơn: 25 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi hoatrieutien » 20 Tháng 6 2012, 08:08

mylovevlong đã viết:
hoatrieutien đã viết:có thể giúp mình cái này không
làm cái này là làm cái gì,bạn fai nói ro ra chứ,có fai ban muon chinh màu cua nó đúng ko
Đúng rùi ! bạn chỉ mình với ! thanhk
hoatrieutien
Thành viên mới
 
Bài viết: 13
Ngày tham gia: 06 Tháng 6 2012, 14:21
Đã cảm ơn: 3 lần
Được cảm ơn: 1 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi kenzano » 21 Tháng 6 2012, 23:56

Tất cả đều là CSS thôi bạn ạ, nó nằm trong tệp tin news.css, cụ thể như sau:
Với màu menu tiêu đề chính (khoanh tròn đầu tiên của bạn), bạn tìm đến đoạn
Mã: Chọn tất cả
div.news_column div.header a.current span

thay bằng
Mã: Chọn tất cả
background:
#444;
border-radius: 2px;
-moz-border-radius: 2px;
padding: 0 6px 0 0;
height: 23px;
display: block;
float: left;
cursor: pointer;
}

Tiếp theo là tìm đến
Mã: Chọn tất cả
div.news_column div.header a.current span span

Thay background: #444; là xong.
Với màu xanh của danh mục con(khaong tròn thứ 2):
Bạn tìm đến thẻ
Mã: Chọn tất cả
div.news_column div.header a {

Tìm đến color thay "color: blue;"
Với cái đường kẻ màu xanh cũng là mã màu thôi nhưng nói thật là mình cũng không biết nó nằm chỗ nào luôn vì mình làm cái đó cũng khá lâu rồi, nếu tìm dc t sẽ nói sau.
Còn cái khoanh tròn cuối cùng của bạn thì bạn cũng chỉ cần tìm đến
Mã: Chọn tất cả
div.news_column ul.related a

Tìm đến color thay "color: blue;"
Nếu muốn hiệu ứng giống như trang của tớ thì bạn vào thẻ:
Mã: Chọn tất cả
div.news_column ul.related a:hover

Thay toàn bộ thẻ bằng:
Mã: Chọn tất cả
color:
black;
text-shadow: 0 1px 1px
#999;
padding-right: 3px;
padding-left: 3px;
}

Một mẹo nhỏ cho bạn nếu dùng Chrome: bạn muốn thay đổi bất cứ thứ gì đó liên quan đến CSS trong trang web của bạn thì chỉ cần trỏ chuột vào đó (nếu đó là một liên kết) hoặc bôi đen đối tượng đó rồi bấm chuột phải, chọn "Kiểm tra phần tử", sẽ hiện ra code và đoạn CSS đang tác động vào đối tượng, bạn sẽ biết nó nằm trong tệp tin nào rồi vào tiến hành chỉnh sửa thôi.
Chúc bạn thành công!!!
kenzano
Thành viên mới
 
Bài viết: 5
Ngày tham gia: 11 Tháng 3 2012, 12:50
Đã cảm ơn: 1 lần
Được cảm ơn: 5 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi hoatrieutien » 25 Tháng 6 2012, 00:50

mình cũng mò ra rùi ! cảm ơn ban :)
hoatrieutien
Thành viên mới
 
Bài viết: 13
Ngày tham gia: 06 Tháng 6 2012, 14:21
Đã cảm ơn: 3 lần
Được cảm ơn: 1 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi sonbkmta » 03 Tháng 7 2012, 08:39

mình muốn sửa cái menu trên cùng và dưới cùng thì sửa ở chỗ nào nhỉ?
Gia đình là trên hết :) => http://webgiadinh.vn
Phụ kiện: AriBlade 2010 - HP Envy 14 - Nikon D3100 - IP4 World - BlackBerry Tour 9630.
sonbkmta
Thành viên chính thức
Thành viên chính thức
 
Bài viết: 165
Ngày tham gia: 24 Tháng 6 2007, 17:18
Đến từ: Ha noi
Đã cảm ơn: 0 lần
Được cảm ơn: 0 lần

Re: Menu mới cho nukeviet

Bài viết chưa xemgửi bởi hoatrieutien » 03 Tháng 7 2012, 19:27

kenzano đã viết:Kĩ thuật này mình dùng cho theme default và dùng menu smooth_navigational_menu nhưng với các themes và menu khác cũng tương tự nhé:
Đây là Demo trên website của mình: http://kenzano.byethost4.com
Cách thực hiện:
Mở file ddsmoothmenu.css:
- Với menu ngang các bạn tìm đến dòng
Mã: Chọn tất cả
.ddsmoothmenu ul li a:hover {

và thay đoạn code sau vào:
Mã: Chọn tất cả
    background: #222;
    color: white;
   font-family:"Times New Roman";
   font-size:16px;
   text-align: center;
width:90px;
height:28px;
transition: width 0.5s;
-moz-transition: width 0.5s; /* Firefox 4 */
-webkit-transition: width 0.5s; /* Safari and Chrome */
-o-transition: width 0.5s; /* Opera */
    border-bottom: 1px solid #444;
   border-top: 1px solid #111;
    border-right: 1px solid #111;
   border-left: 1px solid #444;
padding: 10px;
}


Tiếp đó kéo xuống ngay dưới đó tìm đến đoạn code:
Mã: Chọn tất cả
.ddsmoothmenu ul li a:hover {

và thay bằng đoạn code này:
Mã: Chọn tất cả
    background:#666;
   opacity: 0.6;
   overflow:hidden;
   color: #fff;
   width:110px;
}


- Với menu dọc các bạn cũng làm tương tự, các bạn tìm đến đoạn
Mã: Chọn tất cả
.ddsmoothmenu-v ul li a:link, .ddsmoothmenu-v ul li a:visited, .ddsmoothmenu-v ul li a:active {

và thay bằng đoạn code này vào:
Mã: Chọn tất cả
 background: #f2f2f2; /*background of menu items (default state)*/
    color: blue;
   opacity: 0.9;
   text-indent: 8px;
   width:161px;
   height:20px;
   background:#f2f2f2;
      transition:width 0.5s;
      -moz-transition:width 0.5s; /* Firefox 4 */
      -webkit-transition:width 0.5s; /* Safari and Chrome */
      -o-transition:width 0.5s; /* Opera */
}

Tiếp theo tìm đến đoạn
Mã: Chọn tất cả
.ddsmoothmenu-v ul li a:hover {

thay bằng :
Mã: Chọn tất cả
    background: #555;
    color: #fff;
   width: 178px;
   opacity: 0.9;
}

Chúc các bạn thành công!
hoatrieutien
Thành viên mới
 
Bài viết: 13
Ngày tham gia: 06 Tháng 6 2012, 14:21
Đã cảm ơn: 3 lần
Được cảm ơn: 1 lần


Quay về Giao diện

Ai đang trực tuyến?

Đang xem chuyên mục này: Không có thành viên nào đang trực tuyến2 khách


http://my.metadata.vn
WEB NHANH - Thiết kế web nhanh
Dự án 20 triệu máy tính bảng
Sponsored Links: Thiết kế web nhanh | Thiết kế website dựng sẵn | thiết kế web trường học | Thiet ke web công ty
Web bán hàng trực tuyến | Du học Nhat Ban | Du học Uc | Du học Anh Quoc | Du học Han Quoc | Du học Dai Loan | Du học Gia re | thay đổi đăng ký kinh doanh
giấy phép kinh doanh rượu