Monday 28 October 2013

Cara Membuat Breadcrumbs Di Atas Postingan Artikel Blog

Cara membuat breadcrumbs diatas postingan artikel blogspot, menu navigasi yang berada tepat diatas post, link yang mengarahkan atau menunjukkan posisi suatu artikel itu berada, yang menambah kata kunci suatu postingan dan yang pastinya akan menambah nilai SEO blog.

Sebelum kita lanjutkan pembahasan tentang cara bikin breadcrumbs di blog, ada baik nya anda terlebih dahulu mengetahui apa itu breadcrumbs, definisi dan fungsinya di blog. Setelah anda mengetahuinya, langsung saja kita bahas. Perhatikan caranya di bawah ini.
Cara buat breadcrumbs di blog
Gambar 1. Contoh breadcrumbs di blog.
Langkah-langkahnya:
  • Log in ke akun blog anda
  • Pilih menu "Template" >> "Edit Html"
  • Simpan dulu atau full download template anda dari menu cadangkan/pulihkan. Untuk mengantisipasi adanya kesalahan.
  • Klik diantara kode-kode Html, lalu tekan Ctrl+F dari keyboard komputer anda, ketikkan atau cari kode ]]></b:skin dari kotak pencarian di menu template tadi.
  • Note: Untuk membuka semua kode-kode html yang ada di template caranya tekan Ctrl+A, lalu tekan Ctrl+C, kemudian tekan DEL, lalu Ctrl+V. Semua kode akan terbuka semua.
  • Setelah kode ]]></b:skin ketemu, letakkan kode dibawah ini tepat diatas kode ]]></b:skin tadi
Kodenya:
.breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:90%; line-height: 1.4em; border-bottom:3px double #eee;}
  • Lalu cari lagi kode <b:include data='top' name='status-message'/>
  • Setelah kode tersebut ketemu, copy kode di bawah ini dan paste kan tepat di bawah kode <b:include data='top' name='status-message'/>  tadi
Kodenya:
<b:include data='posts' name='breadcrumb'/>
  • Kemudian cari lagi kode <b:includable id='main' var='top'>
  • Setelah kode <b:includable id='main' var='top'> tadi ketemu, hapus kode tersebut dan ganti dengan kode dibawah ini. Silahkan copy dan paste kan
Kodenya:
  • Finish. Simpan dan lihat hasilnya.
Terima Kasih.

Cara Membuat Breadcrumbs Di Atas Postingan Artikel Blog.

2 comments: