Tạo thanh điều hướng tối ưu hóa SEO cho Blogger

Trước đây vài tháng mình có đăng một bài viết trên blog 7phut.net về thủ thuật tạo thanh điều hướng SEO cho Blogger, hôm nay mình xin post lại nguyên mẫu bài viết cũ và sửa lại một số thành phần cấu trúc link.

1. Đăng nhập vào Blogger.com sau đó tiến hành chỉnh sửa mẫu
2. Bật chế độ xem toàn bộ code chi tiết (Expand Widget Templates) và tìm ]]></b:skin>.
Thay thế  ]]></b:skin> bằng đoạn CSS

.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{display:block;height:16px;float:left;text-indent:-9999px;background-repeat:no-repeat;}
 ]]></b:skin>

Tiếp tục bấm vào form HTML và nhấn Ctrl+F để tìm đoạn XML sau :

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

Thay thế nó bằng :

<b:includable id='post' var='post'> <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'>Trang chủ</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;Tổng hợp
</b:if>
</b:loop>
&#187; <data:post.title/>
</div>
</b:if>

Sao lưu kết quả,  và kiểm tra bằng công cụ kiểm tra cấu trúc của google tại đây : Link
Chúc các bạn thực hiện thành công !

Tin Học Số ( TinHocSo.Net )