Cách tạo Breadcrumb chuẩn Seo đẹp nhất cho blogger

Breadcrumb là gì? Làm thế nào để tạo Breadcrumb chuẩn Seo? Bài viết này sẽ hướng dẫn mọi người cách tạo Breadcrumb chuẩn Seo đẹp nhất dành cho Blogger blogspot.

Cách tạo Breadcrumb chuẩn Seo đẹp nhất cho blogger

Breadcrumb là một đường dẫn đã cấp cho khách ghé thăm blog của bạn biết họ đang ở vị trí nào trong blog, một độc giả có thể di chuyển từ trang này tới trang khác một cách nhanh chóng nhất. Breadcrumb khi thêm cho blogger sẽ thân thiện hơn với công cụ tìm kiếm (Search Engine), với seo web hay seo blogger blogspot là rất cần thiết, hơn nữa việc thêm tiện ích này vào sẽ giúp bạn seo bài viết của bạn được tốt hơn. Dưới đây sẽ hướng dẫn từng bước bạn cách tạo một breadcrumb chuẩn seo nhất cho blogger, nào bắt đầu nhé!

Cách tạo Breadcrumb chuẩn Seo đẹp nhất cho blogger

#Bước 1: Đăng nhập vào Blogger >> Mẫu (Template) >> Đi tới chỉnh sửa HTML

#Bước 2: Ấn Ctrl + F tìm </b:skin> chèn CSS lên phía bên trên thẻ vừa tìm thấy

/*Breadcrumbs*/
.breadcrumbs{background:#fff;color:#000;margin:0;padding:5px 20px;border:1px solid #ccc}
.breadcrumbs a{color:#000}
.breadcrumbs a:hover{color:#bbb}

#Bước 3: Ấn Ctrl + F tìm tới <b:includable id='main' var='top'> chèn đoàn code xuống phía dưới thẻ <b:includable id='main' var='top'>

<b:include data='posts' name='breadcrumb'/>

#Bước 4: Tiếp tục tìm <b:includable id='backlinks' var='post'/> bằng Ctrl + F chèn đoạn code lên phiá bên trên đoạn vừa tìm thấy

<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' title='Beranda'>Beranda</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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' title='Home'><span itemprop='title'>Home</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 + &quot;?max-results=5&quot;' expr:title='data:label.name' 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' title='Home'>Home</a></span> &#187; <span>Tanpa Label</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Lưu trữ <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' title='Home'>Home</a></span> &#187; <span>Tất cả bài viết</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> &#187; <span>Tìm kiếm <data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

#Bước 5: Lưu lại để xem kết quả

Đây là một dạng breadcrumb cực kỳ hiều quả trong việc tối ưu hóa seo onpage cho website blog của bạn. Chúc bạn thành công!