Saturday, 14 May 2011

Tutorial : Cara Pasang Breadcumb

Pada entri ini, saya ada beritahu kepada anda bahawa META TAG dan BREADCUMB sangat penting dalam membuat blog yang mesra SEO. Ramai yang bertanyakan tentang cara buat meta tag dan breadcumb. Tutorial cara pasang meta tag telah pun saya buat di entri ini. Kali ini, saya akan buat tutorial cara pasang breadcumb pula.
Gambar di atas adalah contoh breadcumb
Breadcumb adalah barisan link pautan di atas post atau di bawah post yang memudahkan pengunjung blog  untuk meng-navigasi ke halaman sebelumnya dengan cepat. Breadcumb penting supaya blog anda mudah berada di SERP (Enjin Pencarian). Ikuti langkah demi langkah untuk memasang breadcumb di bawah. Breadcumb ini dari blog indonesia. Terbaik punya!

Langkah 1
Klik Design > Edit HTML > Tick pada Expand Widget Template > Tekan CTRL+F dan satu kotak di atas akan muncul. Sila taip kod ini --> ]]></b:skin>

Langkah 2
Copy kod di bawah dan paste sebelum/di atas ]]></b:skin>
 .breadcrumbs{border-bottom:1px dotted #999;margin:2em 0 0.5em;padding:0 0 0.5em;font-size:10px}
Langkah 3 
Kali ini cari kod ini pula --> <b:includable id='main' var='top'>

Langkah 4
Copy kod di bawah dan paste sebelum/di atas <b:includable id='main' var='top'>
 <b:includable id='breadcrumbs' var='post'>
    <!-- Breadcrumbs By Warung Seo http://kutak-ketik.blogspot.com -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <p class='breadcrumbs'>
    <span class='post-labels'>
    <b:if cond='data:post.labels'>
    Go&#160; :
    <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a> &gt;
    <b:loop values='data:post.labels' var='label'>
    <b:if cond='data:label.isLast == &quot;true&quot;'>
    <a expr:href='data:label.url' rel='tag'> <data:label.name/></a>
    </b:if>
    </b:loop>
    <b:if cond='data:post.title'>
    &gt; <b><data:post.title/></b>
    </b:if>
    </b:if>
    </span>
    </p>
    </b:if>
    <!-- End of Breadcrums Hack -->
    </b:includable>

Langkah 5
Akhir sekali, cari kod ini pula --> <b:loop values='data:posts' var='post'>
p/s : mungkin ada 2 atau 3 kod yang sama. Pilih hanya yang PERTAMA sahaja

Langkah 6
Copy kod di bawah dan paste DI BAWAH <b:loop values='data:posts' var='post'>
<b:include data='post' name='breadcrumbs'/>
Save Template

13 comments:

  1. makasih dik.. atas perkongsian ilmu :D

    akak belanja 20 sen ;D

    ReplyDelete
  2. Terima kasih atas perkongsian, tapi aku nak sumbat kat mna ek...he3

    ReplyDelete
  3. terima kasih kongsin info kt akak..=)

    ReplyDelete
  4. terbaik bro .. nnti ps wat .. hheehe

    lamo tak singgah sini

    ReplyDelete
  5. ,=====,o00o Ponn..Ponn.Ponn..
    //__l_l_,\____\,__
    l_---\_l__l---[]lllllll[]
    _(o)_)__(o)_)--o-)_)___
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    " Antara kau dan aku
    Blog ini sebagai pengantara”
    http://firestartingautomobil.blogspot.com/
    http://bukandoktorveterinar.blogspot.com/
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    Maaf lama tak ziarah kamu semua….
    Jom Terjah entry terbaru ??
    bila blog kena block timbul

    diy bumbung kereta karat

    ~~~~~@@@~~~~~~
    Selamat Hari Guru
    ~~~~~@@@~~~~~~
    Wahai guru yang dikasihi,
    Engkaulah pelita diri ini,
    Menerangi hati nurani,
    Moga dirimu dirahmati
    ~~~~~~~~~~~
    Ya Allah peliharalah guruku,
    Agar dipimpin terus hambaMu,
    Agar terhindar dari Neraka,
    Moga dibukakan pintu Syurga
    ~~~~~~~~~~~
    Tak terbalas jasamu
    Berkorban jiwa raga
    Mendidik anak bangsa
    Jadi insan berguna
    ~~~~~~~~~~~
    Keikhlasan di hati
    Hulur bakti dan budi
    Kau penyambung warisan
    Ilmu cahaya hati
    ~~~~~~~~~~~
    Ampunkanlah wahai guruku,
    Kesilapan anak-anakmu,
    Ku serahkan jiwa ragaku,
    Agar terdidik nafsu liarku
    ~~~~~~~~~~~
    Dengan izin Allahu Rabbi,
    Engkaulah guru yang sejati,
    Engkau bersabar mendidik kami,
    Moga dirimu diberkati
    ~~~~~~~~~~~

    ReplyDelete
  6. ,=====,o00o Ponn..Ponn.Ponn..
    //__l_l_,\____\,__
    l_---\_l__l---[]lllllll[]
    _(o)_)__(o)_)--o-)_)___
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    " Antara kau dan aku
    Blog ini sebagai pengantara”
    http://firestartingautomobil.blogspot.com/
    http://bukandoktorveterinar.blogspot.com/
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

    Maaf lama tak ziarah kamu semua….
    Jom Terjah entry terbaru ??
    bila blog kena block timbul

    diy bumbung kereta karat

    banyak benda aku bru belajar blog ko ni banyak ajar aku... aku ni al maklum buta kayu sikit... thanks... mmg bermanfaat skali

    ReplyDelete
  7. sebenarnya aku da try buat banyak kali da berbulan2 da try buat breadcrumbs ni..tak dapat gak.. step semua betul buat..tapi tak appear..pelik dowh..sedih kot..neway tanx..

    ReplyDelete
  8. saya tak berjaya buat nie...kenapa yew?? smua step dah betul..tapi tak jadi pon..

    ReplyDelete
  9. xjd gak wat mende ni.ermrmrrr

    ReplyDelete
  10. macam x jadi je..anyway..thanks for the info =)

    ReplyDelete
  11. kes yang sama macam diorang kat atas, tak jadi..

    TQ 4 ur concern =)

    ReplyDelete
  12. Kak Aida : hehe.. dapat beli choki2 pun jadilah.. hehe

    Decrewz : Aku pun x de idea.. hehe

    Jo : TQ bro

    Merah : sama2 kak :)

    Wan : thanks sudi dtg blog buruk ni.. haha

    Afza : hye bro.. lama x nmpk.. pergi honey moon ke?

    Neon : kau kena tukar template kot sbb aq buat boleh je

    Selendang : sy x pun x pasti.. cuba awk cari tutorial lain

    KEPADA SESIAPA YANG TAK JADI TU, SAYA AKAN CUBA SELIDIK TUTORIAL INI SAMA ADA SALAH ATAU TIDAK.. SEBARANG PERKEMBANGAN SAYA AKAN BGTAU YA..

    ReplyDelete

Lontarkan apa sahaja yang anda ingin katakan. Saya akan membalas komen secepat mungkin. (InsyaAllah)