Có một bạn đã nhờ mình hướng dẫn tạo thanh menu cố định như ở đầu trang blog của mình nên tối nay mình viết hướng dẫn này để thực hiện thủ thuật trên cho mọi người.
1. Vào Thiết kế→ chỉnh sửa HTML và chèn đoạn css sau vào trước thẻ ]]></b:skin>
#topmenu-outer{z-index:30; height:20px;width:100%;background:#545454; color:#fff; text-shadow:1px 1px 1px #000; top:0px;right:0px; position:fixed;padding:5px;}2. Dùng từ khóa <body tìm đoạn code có dạng
#topmenu{width:990px;margin:auto;}
#topmenu1{width:790px;float:left;}
#topmenu1 ul{margin:0; padding:0}
#topmenu1 ul li{display: inline; margin:0;}
#topmenu1 ul li:first-child{padding:5px 0;}
#topmenu1 ul li a{font-weight:bold; color: #fff; text-shadow:1px 1px 3px #000; margin:auto;padding:7px 10px;}
#topmenu1 ul li a:hover{background:#fff; color:#fff; margin:0; text-shadow:1px 1px 3px #000}
#topmenu2{width:200px;float:left;}
.search-text{width:200px; border:none;margin:auto}
<body> hoặc <body ...> (phần ... có thể khác nhau tùy blog)
3. Chèn đoạn code sau vào phía dưới thẻ body tìm được ở bước 2.
<div id='topmenu-outer'>
<div id='topmenu'>
<div id='topmenu1'>
<b:section class='top-menu' id='top-menu' showaddelement='no'>
<b:widget id='LinkList30' locked='true' title='' type='LinkList'/>
</b:section>
</div>
<div id='topmenu2'><form action='http://www.google.com.vn/search' method='get' target='_blank'>
<input class='search-text' id='search-text' name='q' onblur='if (this.value == "") {this.value = "Tìm kiếm thủ thuật ...";}' onfocus='if (this.value == "Tìm kiếm ...") {this.value = ""}' tabindex='7' type='text' value='Tìm kiếm ...'/>
<input checked='checked' name='sitesearch' type='hidden' value='www.voalo.blogspot.com'/>
</form></div>
<div style='clear:both'/>
</div>
</div>
4. Save template lại rồi về mục Phần Tử Trang sẽ thấy xuất hiện một tiện ích Danh Sách Liên Kết ở đầu trang. Bạn chọn vào chỉnh sửa và thêm liên kết muốn xuất hiện ở top menu vào rồi lưu lại là được. Sau này muốn chỉnh sửa cũng sẽ tiện hơn nhiều.
Nếu có vấn đề gì không thực hiện được bạn để lại comment bên dưới mình sẽ trả lời trong thời gian sớm nhất có thể. Chúc bạn thành công.
Không có nhận xét nào:
Đăng nhận xét