Hướng dẫn tạo Menu cố định cho blogspot

Người Đăng: Unknown

Wednesday, May 28, 2014

Chia Sẻ :

Tweet

Sau đây mình sẽ hướng dẫn các bạn cách tạo một menu cố định cho blogspot luôn luôn hiện khi các bạn kéo trang từ trên xuống dưới nhé.

Bước 1:

- Các bạn vào phần chỉnh sửa mẫu của blog.

- Vào phần chỉnh sửa HTML

- Tìm thẻ: ]]></b:skin>

- Dán code sau và trước thẻ ]]></b:skin>:

/* PHAMDUYKHANH MENU */
#phamduykhanh_menu{background-color:#2F2E2C;height:34px;width:100%;min-width:960px;position:fixed;top:1;left:0;z-index:9999;overflow:hidden;border-top:0 solid #00AFF9;height:34px;width:100%;min-width:960;position:fixed;top:0;left:0;z-index:9999;overflow:hidden;border-bottom:1px solid #00AFF9;}
#phamduykhanh_menu ul{list-style:none;margin:auto;width:960px}
#phamduykhanh_menu ul li{float:left;}
#phamduykhanh_menu ul li a{line-height:34px;padding:0 15px;color:#f0e8e5;font-size:12px;font-family:Arial;text-shadow:0px -1px 0px
#0f669f;display:block;text-decoration:none;border-right: 0px solid #00AFF9;border-left:0px solid #00AFF9;}
#phamduykhanh_menu ul li a:hover{background-color:#FF0000;color:yellow;}  

Hình minh họa như sau:

Minh họa bước 1

Bước 2: 

- Vào phần bố cục Blog.

- Chọn thêm tiện ích

- Thêm tiện ích HTML/Javascript.

- Dán code sau vào khung nội dung của tiện ích HTML/Javascript.

<div id='phamduykhanh_menu'>
    <ul>
    <li style='border-left:1px solid rgba(30, 30, 30, 0.125);'><a href='/'><img alt='Home' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYsZEIvSJ-1HE8-BSkkYKCojxV3hhdE3ii0pVc1VgZTzQxZf5DAx5zGQGJlYO3eBTmOTWdDNMOvrlGiLJo-EsG8frNQcQp1Zy3JbxK5EJkFapDWRabNtMooeKTsdYLBHogO75i4SfUXKE/s1600/home_icon.gif' style='padding:0px;'/></a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Tin%20t%E1%BB%A9c%20-%20S%E1%BB%B1%20ki%E1%BB%87n'>TIN TỨC - SỰ KIỆN</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/T%C3%ACnh%20y%C3%AAu'>TÌNH YÊU</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Th%C3%B4ng%20%C4%91i%E1%BB%87p%20cu%E1%BB%99c%20s%E1%BB%91ng'>CUỘC SỐNG</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Clip%20hot'>CLIP HOT</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Ngh%E1%BB%87%20thu%E1%BA%ADt'>NGHỆ THUẬT</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Club%20th%C6%A1%20th%E1%BA%A9n'>THƠ THẨN</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Th%E1%BB%A7%20thu%E1%BA%ADt%20m%C3%A1y%20t%C3%ADnh'>THỦ THUẬT MÁY TÍNH</a></li>
    <li><a href='http://www.duongdoi8x.com/search/label/Th%E1%BB%A7%20thu%E1%BA%ADt%20web'>THỦ THUẬT WEB</a></li>
    </ul>
    </div>

Minh họa bước 2

- Chú ý: Thay link  của bạn vào sau <a href=link của bạn nhé.

Sau đó lưu lại

Bước 3: 

- Lưu lại bố cục thế là xong.

- Kết quả là đây:

Kết quả

Cuối cùng: Chúc các bạn thành công với việc thêm Menu này vào blog cho tiện.

Have Fun!

Tác giả: Phạm Duy Khánh

Tag : Blogger, Tips Web