Wednesday, October 1, 2014

Cara Memasang Menu navigasi breadcrumb simple Terbaru

sohib sanam
Cara Membuat dan memasang Menu navigasi breadcrumb simpel  - pada ini adalah artikel untuk sobat yang mencari dan ingin membuat menu Navigasi breadcrumb atau navigasi yang berada diatas  judul artikel yang akan tampil jika ada di single post atau di page isi artikel. breadcrumb pada blog ini befungsi untuk memberi tahu kepada pembaca bahwa artikel  yang sedang dia baca adalah masuk kategori yang tertuliskan disana, dengan begitu pembaca akan lebih tahu breadcrumb ini mirip dengan fungsi menu label namun breadcrumb ini biasanya berada di bagian atas judul blog.

Memasang Menu navigasi breadcrumb simple

 Cara Membuat Menu Navigasi Breadcrumb

1. Silahkan log in ke blogger kemudian Pilih HTML Centang menu lalu EDIT HTML
2. Cari kode ]]></b:skin> dan simpan CSS ini diatas kode tadi :
p.breadcrumbs {
padding:5px 5px 5px 0px;
margin: 0px 0px 15px 0px;
font-size:95%;
line-height: 1.4em;
border-bottom:double 3px
#e6e4e3;
 }

3. Cari kode :
<b:includable id='main' var='top'>
copy dan pastekan kode di bawah ini lalu pastekan di atas kode nomer 3:
<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 == &quot;item&quot;'>
<!-- breadcrumb for the post page -->
<p class='breadcrumbs'>
<span class='breadcrumbs'>
<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 == &quot;true&quot;'> &#187;
<a expr:href='data:label.url' rel='tag'><data:label.name/></a>
</b:if>
</b:loop>
<b:else/>
&#187; Unlabelled
</b:if>
&#187; <span><data:post.title/></span>
</b:loop>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
<!-- breadcrumb for the label archive page and search pages.. -->
<p class='breadcrumbs'>
<span class='breadcrumbs'>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187; Archives for <data:blog.pageName/>
</span>
</p>
<b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<p class='breadcrumbs'>
<span class='breadcrumbs'>
<b:if cond='data:blog.pageName == &quot;&quot;'>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187; All posts
<b:else/>
<a expr:href='data:blog.homepageUrl'>Home</a> &#187; Posts filed under <data:blog.pageName/>
</b:if>
</span>
</p>
</b:if>
</b:if>
</b:if>
</b:if>
</b:includable>

4. Cari kode :
<b:include data='top' name='status-message'/>
dan ganti dengan kode dibawah ini:
<!-- <b:include data='top' name='status-message'/> -->
<b:include data='posts' name='breadcrumb'/>

Terima kasih dan selamat membuat dan memasan breadcrumbnya selamat malam.


0 comments:

Post a Comment