Posted by : Unknown Rabu, 26 Desember 2012

Cara Membuat Breadcrumb Blog - Berbeda dengan artikel sebelumnya, cara membuat breadcrumb blog sederhana, tampilan breadcrumb yang muncul hanya menampilkan tag atau label artikel secara spesifik yang terpilih namun kalau menurut saya sich kalau cara membuat breadcrumb blog khusus ini hanya meminimalis tampilan tag atau label saya sehingga dengan menggunakan cara ini maka tag atau label yang anda berikan untuk artikel blog anda hanya menampilkan satu tag atau label saja, seperti tampilan gambar berikut ini

Cara Membuat Breadcrumb Blog Khusus

Bagaimana cara membuat breadcrumb blog seperti gambar diatas? Baca juga fungsi breadcrumb
  1. Masuk ke akun Blogger anda
  2. Klik Template >> Edit HTML >> centang Expand Widget Template >> tekan Ctrl+F pada keyboard
  3. Cari kode ]]></b:skin>
  4. Letakkan kode berikut ini tepat sebelum kode ]]></b:skin>
    .breadcrumbs{
    padding:5px 5px 5px 0;
    margin:0;font-size:95%;
    line-height:1.4em;
    border-bottom:4px double #cadaef}
  5. Cari kode seperti ini : <div class='post hentry'>
  6. Letakkan kode berikut ini tepat setelah atau sebelum 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;'>
    <!-- breadcrumb for the post page -->
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <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='post-labels'>
    <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='post-labels'>
    <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>
  7. Simpan template
Mudah bukan? Kini anda sudah mengetahui cara membuat breadcrumb blog khusus seperti yang ada di artikel blog ini. Terimakasih dan semoga bermanfaat, jika ada pertanyaan silahkan komentari artikel ini, Cara Membuat Breadcrumb Blog Khusus

Description: Panduan Cara Membuat Breadcrumb Blog Khusus
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Panduan Cara Membuat Breadcrumb Blog Khusus

Leave a Reply

Monggo Tinggalkan Jejak Kaks :)

Subscribe to Posts | Subscribe to Comments

Welcome to My Blog

Popular Post

Labels

Arsip Blog

Followers

- Copyright © 2013 shad0w-share | Designed by Johanes Djogan -