Tạo thanh trạng thái Breadcrumbs cho blogspot

Điểm 4.6/5 dựa vào 87 đánh giá

(Traidatmui.com) - Hôm nay chũng ta sẽ cùng thực hiện thủ thuật tạo gọi là "Tạo thanh trạng thái Breadcrumbs cho Blogspot". Đây là công cụ hiển thị trạng thái xem bài, nó cho người dùng có thể nhìn thấy và biết được vị trí của bài viết đó. Biết được họ đang xem bài viết nào? Trong thư mục nào? Bạn có thể thấy rỏ hơn cách hiển thị của công cụ này bằng hình ảnh bên dưới.

Hình ảnh minh họa

Bắt đầu thủ thuật

1. Đăng nhập tài khoản Blogger
2. Vào phần thiết kế (hay bố cục)
3. Vào tiếp phần chỉnh sửa HTML, chọn mở rộng mẫu tiện ích (Expand Widget Templates)
4. Chèn code bên dưới vào trước thẻ ]]></b:skin>

.breadcrumbs {
margin:40px 0px 0px 10px;
font-size:11px;
color:#fff;
}
.breadcrumbs a{color:#10d9e0;}
.breadcrumbs a:hover{color:#ff0033;}
.breadcrumbs-labelname {
margin:0px 0px 0px 1px;
padding-left:6px;background:url(http://lh5.ggpht.com/_BTztXRwC9ik/TTj-dOd4cCI/AAAAAAAAGvw/XbJObAaTKIQ/arrow.png) no-repeat left;}

5. Bây giờ bạn tìm đến dòng code như bên dưới (hoặc tương tự)

<b:includable id='post' var='post'>

6. Chèn code bên dưới vào ngay sau code vừa tìm được

<div class='breadcrumbs'><b:if cond='data:blog.pageType == "item"'> <a expr:href='data:blog.homepageUrl' rel='tag'> Home</a>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'> <span class='breadcrumbs-labelname'><a expr:href='data:label.url + "?max-results=5"' rel='tag'> <data:label.name/></a></span> </b:if> </b:loop> <span class='breadcrumbs-labelname'><data:post.title/></span></b:if></div>

Bạn có thể tùy chỉnh số bài viết hiển thị trong nhãn khi người dùng click vào nhãn mà họ muốn xem trong thanh Breadcrumbs này. Bạn chỉnh số "5" trong code lại theo ý bạn là được.

7. Cuối cùng save (Bạn có thể click xem một bài viết để kiểm tra)

Chúc bạn thành công

Chuyên mục: Blogspot nâng cao