my blogger
Powered by Blogger.

music

About Me

My photo
saya reza purbaya orangnya homoris dan serius apabila serius

Translate

Paling Hits

sederhana banyak cinta

Wednesday, 28 August 2013

Cara membuat breadcrumb di blog

 Seperti yang kita ketahui bahwa tampilan breadcrumb membuat hasil tampilan browsing kita menjadi lebih menarik dan juga membantu para pengunjung mengetahui posisi artikel pada saat membaca artikel tersebut.Yuk langsung kita membahas cara membuat breadcrumb tersebut

cara membuat breadcrumb

1. Login ke Blogger
cara membuat breadcrumb
     

2. Pilih Tabs "Rancangan"  kemudian Pilih "Edit HTML"

cara membuat breadcrumb
    

3. Sobat Cari kode seperti    <b:includable id='main' var='top'>

4. Kemudian copas kode di bawah ini  dan di letakkan di atas kode <b:includable id='main' var='top'>
 
<b:includable id='breadcrumb' var='posts'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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:if> </b:loop></b:if>
</b:includable>

5. Cari kode <b:include data='top' name='status-message'/>
    setelah ketemu silahkan sobat paste code di bawah ini dan letakkan di atas kode tersebut
    <b:include data='posts' name='breadcrumb'/>

6. Cari lagi kode seperti  ]]></b:skin>, kemudian letakkan kode CSS  di bawah ini tepat di atas kode tersebut

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


7  Dan Safe Template, selesai breadcrumb blog anda


Demikian postingan artikel cara membuat breadcrumb di blogspot semoga dapat memberi manfaat, salam blogger

0 komentar

Post a Comment

Lencana Facebook