DuongDoiVN Blog: Breadcrumb

Breadcrumb tạo cho khách ghé thăm dễ dàng biết mình đang ở vị trí nào trong website của. Bài viết Hướng dẫn tạo breadcrumb cho blogspot chuẩn seo sẽ hướng dẫn mọi người làm như thế nào để tạo được một breadcrumb cực đẹp mà chuẩn seo.

Hướng dẫn tạo breadcrumb cho blogspot chuẩn seo

Bước 1: Đăng nhập vào Blogger => Ctrl + F tìm ]] </b:skin> và chèn đoạn code bên dưới trước thẻ vừa tìm thấy

.breadcrumbs {
word-wrap: break-word;
margin: 5px;
border: 1px solid #fff;
box-shadow: 1px 1px 5px rgba(1,1,1,.1);
overflow: hidden;
padding: 5px;
background: #fff;

Bước 2:Tìm đoạn code sau

<b:includable id='main' var='top'>

Thay code vừa tìm thấy bằng đ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 == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Trang chủ</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb trang bài viết -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'>Trang chủ</span></a></span>
<b:loop values='data:post.labels' var='label'>
  &#187; <span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Trang chủ</a></span> &#187; <span>Khác</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb cho trang nhãn và trang tìm kiếm.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> &#187; <span>Lưu trữ cho <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> &#187; <span>Tất cả bài viết</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> &#187; <span>Bài viết cho nhãn <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>

Bước 3: Chèn đoạn code bên dưới vào đoạn thẻ này

<b:includable id='backlinks' var='post'>...</b:includable>

Code để chèn tạo breadcrumb

<b:includable id='breadcrumb' var='posts'><b:if cond='data:blog.homepageUrl != data:blog.url'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Trang chủ</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- breadcrumb trang bài viết -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs'>
<span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:blog.homepageUrl' itemprop='url'><span itemprop='title'>Trang chủ</span></a></span>
<b:loop values='data:post.labels' var='label'>
  &#187; <span itemscope='' itemtype='http://data-vocabulary.org/Breadcrumb'><a expr:href='data:label.url' itemprop='url'><span itemprop='title'><data:label.name/></span></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Trang chủ</a></span> &#187; <span>Khác</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb cho trang nhãn và trang tìm kiếm.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> &#187; <span>Lưu trữ cho <data:blog.pageName/></span>
</div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> &#187; <span>Tất cả bài viết</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Trang chủ</a></span> &#187; <span>Bài viết cho nhãn <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>
<b:includable id='main' var='top'>
<b:include data='posts' name='breadcrumb'/>

Cuối cùng lưu lại xem tạo breadcrumb đã thành công chưa?

Chúc mừng bạn đã vọc xong cách tạo breadcrumb cho blogspot chuẩn seo . Thanks!

Tạo liên kết breadcrumbs cho blogspot, hướng dẫn tạo Breadcrums cho blogspot.

Breadcrumbs có rất nhiều lợi ích trong SEO, tốt cho cả blog và website. Với bài viết tạo liên kết Breadcrumbs trong blogspot này sẽ giúp cho website, blog của bạn tối ưu hơn.

Một số lợi ích của Breadcrumbs

Giúp người dùng biết được vị trí của mình trên website
Thuận tiện khi di chuyển giữa các trang, không phải quay trở về trang chủ
Giảm tỷ lệ thoát (bound rates) -> tăng chất lượng website & tỷ lệ mua hàng
Giúp Google đánh giá chính xác PR, PA và keyword relation của một trang web
Đánh giá được tổng thể cấu trúc của website
Bạn sẽ có nhiều cơ hội đạt vị trí cao với những từ khóa mong muốn.

Dưới đây là cách tạo liên kết Breadcrumbs trong blogspot

B1: Vào bảng điều khiển Blogger -> Mẫu (Template) -> Chỉnh sửa HTML (Edit HTML)

B2: Tìm tới đoạn code (Ctrl + F và gõ ]]></b:skin> => Enter ) ]]></b:skin> và dán code dưới đây ngay trên nó

.breadcrumbs {

padding:5px 5px 5px 0px;

margin: 0px 0px 15px 0px;

font-size:95%;

line-height: 1.4em;

border-bottom:3px double #e6e4e3;

}

B3: Bạn hãy tìm tới đoạn Code

<b:include data='top' name='status-message'/>

Dán dòng dưới đây ngay bên trên nó

<b:includable id='main' var='top'>

Bước 4: Chúng ta tìm tới dòng

<b:includable id='main' var='top'>

Dán code dưới đây ngay trên nó.

<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'>Trang 
chủ</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>

Như vậy các bạn đã biết cách tạo đường dẫn Breadcrumbs cho Blogspot rồi đấy, cũng khá đơn giản nhỉ? :)

DuongDoiVN Blog: Breadcrumb

DuongDoiVN Blog

Hướng dẫn tạo breadcrumb cho blogspot chuẩn seo

Hướng dẫn tạo breadcrumb cho blogspot chuẩn seo

Tạo liên kết breadcrumbs cho blogspot

Tạo liên kết breadcrumbs cho blogspot, hướng dẫn tạo Breadcrums cho blogspot.

Search Blog

Social Media

Popular Posts

All Categories

Latest Posts