Các Bạn Vui Lòng Chờ Trong Giây Lát Đang tải dữ liệu Từ ITnguyenHuy...
Thứ Tư, 26 tháng 9, 2012 - 0 nhận xét

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


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

(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(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_UkghyOc1r2VO42eWwCHgpHaCIqY4X4AWd4JFPhpqjk2MNPGAX-tboJWeDICs7A7S9qATBtmCdbpdbUh29W4yE_SaP8BPU_YS6nKwxfFbOWVn0_2z_n0gTR7eE_ZkNBQIyZF1iB7k-Ox3/) 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


Nguồn: TRAIDATMUI.com

0 nhận xét:

Đăng nhận xét

Liên Hệ Email

Bắc
Trung
Nam
piano
Guita
trống

* Required Create Email Forms

Recent Posts

Danh Mục Bài Viết!!!