Cách tạo Breadcrumbs cho blogspot

Vì cuộc sống là luôn chia sẻ lên sau đây mình xin giới thiệu với mọi người cách tạo Breadcrumbs cho blogspot để nó hiển thị đẹp hơn trên kết quả tìm kiếm (thấy hay thì nhớ nhấn thank nhé các bác) cái này em đã áp dụng thành công cho blog cho thuê xe của em :

chothuexepro.blogspot.com/

các bác co thể ghé thăm blog của em để xem demo
Hiển thị trên blog của mình:
Breadcrumbs-1.jpg

Điều bạn cần biết
1. Breadcrumbs là gì ?
- Breadcrumbs là 1 dạng tập hợp các liên kết giúp người xem Website xác định được vị trí của mình trong Site đó:
Ví dụ: Bạn đang ở Home >> Cho thuê xe >> Thuê xe du lịch >> Cho thuê xe du lịch 24 chỗ
Ảnh hiển thị trên kết quả tìm kiếm google
Breadcrumbs.png

2. Lợi ích của Breadcrumbs
Người dùng biết được vị trí của mình trên Site
Tạo sự khác biệt và đẹp hơn trên kết quả tìm kiếm
Thuận tiện di chuyển đến các trang mà không phải di chuyển vể trang chủ
Breadcrumbs giúp ích cho việc SEO: giảm tỷ lệ thoát của website.
Google cũng đánh giá thông qua Breadcrumbs của site.
Như vậy việc tạo Breadcrumbs rất cần thiết cho việc SEO website, SEO blogger.
3. Hướng dẫn tạo breadcrumbs cho blogger (blogspot)

B1: Vào Template (Mẫu) > Edit HTML (chỉnh sửa HTML) chọn Expand the Widget Templates (Mở rộng Mẫu tiện ích)

B2:Thêm mã css sau và trước ]]></b:skin>

#Breadcrumbs{color: #000;font-size: 14px;margin-bottom:15px;padding:10px;background:#FFF;border:2p x solid #BBBBBB; font-weight:bold; text-decoration:none; }
#Breadcrumbs a{color: #000,font-size: 14px}
#Breadcrumbs div{float: left;}

B3:
Tìm đoạn code sau:

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

và thêm dưới nó đoạn code:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='Breadcrumbs'>
<div itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url' rel='tag'> <span itemprop='title'><data:blog.title/></span></a> »</div>
<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 == &quot;true&quot;'>
<div itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'>
<a expr:href='data:label.url' itemprop='url' rel='tag'><span itemprop='title'><data:label.name/></span></a> »</div>
</b:if>
</b:loop>
<span><data:post.title/></span>
</b:if>
</b:loop>
</div>
</b:if>

Bạn có thể thay phần chữ màu kia thành "Home" hay chữ j tùy ý cũng được ko để vậy nó sẽ tự động lấy title của blog bạn chèn vào

Chú ý bạn cần sủa lại file robots.txt của blogspot cho phép nó index cả label nhé

Cuối cùng là bạn đợi google update lại web của bạn thôi chúc các bác thành công