Sedikit Info Seputar
Basic Pembuatan Breadcrumb di Blog
Terbaru 2017
- Hay gaes kali ini team Free Template BLogspot.Com, kali ini akan membahas artikel dengan judul Basic Pembuatan Breadcrumb di Blog, kami selaku Team Free Template BLogspot.Com telah mempersiapkan artikel ini untuk sobat sobat yang menyukai Free Template BLogspot.Com. semoga isi postingan tentang
Artikel Basic,
Artikel BLOGGER,
Artikel SEO, yang saya posting kali ini dapat dipahami dengan mudah serta memberi manfa'at bagi kalian semua, walaupun tidak sempurna setidaknya artikel kami memberi sedikit informasi kepada kalian semua. ok langsung simak aja sob
Judul:
Berbagi Info Seputar
Basic Pembuatan Breadcrumb di Blog
Terbaru
link: Basic Pembuatan Breadcrumb di Blog
Berbagi Basic Pembuatan Breadcrumb di Blog Terbaru dan Terlengkap 2017
Malam ini saya hanya ingin sedikit berbagi tentang Basic Cara Pembuatan Breadcrumb di Blog , ada yang tahu "Breadcrumb?" untuk yang belum tahu seperti apa Breadcrumb yang saya maksud, berikut penjelasannya :Sekilas Tentang "Breadcrumb"
Breadcrumb adalah navigasi menu untuk memudahkan pengunjung web/blog melacak lokasi dalam dokumen dan kembali ke halaman awal dengan mudah.Posisi Breadcrumb sendiri tidak selalu berada di bawah judul Blog / di atas blog , tapi breadcrumb ini sendiri bisa kita simpan dimana saja. Namun disini saya hanya akan memberitahukan cara membuat Breadcrumb sederhana atau bisa di bilang "Basic" kenapa? karena yang saya bagikan disini hanya cara Pemasangan Breadcrumb di blog pada intinya saja . selanjutnya bisa Sobat kreasikan sendiri .
Seperti apa Breadcrumb ini ? , berikut contoh nya :
Cara Pemasangan :
Langkah #1 - Pastikan Sobat sudah Login Blogger > Template > Edit HTML, setelah masuk pada area HTML Editor silahkan cari kode</head>
lalu simpan kode dibawah ini di tepat di atas nya :
<style type="text/css">
.breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb;}
</style>
Langkah #2 - Setelah itu cari kode
<b:includable id='main' var='top'>
, lalu ganti dengan kode di bawah ini :
<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'>Halaman Pertama</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' property='v:title' rel='v:url'>Halaman Pertama</a></span>
<b:loop values='data:post.labels' var='label'>
» <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
» <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Halaman Pertama</a></span> » <span>Tanpa Kategori.</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'>Halaman Pertama</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'>Halaman Pertama</a></span> » <span>Menampilkan Semua Posting</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Halaman Pertama</a></span> » <span>Pencarian dengan kata kunci "<b><data:blog.pageName/></b>"</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'/>
Langkah Terakhir! - Simpan Template! :)
Untuk melihat perubahan nya, silahkan lihat menggunakan Rich Snippet Tools
Atau melalui Link Rich Snippet di bawah ini :
http://www.google.com/webmasters/tools/richsnippets
Untuk mencoba apakah tampil beberapa label, copy postingan Anda yang mempunya label lebih dari 1. dan klik Pratinjau. Kalau sudah berhasil berarti breadcrumbs terpasang dengan baik.