Breadcrumbs là một trợ giúp chuyển hướng sử dụng trong giao diện người dùng. Nó cho phép người dùng để theo dõi vị trí của họ trong chương trìnhhoặc tài liệu. Thuật ngữ này xuất phát từ các dấu vết của đường điều hướng bên trái củaHansel and Gretel trong các câu chuyện cổ tích phổ biến.
Breadcrumbs thường xuất hiện theo chiều ngang trên đầu trang của một trang web, thường là dưới thanh tiêu đề hoặc tiêu đề. Họ cung cấp các liên kết mỗi trang trước đó người dùngđiều hướng thông qua để đến trang hiện tại hoặc trong trang web thứ bậc cấu trúc các trang cha mẹ hiện tại. Breadcrumbs cung cấp một đường mòn cho người sử dụng để theo dõi quay trở lại điểm khởi đầu, nhập cảnh. Một dấu hiệu lớn hơn (>) thường phục vụ như hệ thống phân cấp phân cách, mặc dù các nhà thiết kế có thể sử dụng các glyphs khác (chẳng hạn như »hoặc>), đồ họa cũng như phương pháp điều trị khác nhau
Breadcrumbs trail in search engine results page.
Breadcrumbs trail in Blogger blog
Để cài đặt Breadcrubms Blogger của bạn / blog Blogspot thực hiện theo các bước sau.
Step 1 :
Đăng nhập vào Blogger, vào Thiết kế / Layout> Edit HTML và đánh dấu vào hộp kiểm"Expand Widget Templates".
Step 2 :
Bây giờ tìm thấy (CTRL + F) này trong các mã:
<b:include data='top' name='status-message'/>
Đặt đoạn mã sau dưới đây / sau khi nó.
<b:include data='posts' name='breadcrumb'/>
Step 3 :
Bây giờ tìm thấy (CTRL + F) này trong các mã:
<b:includable id='main' var='top'>
Thay thế các đoạn mã trên với đoạn code dưới đây
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- No breadcrumb on home page -->
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'> »
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
»Unlabelled
</b:if>
» <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='post-labels'>
<a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<p class='breadcrumbs'>
<span class='post-labels'>
<b:if cond='data:blog.pageName == ""'>
<a expr:href='data:blog.homepageUrl'>Home</a> » All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
Step 4 :
Now find (CTRL+F) this in the code:
]]></b:skin>
Và đặt mã sau đây trước / phía trên nó.
.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}
Step 5 :
Nếu bạn muốn giới hạn bài khi click vào breadcrum giống giới hạn ở trang nhãn label thì bạn vào dòng sau : + "?max-results=7" vào sau dòng có chữ màu xanh.
Save the template
