Cara Mudah Membuat Breadcrumb di Blogspot

Cara Mudah Membuat Breadcrumb di Blogspot – Breadcrumb adalah sejenis history atau sejarah ketika anda mengunjungi sebuah postingan atau artikel blog. Breadcrumb ini biasanya dipakai pada blog WordPress dan blog Blogspot yang memungkinkan Breadcrumb untuk Joomla juga ada. Untuk Breadcrumb di WordPress, biasanya sudah ada dan merupakan bagian penting dalam sebuah themes WordPress yang dipakai. Jadi anda tidak perlu bersusah payah mempelajari script breadcrumb pada blog WordPress karena sudah include didalamnya.
Bagaimana dengan blogspot ?? Blogspot atau Blogger sendiri adalah layanan gratis yang diberikan oleh Google kepada kita untuk membuat sebuah blog. Tema atau template yang disediakan oleh blogspot juga sederhana dan sebagian belum ada fitur breadcrumb didalamnya, jadi anda harus membuatnya sendiri.
Untuk membuat breadcrumb pada blog blogspot sangat mudah kok. Sebaiknya anda menggunakan tema atau template sederhana yang sudah disediakan oleh blogspot, jadi script html template tersebut masih default dan belum ditambahi script-script template blogspot yang lain yang membingungkan anda.
Ok, tidak panjang lebar lagi , berikut ini adalah Cara mudah membuat Breadcrumb di Blogspot :
1. Seperti biasa, login ke dashboard blogspot anda dan pilih Rancangan > Edit HTML, centang Expand widget template.
2. Cari kode ini ]]></b:skin> pada template anda. Copy kode CSS dibawah ini dan paste-kan kode CSS tepat DIATAS kode ]]></b:skin> :

.breadcrumbs {padding: 5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:95%; line-height:1.4em; border-bottom:3px double #e6e4e3;}

3. Jika langkah diatas sudah berhasil anda lakukan, maka selanjutnya adalah dengan mencari kode ini <b:include data=’top’ name=’status-message’/>  pada template anda. Copy kode dibawah ini dan letakkan DIBAWAH kode tersebut :

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

4. Ups, tinggal selangkah lagi maka Cara Mudah Membuat Breadcrumb di Blogspot tersebut selesai anda lakukan. Selanjutnya adalah mencari kode <b:includable id=’main’ var=’top’>. Jika sudah ketemu, copy kode dibawah ini dan letakkan tepat DIATAS kode tersebut :

<b:includable id=’breadcrumb’ var=’posts’> <b:if cond=’data:blog.homepageUrl == data:blog.url’> <!– No breadcrumb on home page –> <b:else/> <b:if cond=’data:blog.pageType == “item”‘> <!– breadcrumb for the post page –> <p class=’breadcrumbs’> <span class=’post-labels’> <a expr:href=’data:blog.homepageUrl’ rel=’tag’>Home</a> <b:loop values=’data:posts’ var=’post’> <b:if cond=’data:post.labels’> <b:loop values=’data:post.labels’ var=’label’> <b:if cond=’data:label.isLast == “true”‘> » <a expr:href=’data:label.url’ rel=’tag’><data:label.name/></a> </b:if> </b:loop> <b:else/> »Unlabelled </b:if> » <span><data:post.title/></span> </b:loop> </span> </p> <b:else/> <b:if cond=’data:blog.pageType == “archive”‘> <!– breadcrumb for the label archive page and search pages.. –> <p class=’breadcrumbs’> <span class=’post-labels’> <a expr:href=’data:blog.homepageUrl’>Home</a> » Archives for <data:blog.pageName/> </span> </p> <b:else/> <b:if cond=’data:blog.pageType == “index”‘> <p class=’breadcrumbs’> <span class=’post-labels’> <b:if cond=’data:blog.pageName == “”‘> <a expr:href=’data:blog.homepageUrl’>Home</a> » All posts <b:else/> <a expr:href=’data:blog.homepageUrl’>Home</a> » Posts filed under <data:blog.pageName/> </b:if> </span> </p> </b:if> </b:if> </b:if> </b:if> </b:includable>

Sebuah catatan penting, sebelum anda melakukan langkah-langkah atau trik membuat Breadcrumb diatas, sebaiknya anda mencopy terlebih dahulu script template atau tema blogspot anda pada sebuah notepad sehingga jika langkah-langkah diatas gagal dilakukan, anda masih mempunyai script template blogspot yang bisa anda gunakan kembali sehingga blog masih bisa terakses dengan sempurna.
Note : Sebelum menyimpan perubahan dalam membuat breadcrumb di blogspot diatas, periksa terlebih dahulu apakah anda melakukan trik atau langkah-langkah diatas dengan benar. Jika sudah yakin, baru anda bisa menyimpannya.
Dengan berakhirnya langkah nomer 4 dan action berupa “SAVE” maka Cara Mudah Membuat Breadcrumb di Blogspot sudah bisa anda lihat previewnya dengan memilih salah satu posting dan lihat, diatas posting tersebut ada sebuah history yang dimulai dengan Home. Penampakannya akan seperti ini :

Banyak trik-trik dalam memaksimalkan fungsi dari blog blogspot tersebut, baik yang berupa SEO, penggunaan plugin yang baik, penempatan meta tag dan meta description yang baik dan sebagainya. Namun yang harus anda perhatikan adalah pemilihan bahan postingan yang baik, sehingga pengunjung akan merasa betah jika berada didalam blog anda.
Semoga informasi diatas bisa membantu anda yang ingin memaksimalkan template Blogspot. Terimakasih sudah membaca tentang Cara Mudah Membuat Breadcrumb di Blogspot diatas.
Artikel ini menarik ? Share dengan Google+ :

Posted in: Tips,Turoialz Blogz