Cara MemasangBreadcrumbs SEO Friendly di Blog – Menyediakan Blog atau Website yang menarik dan memiliki sistem navigasi yang lengkap adalah suatu kewajiban bagi para Blogger untuk selalu memberikan informasi terbaik pada pengunjung. Dengan bagusnya tampilan blog dan sistem navigasi yang sangat menarik sekaligus mudah untuk di gunakan, maka Pengunjung akan sangat suka dengan blog anda sehingga menjadi Langganan di blog anda.
Anda tahu Breadcrumbs?. Ya, Breadcrumbs adalah salah satu dari bagian sistem navigasi di blog dan merupakan pendukung SEO sebuah blog. Breadcrumbs adalah sebuah menu navigasi yang biasanya berada di atas judul postingan suatu blog atau website. Isinya berupa Link menuju Halaman utama atau Home yang di ikuti dengan Lebel Artikel dan Judul Artikel yang di buka.
Kenapa Breadcrumbs bisa di katakan sebagai salah satu Faktor SEO?, karena dengan Breadcrumbs kita bisa menginformasikan kepada pengunjung mengenai katagori dari artikel yang ada di blog tersebut dan semua template Blog SEO pasti Memiliki Breadcrumbs namun dengan tema atau gambarran yang berbeda-beda.
Cara memasang Breadcrumbs yang saya ajarkan kali ini memiliki kelebihan, yaitu SEO Friendly. Breadcrumbs ini sudah saya buktikan sendiri tingkat SEO nya dengan tidak memberatkan loading sebuah blog dan sangat bagus dan pas di pasang di blog apa saja. semua lebel dapat terindeks Oleh Search Engine dan tentunya Valid HTML 5. Bagaimana cara memasangnya?, berikut ini informasinya.
Cara Membuat dan Memasang Breadcrumbs SEO Friendly di Blog Dengan Mudah
1.Buka Blog > Klik Teemplate > Edit HTML > Kemudian tambahkan kode CSS di bawah ini sebelum ]]></b:skin> atau </style>
]]></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;}
<b:includable id='main' var='top'>...</b:includable>
<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' title='Home'>Home</a></span> / <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == "item"'>
<!-- 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 + "?max-results=5"' 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 == "archive"'>
<!-- 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 == "index"'>
<div class='breadcrumbs'>
<b:if cond='data:blog.pageName == ""'>
<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>4.Terakhir Simpan Blog
Untuk mengetahui kode Breadcrumbs sudah terpasang dengan benar di Blog, sobat bisa Cek di sini Google Testing Tool
Demikianlah Mengenai CaraMemasang Breadcrumbs SEO Friendly di Blog. Cara ini terbukti amouh untuk menambah pundi-pundi pengunjung blog sobat dan juga menambah SEO Friendly blog Sobat. semoga bermanfaat.
0 Komentar