Langkah Memasang Navigasi Breadcrumb Pada Blog

Rating: 4.7
Tutorial SEO ~ Cara Pasang Navigasi Breadcrumb di blogspot supaya lebih SEO Friendly. Sebelumnya mari kita kenal lebih dahulu apa itu BreadCrumb? Kalau diartikan satu artinya bisa saja "remah roti" tapi bukan itu yang dimaksud, Breadcrumb disini adalah sebuah bantuan navigasi yang digunakan dalam user interface sehingga memudahkan user untuk menavigasi halaman web/blog. Istilah ini berasal dari jejak remah roti yang ditinggalkan oleh Hansel dan Gretel di dalam sebuah dongeng populer.                                                           
Lalu bagaimana cara membuat Navigasi Breadcrumb tersebut? Sebenarnya telah banyak yang membuat tutorial cara membuat navigasi breadcrumb, baik di wordpress maupun di blogspot. Kali ini tutorial cara pasang breadcrumb di blogspot agak berbeda dari yang sudah-sudah, ada sedikit sentuhan dari Blogger Bertuah, salah satunya Bang Ais, founder www.duosmith.com--Duo Smith Elios. Berikut ini adalah cara membuat breadcrumb di blogger.com/blogspot.com

1. Login ke blogger degan ID anda.
2. Klik Tata Letak / layout
3. Kemudian klik tab Edit HTML
4. Click Download Full Template and please back up your template first. Untuk menghindari bila sewaktu-waktu ada kesalahan.
5. Beri tanda centang pada kotak kecil di samping tulisan Expand Template Widget.

6. Cari kode ]]></b:skin>
7. Copy lalu paste kode di bawah ini persis di atas kode ]]></b:skin>
    .breadcrumbs {    padding:5px 5px 5px 0;    margin:0;font-size:95%;    line-height:1.4em;    border-bottom:4px double #e2e7b4;    }    .breadcrumbs a {    text-decoration:none;    color: #000000;    }

8. Silahkan cari kode berikut pada template anda :
<div class='post hentry'>

9. Copy lalu paste kode di bawah ini persis di bawah kode <div class='post hentry'>
    <b:if cond='data:blog.homepageUrl == data:blog.url'> <b:else/> <b:if cond='data:blog.pageType == &quot;item&quot;'> <div class='breadcrumbs'><a expr:href='data:blog.homepageUrl'>Halaman Depan Blog</a> &#187; <b:if cond='data:post.labels'><b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url' rel='tag'><data:label.name/></a> <b:if cond='data:label.isLast != &quot;true&quot;'> , </b:if> </b:loop> </b:if> &#187; <data:post.title/> </div> </b:if> </b:if>

Simpan/save dan silahkan lihat hasilnya secara langsung di atas judul postingan "Cara Pasang Breadcrumb Blogspot" ini dan bisa juga di lihat pada bagian halaman posting blog kita masing-masing, maka hasilnya mirip dengan dengan gambar di bawah ini:

                                                             
Style template seperti ini akan menambah seo friendly sebuah template dan semoga akan semakin meningkatkan serp anda dalam search engine.  Semoga bermanfaat untuk sobat :)

0 comments on Langkah Memasang Navigasi Breadcrumb Pada Blog :

Post a Comment

Terima kasih sudah berkunjung di daftar blog dofollow backlink / daftar blog backlink - DBB.
Bila ada pertanyaan atau sekedar berkomentar silakan tinggalkan pesan dibawah ini, dilarang mencaci maki orang lain sebelum mencaci diri sendiri :P

Caution!

No Smoking, Drugs, and Alcohol!
....................../´¯/)
....................,/¯../
.................../..../
............./´¯/'...'/´¯/`
........../'/.../..../....././¨¯\
........('(...´...´.... ¯~/'...')
.........\...................'..../
..........\...................../
............\................/


Dofollow


pin 5875A910
↑ TOP ↑

Komentar Baru