Để tạo menu ngang cho Blogger như hình mẫu dưới đây
Đầu tiên bạn đăng nhập vào Blogger của mình rồi chọn Thiết kế > thêm tiện ích và chọn HTML/Javacript, sau đó dán code này vào
<style> #navcontainer { /* none needed */ } ul#navlist { margin: 0; padding: 0; list-style-type: none; white-space: nowrap; } ul#navlist li { float: left; font-family: verdana, arial, sans-serif; font-size: 9px; font-weight: bold; margin: 0; padding: 5px 0 4px 0; background-color: #3535c7; border-top: 1px solid #e0ede9; border-bottom: 1px solid #e0ede9; } #navlist a, #navlist a:link { margin: 0; padding: 5px 9px 4px 9px; color: #ff0000; border-right: 1px solid #d1e3db; text-decoration: none; } ul#navlist li#active { color: #95bbae; background-color: #d1e3db; } #navlist a:hover { color: #0000ff; background-color: #1e5508; } </style> <div id="navcontainer"> <ul id="navlist">
<li><a href="http://dungheineken.blogspot.com/"><span>TRANG CHỦ</span></a></li>
<li><a href="http://dungheineken.blogspot.com/p/giai-ap.html"><span>GIẢI ĐÁP</span></a></li>
<li><a href="http://dungheineken.blogspot.com/p/download.html"><span>DOWNLOAD</span></a></li> <li><a href="http://dungheineken.blogspot.com/p/photoshop.html"><span>PHOTOSHOP</span></a></li>
<li><a href="http://dungheineken.blogspot.com/p/cai-at-win-ghost-phan-chia-o-ia.html"><span>CÀI ĐẶT WIN-GHOST</span></a></li>
<li><a href="http://dungheineken.blogspot.com/p/vui-de-hoc.html"><span>VUI ĐỂ HỌC</span></a></li>
<li><a href="http://dungheineken.blogspot.com/p/web-hay.html"><span>WEB HAY</span></a></li><li><a href="http://dungheineken.blogspot.com/p/blog-page_26.html"><span>DUNGHEINEKEN</span></a></li>
</ul> </div>
Bây giờ, bạn hãy thay đổi các link màu đỏ bằng các link của Blog mình, bạn đặt tên cho các chữ màu vàng bằng các tên mà mình muốn hiển thị
Ngoài ra nếu muốn thay đổi màu chữ, màu nền cho menu các bạn thay đổi các code màu xanh.(xem bài cách lấy mã màu TẠI ĐÂY). Nếu mẫu trên chưa vừa ý với bạn, bạn có thể xem thêm các mẫu menu ngang TẠI ĐÂY
Cuối cùng bạn di chuyển tiện ích HTML/Javacript này nằm dưới thanh tiêu đề của Blog để tạo menu ngang giống như các trang Web.
Mách nhỏ: Nếu muốn có các đường Link của các trang trên Blog mình thì bạn phải tạo thêm trang cho Blog (xem hướng dẫn TẠI ĐÂY), sau khi thêm trang xong bạn viết bài vào trang đó và cho ẩn các trang, lấy đường link đó thay vào các code màu đỏ... lúc này khách tham quan bấm vào một mục nào đó trên thanh menu thì sẽ hiện lên trang của bạn đã tạo...
Còn các bài viết theo chủ đề (Nhãn) thì bạn nên tạo hộp menu xổ xuống thì đẹp và gọn hơn (xem hương dẫn TẠI ĐÂY)
Cuối cùng bạn di chuyển tiện ích HTML/Javacript này nằm dưới thanh tiêu đề của Blog để tạo menu ngang giống như các trang Web.
Mách nhỏ: Nếu muốn có các đường Link của các trang trên Blog mình thì bạn phải tạo thêm trang cho Blog (xem hướng dẫn TẠI ĐÂY), sau khi thêm trang xong bạn viết bài vào trang đó và cho ẩn các trang, lấy đường link đó thay vào các code màu đỏ... lúc này khách tham quan bấm vào một mục nào đó trên thanh menu thì sẽ hiện lên trang của bạn đã tạo...
Còn các bài viết theo chủ đề (Nhãn) thì bạn nên tạo hộp menu xổ xuống thì đẹp và gọn hơn (xem hương dẫn TẠI ĐÂY)
Chúc các bạn có một menu đẹp cho blog của mình
{ 0 comments... read them below or add one }
Post a Comment