Cara Mudah Memasang Breadcrumb SEO Friendly Valid HTML 5

Cara Mudah Memasang Breadcrumb SEO Friendly-Tehnik pemasangan Breadcrume ini juga berpengaruh untuk SEO.
Breadcrume tersendiri adalah navigasi yang biasanya berada di atas judul postingan yang mengandung sebuah link- link sistematis dan teratur dari home/beranda, lalu hingga sampai ke label navigasi konten halaman yang di kunjungi.

Setelah saya teliti, memang breadcrume yang saya pelajari dari banyak sumber ini memiliki beberapa kelebihan, diantaranya adalah SEO Friendly bahkan label-label yang ada di breadcrume ini bisa terindex oleh
Google.

Meski ini hanya sebuah "salah-satu" dari Tehnik SEO, tapi bukan berarti anda mengecualikan hal yang kecil ini bukan? hehe.

Cara Memasang Breadcrume SEO Friendly Valid HTML 5

• Masuk dulu ya ke akun Blogger
• Pada menu dashboard pilih Template
• Klik Edit HTML
• Masukkan Script di bawah ini, dan letakkan DIATAS ]]></b:skin>  atau </Style>

 /* Breadcrumbs */
.breadcrumbs{padding:20px 30px;background:#fff;margin-bottom:20px}
.breadcrumbs a,.post-info a {color:#19abea;}
.breadcrumbs a:hover,.post-info a:hover {color:#454545;}

•  Jangan di save dulu, cari lagi kode Script di bawah ini :

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

•  Setelah ketemu masukkan script CSS di bawah ini tepat DI BAWAH  kode DI ATAS.

<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='Home'>Home</a></span> / <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Breadcrumb Untuk Halaman Pos -->
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.labels'>
<div class='breadcrumbs'>
Anda di sini : <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'>
/ <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>
/ <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> / <span>Without Label</span> / <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- Breadcrumb Untuk Label Search dan Search Pages -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> / <span>Archived For <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> / <span>All Post</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl' title='Home'>Home</a></span> / <span><data:blog.pageName/></span>
</b:if>
</div>
</b:if>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

•  Udah belom? Berdoa dulu  Kalau udah silakan Save. 

Untuk membuktikan berhasil/tidak silakan cek saja di Google Testing Tool
Gimana? Mudah bukan Cara Mudah Memasang Breadcrumb SEO Friendly. Demikian tutorial kali ini, semoga artikel ini bermanfaat.

Share :