Note Đóng lại
Giải pháp bán hàng online Số 1 Việt Nam

Tạo menu ngang trên phần Header

Các Tempplate cơ bản của Blogger thường không có thanh menu ngang trên phần Header. Một kiểu menu như vậy giúp bạn có thêm không gian web để bố trí các liên kết cần thiết cho blog.
Để tạo kiểu menu này, bạn hãy thực hiện như sau.
Bước 1. Đăng nhập Blogger, vào Design >> Edit HTML. Đặt đoạn code CSS sau đây vào trước dòng ]]</b:skin>.

/* ----- LINKBAR ----- */
#linkbar {
margin: 6px 0px 0px 0px;
padding: 0px 0px 0px 0px;
width: 100%;
position: relative;
background: #000;
border: 1px solid #000;
border-bottom: 0;
}
#linkbar ul {
margin: 0px 0px 0px 0px;
padding: 5px 5px 7px 5px;
text-align: left;
list-style-type:none;
}
#linkbar li {
display: inline;
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
}
#linkbar h2 {
margin: 0px 0px 0px 0px;
padding: 0px 0px 0px 0px;
display: none;
visibility: hidden;
}
#linkbar a {
clear: both;
margin: 0px -4px 0px 0px;
padding: 3px 20px 3px 20px;
width:100%;
text-decoration:none;
font-family: arial, sans-serif;
font-weight: bold;
font-size: 12px;
color: #fff;
border-right: 1px solid #fff;
}
#linkbar a:hover {
color: #000;
background: #fff;
}

Bước 2. Tìm dòng <div id='header-wrapper'> và đặt trước nó với đoạn code bên dưới. (Đối với Template Simple sẵn có của Blogger hiện nay thì đặt trước thẻ <header>).

<div id='linkbar-wrapper'>
<b:section class='linkbar' id='linkbar' showaddelement='no'>
<b:widget id='LinkList1' locked='true' title='Linkbar' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>
</b:section>
</div>

Lưu Template.

Bước 3. Vào Page Elements. Bạn sẽ nhìn thấy trên đỉnh Template có một tiện ích tên là Linkbar nằm trên phần Header, nhấn vào nút Edit. Tại cửa sổ mới, bạn lần lượt thêm các URL và tên cho các liên kết.


 Nguồn Blog Huynh Nhat Ha

Bạn đã xem chưa

6 nhận xét | Viết lời bình

Nếu bạn muốn làm menu gióng mình thì tham khảo tại link trang sau:
http://www.fandung.com/2011/06/mega-dropdown-menu-css.html

Minh thông báo: Người bình luận có tên Nặc danh/Anonymous không được phép bình luận tại đây.

Khi bạn copy nó có đường dẫn của trang web này, bạn chỉ càn xóa nó đi là được. chúc bạn vui vẻ!

Thank for share.

Một trang web có nhiều thủ thuật mới và hay: www.batuan.info

anh ơi em giờ mới tập tạo 1 cái blog :http://thegioikem.blogspot.com/
tại sao cái mennu ngang của em nó lại ở trên cùng thế nhỉ..
anh có thể giúp em làm nó nằm giống như blog của anh đc ko ?
em cảm ơn anh nhiều ạ



Copyright © 2014 Blog Thông Tin Tổng Hợp