Tạo breadcrumbs trong blogspot

Tweet

Pin It

Vai trò của breadcrumbs trong blogspot và web khá quan trọng. Nó giúp người xem biết mình đang ở đâu trong tổng thể cấu trúc website, giữ họ ở lại lâu hơn, dễ dàng di chuyển giữa các trang.

Để tạo breadcrumbs trong blogspot:

1. Các bạn vào bảng quản trị, Mẫu > Chỉnh sửa Html > ấn Ctlr F tìm với ]]></b:skin> và thêm vào trước nó đoạn code sau:
 

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

#Breadcrumbs a{color: #000,font-size: 12px}

#Breadcrumbs div{float: left;}

2. Các bạn Ctrl F tìm đến đoạn code sau <b:includable id='post' var='post'>
và thêm vào 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'>Home</span></a> &#187; </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> &#187; </div>
</b:if>
</b:loop>
<span><data:post.title/></span>
</b:if>
</b:loop>
</div>
</b:if>

Sau đó lưu kết quả lại.

Breadcrumb ( bánh mì vụn ) được bắt nguồn từ truyện cổ Grim: Hênxen và Grêten. Hai anh em bị bỏ lại trong rừng, người anh dọc đường đã bẻ bánh mì, rắc dọc đường đi để tìm về nhà.

Chia sẻ bài viết