Cara Membuat Breadcrumb (_BarisDepan_)

Kamis, 30 Juni 2011

Hello. ketemu lagi dengan saya.
kali ini saya akan menjelaskan Cara Membuat Breadcrumbs.
Ok. ikutin aj Step By Step...
Check It Crott.. hahahhaaha



  1. Masuk ke kode HTML template blog blogspot anda, dan cari kode ini: ]]></b:skin>. Gunakan Ctrl + F atau bisa juga dengan F3 untuk mencarinya.
  2. Kalau sudah ketemu, ganti kode tersebut dengan kode di bawah ini:

    .breadcrumbs {
    padding:5px 5px 5px 0px;
    margin: 0px 0px 15px 0px;
    font-size:95%;
    line-height: 1.4em;
    border-bottom:3px double #e6e4e3;
    }
    ]]></b:skin>
  3. Sekarang cari lagi kode ini: <b:include data='top' name='status-message'/> dan ganti dengan kode di bawah ini:

    <b:include data='top' name='status-message'/>
    <b:include data='posts' name='breadcrumb'/>
  4. Berikutnya yang mau diganti adalah <b:includable id='main' var='top'>. Penggantinya adalah:

    <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 == "item"'>
    <!-- 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 == "true"'> »
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
    </b:if>
    </b:loop>
    <b:else/>
    »Unlabelled
    </b:if>
    » <span><data:post.title/></span>
    </b:loop>
    </span>
    </p>
    <b:else/>
    <b:if cond='data:blog.pageType == "archive"'>
    <!-- breadcrumb for the label archive page and search pages.. -->
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <a expr:href='data:blog.homepageUrl'>Home</a> » Archives for <data:blog.pageName/>
    </span>
    </p>
    <b:else/>
    <b:if cond='data:blog.pageType == "index"'>
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <b:if cond='data:blog.pageName == ""'>
    <a expr:href='data:blog.homepageUrl'>Home</a> » All posts
    <b:else/>
    <a expr:href='data:blog.homepageUrl'>Home</a> » Posts filed under <data:blog.pageName/>
    </b:if>
    </span>
    </p>
    </b:if>
    </b:if>
    </b:if>
    </b:if>
    </b:includable>
    <b:includable id='main' var='top'>
  5. Save template anda yang sudah ada kode breadcrumb-nya. Mau preview sekarang? Jangan lupa mengklik salah satu postingan yang ada untuk melihat breadcrumb beraksi.

Tidak ada komentar:

 

Blogger news

Blogroll

Most Reading