1/25/13

Hướng dẫn tạo Breadcrumbs cho blogger


1- Đăng nhập Blogger
2- Vào Mẫu (Template)
3- Chọn tab Chỉnh Sửa HTML (Edit HTML) => TIếp tục (proceed) => Chọn Mở Rộng tiện ích mẫu (Expand Widget Templates).
4- Thêm đoạn code sau trước thẻ ]]></b:skin> .
.breadcrumbs{padding:5px;background-color:#EEE;font-size:90%;color:black;height:16px;line-height:16px}
.breadcrumbs{padding:5px;background-color:#EEE;font-size:80%;color:black;height:16px;line-height:16px}
.breadcrumbs a{color:#B30B0B}
.breadcrumbs a:hover{color:black}
a.bhome{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpGu3H4T6SpvuuwvDenWsN8dlZi_I8eNH5_iPCrktcmtc0cKRUBD_wzaM3xhwJBcCUnG5FKyGDGt0JohRUKmvwihOoEbrslx4AO9HCD8apnMRQl1ccKPiLkrXXO8EIeazGtrceSoCLd2k/s1600/home-namkna.png);width:20px;display:block;height:16px;float:left;text-indent:-9999px;background-repeat:no-repeat;}
5- Tìm thẻ sau:
<b:includable id='post' var='post'>
6- Thêm đoạn code sau vào bên dưới đoạn code trên:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
<span typeof='v:Breadcrumb'><a class='bhome' expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
&#187;
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<span typeof='v:Breadcrumb'>
<a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
<b:if cond='data:label.isLast != &quot;true&quot;'> &#187; </b:if>
</b:loop>
<b:else/>
&#187;Unlabelled
</b:if>
</b:loop>
&#187; <data:post.title/>
</div>
</b:if>
- Nếu không thích hiện tiêu đề bài viết sau khi kết thúc các nhãn thì thay phần &#187; <data:post.title/> thành chữ khác hoặc xóa bỏ nó đi.
7- Lưu mẫu lại và xem thành quả!

0 nhận xét:

Post a Comment