Laman

Kamis, 02 Desember 2010

CARA BUAT NAVIGASI DI BLOG

Cara membuat navigasi breadcrumb di blogger. Navigasi breadcrumb adalah kumpulan beberapa link/tautan yang memungkinkan anda untuk menemukan halaman dasar dari artikel yang sedang anda baca.

Link yang ditampilkan di sini adalah link dimana artikel anda berada atau bisa disebut sebagai lokasi dari artikel anda. Navigasi breadcrumb ini biasa diletakkan di atas judul artikel/postingan. Lihat contoh navigasi breadcrumb berikut.


Home » tutorial blog » Cara Membuat Navigasi Breadcrumb di Blogger

Browse: Home » bisnis » toko online » Butik Baju Online

Ada 3 manfaat/kegunaan dari navigasi breadcrumb, yaitu:
  • Memperindah tampilan halaman/artikel.
  • Memudahkan pengunjung dalam menelusuri blog.
  • Mengoptimalkan halaman di search engine (mesin pencari).
Yang terpenting dari 3 hal di atas tentu adalah "mengoptimalkan halaman di search engine" atau sering disebut SEO. Bagi yang belum mengetahui mengenai SEO, silahkan lihat artikel apa itu SEO.

Breadcrumb navigation mungkin tidak sepenting keyword dalam SEO. Tapi yang jelas navigasi breadcrumb ini merupakan salah satu dari faktor SEO. Jadi, sedikit banyaknya juga akan mempengaruhi posisi blog anda di search engine, terutama google.

Cara memasang navigasi breadcrumb di blogspot
Navigasi breadcrumb di blogspot akan tampil berdasarkan label/tag dari postingan anda. Berikut tutorialnya.
  1. Masuk ke blogger.
  2. Pilih menu Tata Letak (Layout) » Edit HTML.
  3. Centang tulisan Expand Widget Templates.
  4. Cari kode berikut.

    <b:if cond='data:post.title'>

  5. Tambahkan kode berikut di bawahnya.

    <b:if cond='data:blog.pageType == "item"'>
    <a href='http://namablog.blogspot.com/'>Home</a> &#187;
    <b:if cond='data:post.labels'>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a>
    <b:if cond='data:label.isLast != "true"'>,</b:if>
    </b:loop>
    &#187;
    </b:if>
    <data:post.title/>
    </b:if>
    jangan lupa ganti tulisan warna biru dengan nama blog anda.

  6. Simpan template.
Anda bisa menambahkan garis di bawah navigasi dengan menambahkan kode <hr/> di bawah kode <data:post.title/> di atas.

Sekarang lihat hasilnya. Jika sudah berhasil, berarti anda sudah menjalankan salah satu dari faktor-faktor SEO. Jangan lupa lihat posting 5 tips dasar SEO untuk pemula yang juga berguna bagi SEO.

Salam sukses!

Cara menghilangkan Navbar Blogger

Bagaimana cara menghapus/menghilangkan navbar blogger? Memang blogger tidak menyediakan setting/pengaturan untuk menghapus navbar yang ada pada bagian paling atas blog. Tetapi Anda tetap bisa menghilangkannya dengan sedikit menambahkan kode css.

Navbar blogger ini memang tidak sering dipakai. Dan terkadang tidak serasi dengan template yang kita gunakan. Oleh sebab itu, banyak blogger yang menghilangkan navbar ini.

Nah, bagi Anda yang ingin menghilangkan navbar blogger ini, cukup tambahkan kode css di bawah ini.


#navbar-iframe {display: none;}

Untuk lebih jelasnya, ikuti tutorial berikut.
  1. Log in ke akun blogger Anda.
  2. Pilih menu Tata Letak (Layout) » Edit HTML.
  3. Cari kode ]]></b:skin>.
  4. Letakkan kode css tadi ke bagian atas kode ]]></b:skin>.
  5. Simpan template.
Sekarang lihat hasilnya. Apakah navbar blogger Anda sudah hilang? Jika sudah, maka template Anda mungkin akan tampak lebih profesional dan lebih menarik. Semoga tutorial blog singkat ini bisa membantu.

Salam sukses!