Jumat, 12 Juni 2015

Membuat Dynamic Heading Pada Blogspot

Bagian-bagain di bawah ini adalah komponen-komponen terpenting dari halaman blog anda. Dalam template default biasanya ke tiga komponen penting tersebut kurang SEO friendly. Jadi di sini saya akan membagikan dasar-dasar agar ketiga komponen pada webpage anda tersebut menjadi lebih SEO friendly. Jadi jangan sampai anda menyia-nyiakan ke tiga komponen tersebut


Mengatur Title Tag Blog Anda

Jika anda menggunakan template bawaan blogger, biasanya title tag pada template tersebut standar dan kurang SEO friendly. Title Tag adalah kode yang di taruh pada bagian head, kode ini menampilkan tampilan judul tab browser dan tampilan di hasil pencarian mesin pencari seperti Google. Kode title tag dalam template HTML adalah <title>JUDUL HALAMAN</title>.

Title tag standar biasanya menampilkan title seperti ini "JUDUL BLOG: JUDUL ARTIKEL". Tentu saja title tag tersebut kurang memenuhi standar SEO friendly. Setidaknya title tag tersebut harus menampilkan "JUDUL ARTIKEL: JUDUL BLOG". Bahkan kalau perlu hilangkan saja JUDUL BLOGNYA, dan hanya menampilkan JUDUL POSTINGAN saja agar tidak mengurangi kepadatan kata kuncinya.

Untuk memasang title tag yang beragam, maka pastikan title tag pada template blog saudara sama seperti pada contoh berikut:
<title>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<data:blog.title/>
<b:else/>
<data:blog.pageName/>
</b:if>
</title>
Untuk mengetahui Title Tag pada blog saudara, silahkan ikuti langkah-langkah sederhana berikut:
Pastikan login dengan akun blog saudara
Pilih  menu TEMPLATE, lalu kil tombol Edit HTML
Cari kode <title> dengan menggunakan CtrlF atau F3
Silahkan cek, apakah kode antara <title>dan</title> sama dengan kode title tag seperti di atas?
Jika belum, silahkan hapus semua kode HTML dari <title>sampai</title>, dan copy paste kode title tag di atas sebagai penggantinya.
Klik simpan untuk melihat perubahan title tag blog saudara yang beragam.
Kalau pada template blog saudara belum punya title tag, silahkan copy kode title tag berwarna merah di atas, lalu taruh tepat di bawah kode <head>.
Mengatur Header Halaman

Komponen yang ke dua yaitu mengatur Header Halaman pada blog saudara. Jika saudara memperhatikan blog saya pada komponen headernya, pada saat di beranda atau home page header halaman saya menampilkan judul blog, sedangkan saat berada di halaman artikel header blog saya menampilkan judul halaman artikel tersebut. Untuk membuat header halalaman yang berbeda-beda seperti pada blog ini, saudara hanya perlu mengikuti langkah-langkah di bawah ini:
Masuk ke akun blog anda
Masuk ke menu Template blog yang ingin anda edit
Klik tombol Edit HTML
Kemudian cari kode <b:include name='title'/> (biasanya kode seperti ini lebih dari satu, jadi anda coba saja satu persatu. Tapi saran saya cobalah mudali dari yang paling bawah terlebih dahulu.)
klik mouse pada kolom HTML kemudian tekan CTRL+ F atau F3 untuk mempermudah pencarian kode
Ganti kode <b:include name='title'/> dengan kode yang ada di bawah ini:
 <b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:include name='title'/>
<b:else/>
<data:blog.pageName/>
</b:if>
Simpan perubahan dan lihat apakah sudah berubah judul header pada halaman artikel. Jika belum ubah lagi kode di atas menjadi <b:include name='title'/>, dan ulangi penggantian kode pada <b:include name='title'/> yang lainya.
Mengatur Judul Artikel

Jika anda menggunkan template standar yang di sediakan blogger, biasanya template tersebut memberikan Heading H3 untuk judul postingan. Ini sebenarnya sangatlah kurang SEO friendly, karena template blogger biasanya juga membberikan Heading H2 untuk nama widget atau Gadget yang anda pasang. Jadi sini kita akan  mengubah judul artikel menjadi H2 dan nama widget menjadi H3.

1. Mengubah Judul Artikel Menjadi H2
Untuk mengubah Heading judul artikel menjadi H2, anda hanya harus mengikuti langkah-langkah di bawah ini dengan teliti dan seksama:
Pastikan anda ada di Mode Edit HTML
Cari kode h3.post kalau tidak ada cari kode h3 saja (Pastikan tidak ada embel-embel mobile)
Kode seperti ini biasanya lebih dari satu, tergantung dari template yang anda gunakan.
Ubah kode <h3 menjadi <h2,
Kemudian cari juga kode xxxxxxx, lalu ubah menjadi xxxxxxx
Jangan lupa cari  kode </h3> dan ubah menjadi </h2>
Klik simpan template untuk menyimpan hasilnya
2. Mengubah Nama Gadget Menjadi H3
Pada tampilan baru Editor HTML blogspot, kita di beri kemudahan untuk mencari widget atau gadget yang ingin di edit. Untuk lebih lanjut, perhatikan prosedur di bawah ini:
Masih di Mode Edit HTML
Carilah semua kode HTML yang ada pada widget blog anda. Caranya Klik tombol Lompat Widget atau Jump To pada tampilan baru Editor HTML anda.
Kemudian pilih nama widget yang ingin anda ubah menjadi H3. Di sini saya menggunakan contoh Widget Popular Post milik saya.
 <b:widget id='PopularPosts1' locked='false' title='Popular Post' type='PopularPosts'>
    <b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
Di atas adalah HTML widget populer post milik saya, Silahkan di ubah kode berwarna biru di atas menjadi <h3><data:title/></h3>
Jika semuda kode widget sudah di ubah menjadi H3, silahkan simpan kembali template blog saudara.

OK, selesai sudah pengaturan semua komponen penting pada blog anda, sekarang ke tiga komponen penting tersebut sudah membuat blog anda lebih SEO friendly dari sebelumnya.

Tidak ada komentar:

Posting Komentar