Cara Membuat Breadcrumb di Blogspot

Mungkin saat ini sudah semakin jarang dari blogger untuk membuat breadcrumb sendiri, karena sudah banyak penyedia template blogspot gratis yang sudah sekaligus menyertakan fasilitas breadcrumb di template blogspot yang bisa di download gratis. Namun begitu, cara membuat breadcrumb di blogspot tetap perlu anda pelajari dan ketahui karena bisa saja anda menjumpai template blogspot yang bagus tetapi ternyata belum menyertakan fasilitas breadcrumb ke dalam template tersebut.

Sebenarnya tidak susah untuk membuat breadcrumb sendiri di template anda, yang perlu diperhatikan adalah ketelitian dalam mengikuti langkah-langkah yang diberikan untuk memperoleh hasil yang sesuai.

Oke, langsung saja berikut cara membuat breadcrumb di blogspot :

cara membuat breadcrumb di blogspot
1.  Login ke akun blogspot
2.  Pilih template
3.  Edit HTML
4.  Cari kode ]]></b:skin>
5. Copy kode dibawah ini dan paste-kan tepat di atas kode ]]></b:skin>


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

6.  Lalu, cari kode ini <b:includable id=’main’ var=’top’> dan ganti dengan kode dibawah

<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'>Home</a></span> &#187; <span><data:blog.pageName/></span></div>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- 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'>Home</a></span>
<b:loop values='data:post.labels' var='label'>
&#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
</b:loop>
&#187; <span><data:post.title/></span>
</div>
<b:else/>
<div class='breadcrumbs'><span><a expr:href='data:blog.homepageUrl' rel='tag'>Home</a></span> &#187; <span>Unlabelled</span> &#187; <span><data:post.title/></span></div>
</b:if>
</b:loop>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<div class='breadcrumbs'>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Archives 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'>Home</a></span> &#187; <span>All posts</span>
<b:else/>
<span><a expr:href='data:blog.homepageUrl'>Home</a></span> &#187; <span>Posts filed under <data:blog.pageName/></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'/>
7.  Simpan template
8.  Lihat hasilnya, template anda sudah dilengkapi dengan breadcrumb.

Sebelum melakukan perubahan, sebaiknya backup dulu template milik anda. Supaya jika terjadi kesalahan tidak perlu susah untuk mengembalikannya ke kondisi template semula. Breadcrumb ini juga bertujuan untuk membantu agar blog lebih cepat ter-index/ di-index Google/ search engine lainnya.

Demikian artikel cara membuat breadcrumb di blogspot, semoga artikel ini bermanfaat ya.. Baca juga artikel mengenai cara membuat random post bergerak di blogspot.

Artikel Terkait dengan Tutorial Blogging

Bekti Nugroho G.S
Blog Oonline Updated at: 14.50

Tidak ada komentar:

Poskan Komentar

Silahkan Berkomentar dengan :

1. Bahasa Indonesia yang baik dan benar
2. Tutur bahasa yang sopan dan santun
3. Tidak mencantumkan alamat url apalagi link aktif
4. Sesuai isi artikel ( bukan sekedarnya )

Maaf, komentar akan saya hapus jika tidak sesuai dengan peraturan diatas.

Mohon maaf juga apabila komentar tidak muncul segera, dikarenakan tidak selalu online dan kesibukan offline lainnya. Terima kasih atas perhatian dan pengertiannya.


About | Contact | Privacy Policy | Arsip
Copyright © 2014- Blog Oonline - Powered by Blogger