Thanh Điều Hướng Cho Blogger

Hướng dẫn thêm Thanh Điều Hướng vào blogspot theo yêu cầu của bạn tumi nguyen tại đây

Bước 1: Vào Blogger > Mẫu > Chỉnh sửa HTML
Bước 2: Chọn mở rộng mẫu Tiện Ích
Bước 3: Tìm thẻ <b:include data='top' name='status-message'/> và dán trước nó đoạn code bên dưới

<b:include data='posts' name='breadcrumb'/>

Bước 4: Tìm thẻ <b:includable id='main' var='top'> và dán trước nó đoạn code bên dưới

<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == "static_page"'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- breadcrumb for the post page -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs' xmlns:v="http://rdf.data-vocabulary.org/#">
<span typeof="v:Breadcrumb"><a expr:href='data:blog.homepageUrl' rel="v:url" property="v:title">Home</a></span>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.isLast == "true"'>
 » <span typeof="v:Breadcrumb"><a expr:href='data:label.url' rel="v:url" property="v:title"><data:label.name/></a></span>
</b:if>
</b:loop>
 » <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> » <span>Unlabelled</span> » <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == "archive"'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Archives for <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> » <span>Posts filed under <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

• Nếu tìm thấy hai thẻ <b:includable id='main' var='top'> thì dán code phía trên vào thẻ thứ hai

Bước 5: Lưu template lại
Để tùy chỉnh thanh điều hướng nhỏ hơn và màu chữ theo ý muốn trong template bạn chèn đoạn code sau trước thẻ ]]></b:skin>

.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:3px double #e6e4e3;
}

Update: Thanh điều hướng mới có khả năng hiển thị cho bài viết gắn nhiều nhãn và tự động hoàn toàn không phải dùng phương pháp thủ công là thêm từng nhãn vào trong template. Bạn hãy tham khảo tại đây