Memasang Bintang Rating Rich Snippet di Blog Dengan Graddit -
Bagaimana cara memasang bintang rich snippet pada blog kita? Nah,
pertanyaan ini akan terus muncul dari para blogger pada saat melihat
blog - blog yang lain terlihat 5 bintang berjajar di hasil penelusuran
Google.
Menurut saya, bintang rich snippets ini memiliki fungsi yang penting.
Karena saya yakin apabila para pengunjung sedang melakukan searching
pada Google, dan melihat blog kita memiliki 5 bintang berjajar, mereka
akan langsung mengklik blog kita. Karena mereka berfikir bahwa blog kita
memiliki peringkat yang bagus.
Sebenarnya cara pemasangan bintang rating ini memiliki cara yang bermacam - macam, seperti halnya pada postingan cara membuat bintang rich snippet yang part 1.
Pada cara ini kita harus menyisipkan judul, description, dan jumlah
ratingnya. Tapi meskipun memiliki perbedaan cara, tujuannya tetap hanya
satu, yaitu agar blog kita memiliki 5 bintang yang berjajar pada hasil
penelusuran Google. Dan yang akan saya bagikan pada postingan ini ialah
cara membuat / memasang bintang rating dengan menggunakan Graddit.
Kalau anda berniat untuk memasangnya, silahkan ikuti langkah - langkahnya dibawah sini.
1. Silahkan anda kunjungi web ini : http://www.graddit.com/ratings-widget
2. Kemudian klik tab menu "Rating Widgets" (Nomor 1), setelah itu akan muncul tampilan yang seperti pada gambar berikut ini.
 |
| Klik untuk memperbesar |
3. Sekarang kembali dulu ke blog, silahkan anda pilih "Template" lalu pilih "Edit HTML". Kemudian cari kode <head>. Setelah ketemu, copy kode yang ditunjuk oleh nomor 2, dan pastekan kode tersebut tepat sesudah kode <head>. Jadinya seperti ini :
<head><link type="text/css" rel="stylesheet" href="http://static.graddit.com/css/graddit.css"/></head>
4. Kemudian anda pilih dulu tampilan bintang rating yang nantinya akan
ditampilkan pada blog anda. Lihat nomor 4 pada gambar diatas.
5. Setelah anda memilih salah satu tampilannya, sekarang anda klik "Blogger". Lihat nomor 3 pada gambar diatas.
6. Setelah itu terus anda copy kode yang saya kasih nomor 5. Lihat gambar diatas.
7. Pastekan kode yang tadi anda copy tepat sesudah kode <div class='post-body entry-content'>. Apabila pada HTML blog anda terdapat 2 atau lebih pilihlah kode yang pertama. Maka akan menjadi seperti ini :
<div class='post-body entry-content'><b:if cond='data:blog.pageType != "static_page"'>
<div expr:id='"labels_" + data:post.id' style='display: none; visibility: hidden;'>
<b:if cond='data:post.labels'>
<b:loop values='data:post.labels' var='label'>
<data:label.name/>,</b:loop></b:if></div>Rate this posting: <div expr:id='data:post.id' class='ffbs_rate'>{[['<img src="http://static.graddit.com/img/star.png"/>']]}</div>
<div expr:id='"ffbs_stats_" + data:post.id' class='ffbs_stats'></div>
<script type='text/javascript' expr:src='"http://www.graddit.com/rate/eng/5/" + data:post.id + "?id=" + data:post.id + "&stats=ffbs_stats_" + data:post.id + "&labels=labels_" + data:post.id + "&info=info-" + data:post.id + "&info_delay=2&url=" + data:post.url + "&class_star=ffbs_star_img&class_star_set=ffbs_star_img_set&class_star_vote=ffbs_star_img_vote&views=yes&votes=yes&average=yes"'></script></b:if>
8. Nah, apabila sudah betul seperti yang saya contohkan diatas. Langkah terakhir klik "Simpan". Dan lihatlah hasilnya.
Selesai, selamat mencoba dan semoga artikel ini bermanfaat ya :)
Apabila cara ini tidak berhasil harap baca lagi yang part 1 di sini dan part 3 di sini
No comments:
Post a Comment