Popular Posts

Memasang Navigasi Breadcrumb

Share it:
Navigasi yang biasa ditampilkan secara horizontal di bagian atas maupun di bawah judul postingan dan terkadang di bagian atas halaman web, seperti header, kita kenal dengan nama breadchumb. Pada dasarnya Breadcrumb merupakan navigasi seo berbasis tautan internal.

Cara Memasang Breadcrumb

Breadcrumb ini dapat memberikan jejak bagi pengguna hingga bisa sampai pada suatu halaman, dimana dengan mengikuti tautan-tautan tersebut, kita dapat menelusuri kembali pada langkah-langkah bagaimana kita bisa tiba di suatu halaman dan bahkan kita dapat menavigasi dengan cepat kembali ke titik awal maupun ke bagian lain dengan mengikuti Srtuktur dari Navigasi Breadcrumb tersebut.

Untuk memasang Breadcrumb, sebagai langkah awal kita dapat meletakkan kode berikut ini tepat sebelum kode ]]></b:skin> sebagai style.

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


Kemudian kita dapat meletakkan kode berikut ini tepat setelah kode <div class='post hentry'> atau tergantung dimana kita ingin memasangnya, diatas maupun dibawah judul Posting.

1<b:if cond='data:blog.homepageUrl == data:blog.url'>
<b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='breadcrumbs'>
Browse &#187; <a expr:href='data:blog.homepageUrl'>Home</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>

Sangat sederhana tetapi mudah-mudahan Breadcrumb ini memiliki banyak manfaat dan akan menjadikan blog/ web kita SEO freindly dan dapat dioptimalkan sepenuhnya oleh Search Engine Optimization.
Share it:

AVAStudio_ID

Blogs Tutorial

Post A Comment:

0 comments: