Do có một số bạn hỏi: Sao không đổi màu cho menu được?, vì vậy hôm nay tôi xin giới thiệu đến các bạn MENU NGANG XỔ DỌC XUỐNG NHIỀU CẤP (KIỂU 2), menu này cũng giống với menu kiểu 1 nhưng thay vào đó các bạn có thể dễ dàng đổi màu cho menu, đổi màu cho chữ trên menu...
Để tạo được như vậy, các bạn cần làm theo các bước sau đây:
Đầu tiên, bạn đăng nhập vào Blog > Chọn thiết kế > Chọn chỉnh sửa HTML, sau đó bạn bấm đồng thời cặp phím Ctrl+F để mở hộp tìm kiếm và gõ vào khung dòng lệnh <head>. Bây giờ bạn copy đoạn code này và dán phía dưới dòng lệnh đó.
<style type='text/css'>
html .jqueryslidemenu{height: 1%;} </style> <script src='http://dl.dropbox.com/u/66348944/jquery.min.js' type='text/javascript'/> <script src='http://dl.dropbox.com/u/66348944/drop_menu.js' type='text/javascript'/> |
Sau khi dán xong đoạn code này, bạn xoá dòng lệnh cũ đi và tiếp tục gõ vào khung tìm kiếm dòng lệnh </header> rồi copy tất cả các code này vào trên dòng lệnh đó và bấm Lưu mẫu.
<style>
.jqueryslidemenu{ font: bold 12px Verdana; background:#153E7E; /* màu nền của menu*/ width: 100%; } .jqueryslidemenu ul{ margin: 0; padding: 0; list-style-type: none; } .jqueryslidemenu ul li{ position: relative; display: inline; float: left; } .jqueryslidemenu ul li a{ display: block; background:#15317E; /* màu nền của thư mục chính*/ color: white; /*màu text thư mục chính*/ padding: 8px 10px; border-right: 1px solid #778; color: #ccc; text-decoration: none; } * html .jqueryslidemenu ul li a{ display: inline-block; } /*.jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{ color: #ff0066; //màu cchữ các menu }*/ .jqueryslidemenu ul li a:hover{ background:#2B60DE; /* màu hiệu ứng khi rê chuột vào các link*/ color: white; /*màu text khi rê chuột*/ } .jqueryslidemenu ul li ul{ position: absolute; left: 0; display: block; visibility: hidden; } .jqueryslidemenu ul li ul li{ display: list-item; float: none; } .jqueryslidemenu ul li ul li ul{ top: 0; } .jqueryslidemenu ul li ul li a{ font: normal 13px Verdana; width: 160px; padding: 5px; margin: 0; border-top-width: 0; border-bottom: 1px solid gray; } .jqueryslidemenuz ul li ul li a:hover{ background: #eff9ff; color: black; } .downarrowclass{ position: absolute; top: 12px; right: 7px; } .rightarrowclass{ position: absolute; top: 6px; right: 5px; }</style> <div id="myslidemenu" class="jqueryslidemenu"> <ul> <li><a href="http://dungheineken8.blogspot.com/">Home</a></li> <li><a href="http://dungheineken.blogspot.com/">Thủ thuật máy computer</a></li> <li><a href="http://anhdepblog.blogspot.com/">Thủ thuật Ảnh </a> <ul> <li><a href="#">Sub Item 1.1</a></li> <li><a href="#">Sub Item 1.2</a></li> <li><a href="#">Sub Item 1.3</a></li> <li><a href="#">Sub Item 1.4</a></li> </ul></li> <li><a href="http://phimvang.org/">Xem phim</a></li> <li><a href="#">Blogspot</a> <ul> <li><a href="#">Sub Item 2.1</a></li> <li><a href="#">Folder 2.1</a> <ul> <li><a href="#">Sub Item 2.1.1</a></li> <li><a href="#">Sub Item 2.1.2</a></li> <li><a href="#">Folder 3.1.1</a> <ul> <li><a href="#">Sub Item 3.1.1.1</a></li> <li><a href="#">Sub Item 3.1.1.2</a></li> <li><a href="#">Sub Item 3.1.1.3</a></li> <li><a href="#">Sub Item 3.1.1.4</a></li> <li><a href="#">Sub Item 3.1.1.5</a></li> </ul> </li> <li><a href="#">Sub Item 2.1.4</a></li> </ul> </li> </ul></li> <li><a href="http://www.nhaccuatui.com/">Nghe nhạc</a></li> <li><a href="http://anhdepblog.blogspot.com/">Hình ảnh</a> <ul> <li><a href="#">Sub Item 1.1</a></li> <li><a href="#">Sub Item 1.2</a></li> </ul></li> <li><a href="#">Download</a> <ul> <li><a href="#">Sub Item 2.1</a></li> <li><a href="#">Sub Item 2.2</a></li> </ul></li> </ul><br style="clear: left" /> </div> |
Bây giờ điều bạn cần làm là thay đổi các dữ liệu trong các dòng lệnh <a herf="#" (thay # bằng địa chỉ link liên kết), tên menu và thay đổi màu cho menu, màu chữ theo ý thích của bạn (có ghi chú ở code) cho phù hợp với Blog của mình. Cuối cùng bấm Lưu mẫu và trở lại Blog để "thưởng thức" thành quả. Lưu ý: Có một số giao diện blog sẽ không có lệnh </header>, do vậy bạn phải thêm tiện ích HTML/Javacript rồi dán code phần 2 vào và lưu lại là xong.
Nguồn: Trai đất mũi
65 nhận xét:
hiếu
bạn ơi cho mình hỏi mình làm được rùi nhưng có
một chuyện
khi menu con xổ xuống nó lại nằm dưới bài viết vậy mình phải làm sao
nhờ bạn chỉ dùm cảm ơn bạn trước
blog của mình đây http://caycanhban.blogspot.com/
Do giao diện blogger của bạn có background nổi ở trên, do đó nó sẽ bị che khuất, đâu bạn thử làm kiểu 1 xem có bị không nha?
hiếu
ban oi ! co cách nào mình đổi giao diện được ko bạn
Đổi giao diện thì dễ mà, bạn đăng nhập vào Blog > chọn Thiết kế, sau đó bấm chọn thẻ Trình thiết kế mẫu ở phía trên, tại đây có sẳn các mẫu giao diện của Blogger, bạn chọn một mẫu rồi bấm áp dụng cho Blog là xong
Chúc bạn thành công
alo A.Dung
Giup em voi
anh huong dan em viet bai vao trong may cai menu ngang voi em lam dung nhu anh ma khong duoc
Trinh cho anh địa chỉ mail đi, để anh gởi hình qua cho em hoặc em gởi hình chụp khi em làm cho anh: dungheineken@gmail.com, anh xem xem em làm như thế nào thì mới hướng dẫn cụ thể được
anh ơi cho em hỏi: em làm được rôi nhưng làm sao dăng bài trên các menu con đó ạ?
anh ơi cho em hỏi: là em làm được rồi nhưng làm sao đăng bài trên các menu con đó ?
vuonguyenmar@yahoo.com
Bây giờ thì em copy địa chỉ bài đăng nào muốn hiển thị dán vào chỗ dấu "#" màu xanh và thay thế tên bài đăng vào chữ Sub menu là được
với nhiều bài thì làm sao anh?
Ý em là một menu xổ xuống sẽ có nhiều bài đăng trong menu đó hả?, nếu vậy thì em cứ làm tương tự là được
ko, với nhiều bài trong 1 trang đó anh, làm sao a? 1 mục trong menu xổ xuống đăng nhiều bài đó anh
Xin lôi em, anh không hiểu rõ lắm về câu hỏi của em, em có thể gởi hình chụp cho anh qua địa chỉ dungheineken@gmail.com để anh xem xem có giúp ích gì cho em không nha?
Thân!!!
bạn cho mình hỏi, có thể áp dụng cách này để chèn menu flash vào Google Site được ko? Nếu được bạn có thể vui lòng hướng dẫn thêm cho mình ko?
Cảm ơn!
Xin lỗi bạn, vì tôi không có "chơi" Google site nên không biết có làm được không nữa?
Bạn thử tìm hiểu trên Google xem sao
bạn ơi bạn gửi lại cho mình đi mình hua nhận được,cho mình hỏi thêm mình làm menu ngang như bạn chỉ dẫn nhưng khung ngang menu ko dài bằng mẫu blog thì phải làm như thế nào?
Mình đã gởi lại code lịch cho Giang rồi đó, check mail nha.
Còn menu ngang có "chiều dài không bằng Blog" là do Giang có ít mục quá, tạo thêm mục nữa thì nó sẽ bằng thôi
Bạn ơi cho mình hỏi để tạo đươc thanh trượt lên xuống(ví dụ như thanh trượt nằm bên phải của phần nhận xét của bạn) thì làm thế nào vậy bạn, bạn có thể hướng dẫn cho mình được không. Cám ơn bạn rất nhiều.
Xin lỗi bạn mình chỉ biết code làm thanh trượt ở phần comments thôi, còn các phần khác mình chưa tìm hiểu, bạn muốn làm thanh trượt ở phần nào? Nếu biết mình sẽ chia sẻ cho bạn
anh ơi em hỏi chút sao em làm thanh menu của anh nhưng nó lại hiện trên cùng trang blog vậy anh giúp em cho nó nằm bên trên khùng đăng bài được không anh cảm ơn anh nhiều
Muốn cho nó hiện lên trên khung bài đăng thì ở code thứ hai em không dán vào header nữa mà đăng nhập vào blog > chọn thiết kế > Thêm tiện ích HTML rồi dán nó vào và kéo lên trên khung bài đăng là được
ANH ƠI SAO EM CHỈNH SỬA TÊN TRONG THANH MENU NHƯNG NÓ BÁO LỖI http://quangbinhexplorer.blogspot.com/p/du-lich-nuoc-ngoai.html
ANH CHỈ CACHS CHO EM VỚI VÀ HÌNH NHƯ CÁC LINK CŨNG LOẠN XẠ LÊN RỒI HU HU , NẾU LÀM MỚI LẠI CHẮC EM CHẾT MẤT
Bình tĩnh, bây giờ em xoá các code tạo menu lúc nãy và làm lại từng bước theo hướng dẫn, ở code thứ hai thì em đừng dán vào header nữa mà hãy tạo một HTML rồi dán vào và kéo nó lên trên bài đăng là được
Chúc em thành công
http://quangbinhexplorer.blogspot.com/
EM MUỐN SỬA CÁI TÊN LẠI PHÍA TRÊN NHƯNG EM KHÔNG TÌM THẤY CHỖ THAY , ANH ƠI HELP EM !
Cái tên ở trên là một file ảnh, vì vậy em phải có file ảnh trước rồi up lên host riêng của mình để lấy link sau đó em đăng nhập vào Blog chọn Chỉnh sửa HTMl và kiếm link hình ở mục Logo và thay thế link của mình vào là được
mình làm đc rồi nhưng cái đó nó lại nằm cùng với cái trang chủ của blog làm sao bây giờ, bây giờ nó thành hai cái menu luôn 1 là củblog có sẵn
1 là của mình sửa html?
Thì đúng rồi, menu này nó sẽ xuất hiện ở trang chủ, nếu bạn không muốn xuất hiện ở trang chủ thì làm ẩn nó đi, xem bàn ẨN TIỆN ÍCH
trường hợp mẫu ko có thì tạo sao vậy anh, có thể giúp e với đc ko anh
Ý em là sao? không có thì mình tạo chớ sao nữa em trai, làm theo hướng dẫn trên bài là được
hôm qua em hỏi ko rõ. ý em là một số template ko có đó anh, thì làm sao, xi lỗi a vì câu hỏi ko rõ
Nếu giao diện nào không có thì mình phải tạo cái mới cho nó thôi và kéo nó lên phía trên là được
anh nói rõ cách làm 5 Tab với
Chỉ rõ phần làm nội dung ấy
có thể chèn link mà nếu chèn cái khác thì phải thế nào
giống như chèn của anh đó
Ở phần nội dung cho các Tab, em có thể thêm bất kỳ vào nội dung nào mà mình muốn như hình ảnh, chữ viết...Nhớ chú ý là nội dung phải là các code HTML (ngoài trừ chữ viết là không cần)
Tặng Dũng Code Menu 3D có link của Dũng đó:
Mình cắt phần thẻ p rồi vì diễn đàn không chấp nhận, khi dùng bạn thêm phần thẻ p vào nhé
Cám ơn bạn nhưng sao tôi không thấy code nào bạn gởi tặng cả, bạn gởi ở đâu???
Chào Dũng.
"Sau khi dán xong đoạn code này, bạn xoá dòng lệnh cũ đi và tiếp tục gõ vào khung tìm kiếm dòng lệnh rồi copy tất cả các code này vào trên dòng lệnh đó và bấm Lưu mẫu."
Bạn cho mình hỏi xóa dòng lệnh cũ là xóa lệnh nào?
Trong đó rất nhiều vậy bạn nói rõ xóa từ đâu đến đâu nhé.
Cám ơn bạn
Chúc sức khỏe
Xoá lệnh cũ có nghĩa là xoá chữ head lúc đâu mới gõ vào hộp tìm kiếm đó và thay vào hộp tìm kiếm chữ header (chứ không phải xoá lệnh trong HTML...)
Em làm giống anh nhưng submenu đổ xuống nhưng hiện thị ko dc hết .........
Em chụp hình gởi qua mail cho Anh dungheineken@gmail.com để anh xem thử bị lỗi như thế nào để hướng dẫn cho em
Em làm giống anh như sao e rà và kích chuột vào menu con không được , Anh giúp em với blog của em : http://s2teamz.blogspot.com/
Có thể là do em áp dụng hiệu ứng con trỏ chuột, vì vậy em thử bỏ hiệu ứng sao rơi ở con trỏ chuột thử xem...
Hôm trước em áp dụng hiệu ứng con trỏ , giờ em không biết nó nằm ở chổ nào để xóa .hihi , Anh giúp em với . thanks anh nhiều
Em đăng nhập vào Blog chọn tiện ích nào có hiệu ứng chuột thì xoá nó
hi E bỏ hiệu ứng con chuột rồi mà vẫn không được , không rà và click chuột vào menu con được . A giúp em với
Em đăng nhập vào blog chọn thiết kế, chọn chỉnh sửa HTML rồi dán code vào trước thẻ đóng head thử xem
Thanks A Em Kích chuột được rồi , nhưng kích dòng menu con thứ 2 thứ 3 hơi khó .Chúc A Năm mới vui vẽ :D
Dung oi,minh da co lam nhu kieu 1 va kieu 2 ra rat ok nhung chi tiec 1 dieu la phia duoi thanh menu lai la cai Javascript banner dong nen ko nhin thay hang thu 2 xo xuong ma chi thay duoc hang 1 xo thoi,co cach nao khac phuc giup minh voi.Mail : mrdohuy@gmail.com tks Dung rat nhieu neu duoc hoi am
Bạn thử dán code trên thẻ đóng header xem sao
Dung oi!Minh da dan code 1 ben duoi the mở head va dan code 2 tren the dong header roi,menu ngang rat tot xo doc xuong day du nhưng vì vướng cái banner động nên ko nhin được hàng menu con thứ 2 trở đi(có lẽ do cái banner động nó che mất nên không nhìn thấy được cái menu con thứ 2 trở xuống).Rất mong được giúp đỡ
Ok, để mình nghiên cứu lại kiểu khác, nếu thành công sẽ đăng bài cho bạn tham khảo nha
Tks Dũng nhiều!Hi vọng sẽ có kết quả sớm nhất.Blog của bạn dẹp thật
bạn ơi mình cảm ơn vè bài viết rất hay của bạn nhưng mình có thắc mắc là giờ mình ko thích màu xanh của thanh menu đó mà mình muốn màu khác thì làm sao?rất mong hồi âm sớm của bạn. email của mình là vuongsungdong@yahoo.com
Muốn đổi màu nền cho menu, bạn đổi mã màu ở mục background (tôi có ghi chú ở trên code đó). Nếu bạn chưa biết mã màu thì mời bạn xem bài này để chọn mã màu rồi thay vào là xong.
http://dunghennessy.blogspot.com/2012/02/bang-ma-mau.html
Chúc bạn thành công
Mình code mẫu của bạn rùi và đã thành công, nhưng khi rê chuôt vào menu để hiện ra menu con thì chỉ rê chuột lại tới menu con thứ 1 thui, còn 2và 3...thì nó tự nhiên đóng lại (VD như khi rê chuột vào Thủ Thuật Ảnh thì nó hiện ra Sub item 1.1 cho đến 1.4, rê chuột lại 1.1 thì dc, còn mấy cái kia khi rê chuột lại thì nó tự dưng đóng lại)
Chắc là do giao diện của bạn không phù hợp hoặc code menu này xung đột với code khác trên blog của bạn.
vậy phải chọn giao diễn gì mới phù hợp với cái meny này za
Bạn thử chọn một trong những giao diện này thử xem:
http://dunghennessy.blogspot.com/search/label/Template
cho mình hỏi giao diện của mình màu den giờ muốn đổi sang màu khác dc không A Dũng
Tuỳ theo giao diện mà mình có thể đổi được, bạn kiếm trong dòng lệnh background và thay thế mã màu khác, cuối cùng lưu lại là Ok
Anh dung giup e cai nay voi ạ.
hom bua e lam menu ngang xổ doc, theo bai viet cua anh ma kieu nào ko nho rõ, ma sao để HTML/Javascript chỗ khác thì dc binh thuong nhung để ngay chỗ nay thì ko xổ xuong nó trùng với menu trang mặc đinh của blog hay sao do vì khi chỉnh trong mẫu nâng cao nó cung thây đổi màu theo luôn, a xem giup chi e cach khac phuc voi blog:thanhhuyenkt.blogspot.com
thanks anh!
Có thể code menu ngang này "nó" xung đột với một code tiện ích nào đó ở blog của em rồi...Vụ này thì "bó tay" chỉ có thể tìm và xoá code đã xung đột với "nó" mà thôi
ma cái này la tất cả code mặc định cua blogspot luon, e them code menu cua a đầu tiên luôn ma cũng đụng code,vay e cung bo tay,thanks anh
Tôi cũng bị tình trạng giống vậy, menu con xổ xuống bị che khuất. Không có cách khắc phục nào sao hả bạn? Tôi thường thấy trên blog đa số code menu như thế này đều bị che khuất. không thấy ai hướng dẫn cách khắc phục chi tiết hơn. Nhờ bạn chỉ giúp.thanks
You can choose to cut cold turkey or ease yourself into it. Regardless, this method will ensure you pass a drug test given there’s enough time from when you halted consumption to when you’re tested. Passing a drug test will be much easier if you drink lots of fluids beforehand. Water will not only keep your body hydrated, but it will also assist with flushing the body of toxins faster. Aside from detox kits, there are a few other ways that can help you pass a drug test. All of these options can be used to lower THC and toxin levels in your body before testing.
Đăng nhận xét