Sửa breadcumbs hiển thị trên Google theo Label (Nhãn) cho Blogspot
trong
Blogspot Tips
Giải đáp thắc mắc cho các bạn tại sao url không hiển thị theo label khi search trên google. Điều này hoàn toàn phụ thuộc vào template blogspot mà bạn đang sử dụng.
Bản thân trang web toilaquantri.com đã qua nhiều đợt thay đổi template và kết quả mình quan sát là kết quả hiển thị nào phụ thuộc vào code breadrumbs của template đó.
Nhiều bạn thích url hiển thị theo dạng Domain > label 1 > label 2 > label 3.... hơn là dạng Domain > url. Do vậy mình sẽ hướng dẫn bạn fix lại dạng này.
Vậy để làm Breadcumbs hiển thị trên Google theo Label (Nhãn) cho Blogspot bạn làm theo hướng dẫn sau.
Trong Mẫu:
Phần này mình sẽ không hướng dẫn nhiều nhé (riêng bạn nào mới chơi blog không biết code kiết là gì thì để lại bình luận bên dưới mình hd riêng.)
.breadcrumbs a{color:#666;font-weight:bold}.breadcrumbs a:hover{color:#777}.breadcrumbs-labelname{margin:0 0 0 1px;padding-left:5px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMcYVG90NXHq_34pg9UHrQSMFMfzgxPcty5dlfLWQw72PCd5RlrzZqPrMWJO2PVTlf9NejU-hbBVs_8PnhD3Wv6r7iUytYs7tHAcKH64cJDu7X5QfWqei9a1YKk2dbheRGTuX3X_ZHdij3/s5/arrow%2520%25281%2529.png) left center no-repeat}
Bản thân trang web toilaquantri.com đã qua nhiều đợt thay đổi template và kết quả mình quan sát là kết quả hiển thị nào phụ thuộc vào code breadrumbs của template đó.
Nhiều bạn thích url hiển thị theo dạng Domain > label 1 > label 2 > label 3.... hơn là dạng Domain > url. Do vậy mình sẽ hướng dẫn bạn fix lại dạng này.
Vậy để làm Breadcumbs hiển thị trên Google theo Label (Nhãn) cho Blogspot bạn làm theo hướng dẫn sau.
Trong Mẫu:
Bước 1: Xóa CSS và HTML của Breadcumbs cũ
Bạn tìm theo chữ breadcumb và xóa code cũ trong web của bạn đi nhé!Phần này mình sẽ không hướng dẫn nhiều nhé (riêng bạn nào mới chơi blog không biết code kiết là gì thì để lại bình luận bên dưới mình hd riêng.)
Bước 2: Chèn CSS dưới trên /b:skin
.breadcrumbs{background: #e8e8e8; word-wrap: break-word;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;margin: -7px -10px 0px -10px;padding: 8px 12px; font: normal 14px Roboto}.breadcrumbs a{color:#666;font-weight:bold}.breadcrumbs a:hover{color:#777}.breadcrumbs-labelname{margin:0 0 0 1px;padding-left:5px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMcYVG90NXHq_34pg9UHrQSMFMfzgxPcty5dlfLWQw72PCd5RlrzZqPrMWJO2PVTlf9NejU-hbBVs_8PnhD3Wv6r7iUytYs7tHAcKH64cJDu7X5QfWqei9a1YKk2dbheRGTuX3X_ZHdij3/s5/arrow%2520%25281%2529.png) left center no-repeat}
Bước 3: Chèn HTML breabcumbs tại vị trí hiển thị
Chèn code breamcumbs bên dưới trên của tiêu đề bài viết (Nếu chèn breabcumbs trên tiêu đề).
<b:if cond='data:blog.pageType == "item"'>
<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> <brc>/</brc>
<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 + "?&max-results=10"' property='v:title' rel='v:url'><data:label.name/></a></span>
<b:if cond='data:label.isLast != "true"'><brc>/</brc></b:if>
</b:loop>
<b:else/>
Unlabelled
</b:if>
<brc>/</brc> <span><data:post.title/></span>
</b:loop>
</div>
</b:if>
Bước 4: Cho Google index lại toàn bộ trang và chờ kết quả
Chúc bạn thành công!
Tôi Là Quản Trị
