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;}
2. Langkah selanjutnya Cari kode HTML post Seperti di bawah
ini
<b:includable id='main' var='top'>...</b:includable>
3. Kemudian Tambahkan Kode HTML Breadcrumbs 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 == "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.
EmoticonEmoticon