Cara Pasang Rating Bintang Rich Snippets ~ Tutorial Blogger

> Cara Pasang Rating Bintang Rich Snippets

Senin, 12 Maret 2012

39

Cara Pasang Rating Bintang Rich Snippets

Senin, 12 Maret 2012 | 00.24 39 comments

Bagi yang belum atau masih kesulitan memasang Rating Bintang dan Rich Snippets, berikut langkah yang paling pas dan mudah untuk memasang Rating Bintang dan Rich Snippets.

Sebelum menuju caranya, sebaiknya kita mengetahui .... apa sih Rich Snippets?

Google Rich Snippets merupakan data terstruktur dalam bentuk snippets (cuplikan) atau bisa juga kita sebut dengan description pada homepage atau pada halaman artikel kita yang muncul dibawah setiap hasil pencarian Google.


Rich Snippets sebenarnya sudah diperkenalkan oleh Google pada sekitar pertengahan tahun 2009, yang gunanya untuk membantu penggunanya menemukan homepage ataupun halaman posting yang ada pada blog kita, dengan menunjukkan "snippet" atau cuplikan dari artikel yang kita buat.

Waah.... sudah lama juga ya..., padahal Blog ini lahir pertengahan 2010... Berkat aksi kreatif para mbah senior blogger, kini mulai marak menggunakan trik ini.

Dengan teknik ini, kita diharapkan memberikan informasi yang relevan kepada pengguna google tentang apa saja yang kita tulis. Sehingga menurut saya mungkin agar pengunjung benar - benar yakin akan mengunjungi blog kita.

Bersamaan dengan pemberian Rich Snippets pada hompage dan setiap halaman post yang kita terbitkan, kita juga dapat memberikan tanda rating bintang sekaligus. Sehingga yang ditampilkan pada pencarian google adalah hompage atau judul artikel, Snippets, dan tanda rating bintang,... kerren juga sih...

Sayang..., hal tersebut tidak mempengaruhi meringkat halaman blog kita pada hasil pencarian google, walaupun kita sudah memberikan tanda rating bintang dan Rich Snippets pada blog kita.

Tapi paling tidak pengunjung akan lebih mantab dengan melihat rating bintang dengan warna orange yang mencolok tersebut dan akhirnya mengklik Rich Snippets yang muncul pada pencarian google. Jadi sering sering artikel kita yang muncul dengan rating bintang di Klik orang, tentu pengunjung blog kita jadi bertambah, ....iya kan?

Nah... bagi anda yang belum atau masih kesulitan memasang Rating Bintang dan Rich Snippets pada blog anda, pada artikel ini saya jelaskan langkah - langkahnya secara detail,mudah,dan yakin berkasil.

Untuk memasang Rating Bintang dan Rich Snippets, tentu ada beberapa tahapan yang harus kita lakukan. Dalam hal ini setiap tahapan saya tulis dalam satu artikel.

Berikut tahapan - tahapan sebelum memasang Rating Bintang dan Rich Snippets :
  1.  Mengganti profil Blogger ke google plus.
  2.  Cara menampilkan Author blog di google.
  3.  Memberikan link publisher pada home page.
Bagi yang belum melakukan 3 tahap diatas, silahkan baca artikelnya dan ikuti langkah - langkahnya :
Dan bagi anda yang sudah melakukan 3 tahap diatas, anda tinggal ikuti langkah - langkah yang saya uraikan dibawah ini :

Seperti biasa .... :
1. Masuk Rancangan.
2. Edit HTML.
3. Centang "Expand Template Widget".
4. Letakkan kode dibawah ini, tepat setelah atau dibawah  tag <body> :
<div>
<div itemscope='Person' itemtype='http://data-vocabulary.org/Review'>

5. Dan Letakkan kode dibawah ini, tepat Sebelum atau diatas  tag </body> :
</div>
</div>

6. Cari kode seperti dibawah ini : (Ingat, kode seperti berikut ada 2, silahkan pilih yang pertama atau yang atas, hal ini mempengaruhi hfeed pada homepage.)
<h1 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
     <b:if cond='data:post.url'>
       <a expr:href='data:post.url'><data:post.title/></a>
     <b:else/>
      <data:post.title/>
     </b:if>
    </b:if>
      </h1>
Catatan : Aetiap template memiliki kode yg berbeda, terutama penggunaan tag <h1>   .....  </h1> . tapi tidak masalah, baik pakai h1,h2, atau h3.

7. Sisipkan kode berikut, pada kode diatas :
<span itemprop='itemreviewed'> ....... </span>

Hingga jadi seperti dibawah ini :
<span itemprop='itemreviewed'> <h1 class='post-title entry-title'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
     <b:if cond='data:post.url'>
       <a expr:href='data:post.url'><data:post.title/></a>
     <b:else/>
      <data:post.title/>
     </b:if>
    </b:if>
      </h1> </span>
Catatan : Kode diatas untuk menandai Judul yang tampil pada pencarian google.

8. Kemudian scroll kebawahnya kode diatas, dan cari kode seperti atau mirip kode berikut :
<div class='post-header-line-1'/>

9. Tambahkan kode dibawah ini, setelah kode diatas :
<div class='postdate' style='width:100%;margin-bottom:-15px;border-bottom:1px solid #ddd;position:relative;'>

<b:if cond='data:top.showTimestamp'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtei41ZMJRQBFQJVM6NLrbEN5rRQNG_AXxE08Mmqzvkmv3YsARMeoPkAko-opdZb748kg8qr18bPwbLFbTqeltlQpV0vKd8oZUiXwrz2-_h2UzRG_p-p3OwZ-bTOvjSZZYK-707kiXOm8/'/>
<span itemprop='updated'>
<a class='timestamp-link' expr:href='data:post.url' rel='bookmark' title='permanent link'>
<abbr class='updated' expr:title='data:post.timestampISO8601'>
<data:post.dateHeader/>
 | <data:post.timestamp/>
</abbr>
</a>
</span>
</b:if>


<b:if cond='data:top.showAuthor'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixcao8YiLpt6fXffUjW__OzDvQQgMO9gLiqBzO5DXry0mcIjX2lHMK3bH6G1CKVON6TbUx-Liu_Dlmf7Hq41koZkY8hUO-D4A7ZcNygyLPOyk5fg7Wf7URVQO_8wNelO9-rU1Dfgj5FCg/'/>  <span class='fn'>
<span itemprop='reviewer'>
<a href='https://plus.google.com/105300861809836012204' rel='author'><data:post.author/>
</a>
</span>
</span>
</b:if>


<b:if cond='data:post.allowComments'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5I-XbOfy-te5meYzubNTnfZ68Aqj0m0_4_PdHilmFuSBBSRva-3ltwghq2nYhbWZIGo1fY2sOVociZl3VsPYdpqKIYWJNSi2R2PBhO_PXUfnkIpa_qd2n7r8roZkUe2_1Ox86HZb-UtM/s1600/comments.png'/>
<span itemprop='Comments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 0'>No comments</b:if>
<b:if cond='data:post.numComments == 1'>1 comment</b:if>
<b:if cond='data:post.numComments &gt;= 2'>
<data:post.numComments/> comments</b:if>
</a>
</span>
<span itemprop='rating'> | 3.4</span>
</b:if>


</div>
<br/>

<b>Description :</b>
<span itemprop='description'>
<data:post.snippet/>
</span>
<br/>
Catatan :
  • Pada bagian kode berwarna HIJAU, untuk menandai Update Artikel yang tampil pada pencarian google.
  • Pada bagian kode berwarna BIRU, untuk menandai Profil Google Plus sebagai Penulis yang tampil pada pencarian google. Silahkan ganti TEKS WARNA HIJAU MUDA dengan ID Profil Google Plus Anda
  • Pada bagian kode berwarna PINK, untuk menandai Jumlah komentar yang tampil pada pencarian google.
  • Pada bagian kode berwarna ORANGE,  untuk menandai Jumlah Rating Bintang yang tampil pada pencarian google.
  • Pada bagian kode berwarna BIRU MUDA,  untuk menandai Rich Snippets / Description yang tampil pada pencarian google.
10. SIMPAN TEMPLATE.


Untuk hasil pada langkah 9 diatas, Pada halaman posting tepatnya di bawah judul dan diatas artikel, akan tampak seperti gambar berikut :

Nah..., Sekarang tinggal kita lihat, apakah google berhasil mengekstrak Rating Bintang dan Rich Snippets yang anda pasang pada halaman post, anda dapat mempergunakan "Rich Snippets Testing Tool". Silahkan masukkan ULR ARTIKEL anda.

Bila anda berhasil maka akan tampak seperti gambar berikut :
Kotak merah pada gambar diatas menunjukkan bahwa link author bekerja dengan baik.

Kemudian dibawahnya :
Kotak merah pada gambar diatas menunjukkan bahwa Item yang di review sudah muncul dengan baik.



NB :
Keluhan yang banyak terjadi dikarenakan penempatan link publisher terletak pada halaman yang sama dengan link author, yaitu sama - sama muncul pada homepage. Dan google sendiri sangat menyarankan penempatan link publisher pada homepage dan link author pada halaman post atau halaman konten.
  • Kalau Link publisher diletakkan tepat setelah <head>
  • Sedang Link Author, cara meletakkannya seperti pada langkah ke-9 pada bagian kode berwarna BIRU
Dan pada artikel berikutnya saya akan coba bahas tentang bagaimana mengatasi masalah - masalah muncul ketika menggunakan Rating Bintang Rich Snippets.

OK... Selamat mencoba dan Semoga bermanfaat....
Jangan lupa luangkan waktu untuk beri komentar dengan menggunakan nama anda yang benar ya......agar saya bisa merespon komentar anda dengan baik.

Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda gunakan tombol berlangganan artikel yang ada disebelah kanan halaman ini, atau melalui tombol dibawah ini.
Ping your blog, website, or RSS feed for Free


Related Articles :

Baca artikel lain :

Informasi Artikel :
Judul : "Cara Pasang Rating Bintang Rich Snippets"
Diulas Oleh : | Senin, 12 Maret 2012 | 00.24
Description : Bagi yang belum atau masih kesulitan memasang Rating Bintang dan Rich Snippets, berikut langkah yang paling pas dan mudah untuk memasang Rat...
Label :
Rating : 6.4 Dari 10, Berdasarkan 3900+ Dari 39 000+ Pengunjung.



 

Label:

39 komentar:

  1. Noercholis12 Maret 2012 pukul 00.59

    Mantab lah....

    BalasHapus
  2. Yopan Prihadi24 Maret 2012 pukul 22.33

    Saya sudah coba beberapa kali dari artikel yang lain tapi tidak berhasil.
    Dan dari artikel ini saya terapkan langsung dan BERHASIL..

    Thanks for all..

    BalasHapus
  3. Dapur Tutorial BLogspot24 Maret 2012 pukul 23.17

    pusing kakak masih belm bisa

    BalasHapus
  4. Yopan Prihadi25 Maret 2012 pukul 05.52

    Mas Noer Holis..
    Ada kendala baru yang muncul nih..
    Jadi pada setiap postingan artikel selalu muncul "Description" yang menjelaskan beberapa kalimat awal dari artikel. Artinya ada kalimat ganda (sama persis) yang muncul pada setiap artikel.

    Barangkali ada solusi bisa sharing lagi mas..

    Thanks for all..

    BalasHapus
  5. Noercholis25 Maret 2012 pukul 06.20

    enarnya tidak masalah... tapi bila anda merasa tidak nyaman dengan tampilan seperti itu, untuk deretan kode pada langkah ke-9... bisa anda letakkan dibawah posting.

    Kebetulan saya lihat dibawah setiap artikel anda, terdapat link author dan data header atau tanggal....
    yg dibawahnya lagi ada deretan tombol share...

    Nah menurut saya untuk deretan kode pada langkah ke-9, sangat cocok ditempatkan diatas deretan tombol share... tadi, untuk menggantikan link author dan tanggal.... yg sudah ada sebelumnya.

    Pada template anda kalua tidak salah tempatnya tepatdibawah kode :

    -------------------------
    post-footer-line post-footer-line-1
    -------------------------


    OK.... selamat mencoba... semoga penjelasan saya membantu...

    BalasHapus
  6. Yopan Prihadi25 Maret 2012 pukul 06.42

    Saya sudah coba edit sendiri, untuk langkah ke-9 kode paling akhir yang ini :

    Description :
    span itemprop='description'
    data:post.snippet

    saya delete dan hasilnya sudah bagus kembali.

    Thanks buat sharingnya mas..

    BalasHapus
  7. Iwan28 Maret 2012 pukul 06.36

    Mas... kalau di terapkan di website, gmana yah caranya mohon pencerahan...Thanks b4

    BalasHapus
    Balasan
    1. Noercholis28 Maret 2012 pukul 12.18

      Sebenarnya tidak jauh berbeda, yang penting anda sudah mengerti tentang HTML dan sudah melakukan seperti berikut, dan langkahnya tidak jauh berbeda :
      1. Membuat profil di google plus.
      Sebagai referensi, anda baca artikel berikut :
      http://www.carabuatwebgratis.com/2012/03/mengganti-profil-blogger-ke-google-plus.html

      2. Menampilkan Author blog di google.
      Sebagai referensi, anda baca artikel berikut :
      http://www.carabuatwebgratis.com/2012/03/cara-menampilkan-author-blog-di-google.html

      3. Memberikan link publisher pada home page.
      Sebagai referensi, anda baca artikel berikut :
      http://www.carabuatwebgratis.com/2012/03/memberikan-link-publisher-pada-home.html




      Untuk bagian berikut :
      --------------------------------
      itemprop='itemreviewed' (title konten)
      itemprop='reviewer' (penulis)
      itemprop='description' (description isi konten)
      itemprop='rating' (jumlaj rating)
      --------------------------------

      Anda bisa lakukan secara manual pada halaman setiap konten.

      Yang terpenting pada Homepage, reviewer sebagai penerbit atau publisher.
      Dan pada setiap halaman konten, reviewer sebagai author atau penulis.

      Hapus
  8. Unknown28 Maret 2012 pukul 06.53

    mantab gan,thanks infonya,tukar link yuk gan,mw gak?

    BalasHapus
    Balasan
    1. Noercholis28 Maret 2012 pukul 12.00

      Boleeh... silahkan copy kodenya dan pajang di Blog anda, bila sudah silahkan anda beri tahu saya... kemudian saya akan pasang Link anda di Blog tercinta ini....

      Hapus
  9. obat herbal tipes4 April 2012 pukul 00.46

    maaf nih gan klo pasang ini berpengaruh gx buat seo-nya???

    BalasHapus
    Balasan
    1. Noercholis4 April 2012 pukul 06.18

      untuk pengaruh dan tidaknya dgn seo, saya tdk njamin.
      Tapi paling tidak google tetap membaca artikel yg kita review.

      Dan dgan menggunakan trik ini, artikel kita tampil lebih terlihat dengan adanya bintang.

      tetap menarik kan?

      Hapus
    2. obat herbal alami batuk berdarah28 April 2012 pukul 00.26

      ok deh om kalo begitu akan saya coba praktekan om mudah mudahn ada perubahannya yg baik ajah ya om :)
      makasih atas sharenya

      Hapus
  10. persip9 April 2012 pukul 09.22

    makasih bos..
    udah beberapa kali keliling google menemukan artikel yg saya cari seperti ini tetapi selalu gagal
    akhirnya menemukan blog carabuatwebgratis.com misi saya sukses. terimakasih gan

    BalasHapus
  11. Noercholis26 April 2012 pukul 09.00

    Sama-sama....
    oh iya... banner anda sudah terpajang di blog tercinta ini.... silahkan anda cek...

    BalasHapus
  12. apdm9 Mei 2012 pukul 08.59

    salam

    saya gagal melakukanya, boleh tologn x..hehe

    BalasHapus
    Balasan
    1. Noercholis9 Mei 2012 pukul 19.55

      dibagian mana anda mengalami kesulitan...

      Hapus
  13. Nuim Hayat17 Mei 2012 pukul 19.03

    gan punya saya sudah ada rating snippet di webmaster tools rich snippet. tapi kapan muncul di search engine kok belum ada.

    BalasHapus
  14. Anonim18 Mei 2012 pukul 11.52

    Mantap sob tutorialnya, lengkap ma keluhan segala wkwkwkwkk top dah :D

    BalasHapus
  15. Unknown22 Mei 2012 pukul 01.48

    sob kok blog saya malah jadi seperti ini
    http://jakselcommunity.blogspot.com/
    tapi ga ada bintang'a di mbah google

    BalasHapus
    Balasan
    1. Noercholis22 Mei 2012 pukul 22.58

      saya rasa blog anda tidak ada masalah...
      Dalam mesin pencarian google tidak langsung akan muncul rating bintang. Ditunggu saja... lambat laun bila sudah terbaca oleh google, akan muncul dengan sendirinya... semakin sering dibaca pengunjung akan semakin cepat, itupun bisa memakan waktu hingga satu bulan lebih. Kecuali anda beruntung....

      Yang terpenting anda sudah berhasil pada alat tes "Rich Snippets Testing Tool"

      sabar ya....

      Hapus
  16. screamcode1 Juni 2012 pukul 22.03

    masalah ane sama kaya yang diatas,,, di search engine blum ada bintangnya hehehe,, oy gan trus klo biar ada fotonya di search engine tu gimana ya???

    BalasHapus
    Balasan
    1. Noercholis4 Juni 2012 pukul 00.13

      masalah ini memang banyak dialami para blogger, dan kita memang harus terima dengan sabar.
      saya juga sempat mengalami hal yg sama lama2 profil dan rating bintangpun muncul di search engine pd setiap postingan. Tapi kini lambat-laun mulai pada menghilang satu persatu baik rating bintang maupun foto profilnya.

      Sabar ya.... yg penting trik ini sudah kita terapkan... dan kita tunggu lagi kebaikan mbah google kita... OK.

      Hapus
    2. BLOG FAEDAH JAYA16 Desember 2012 pukul 01.11

      Emmm Tidak langsung ya om,, Walah Pantasan saya coba berkali2 kok tidak berhasil2 juga.. Ga tau proses ya om.. OK dech kalau gitu biar gw coba lagi.. Thanks ya om atas info dan petunjuknya.. Salam Blog Faedah Jaya

      Hapus
  17. Unknown26 Juli 2012 pukul 13.40

    reverensi yang sangat bagus namun terjadi kendala pada step 6 padahal saya telah mencek satu-persatu yang ada hanya h3?? dan akhirnya gagal semuanya

    BalasHapus
  18. Putra Kefa28 Agustus 2012 pukul 21.22

    Buat ADMIN salam kenaL.MANTAPPPPPP.....tipsnya sangat berguna.Sekali tes langsung jadi.Baru kali ini saya bisa membuatnya, sudah lama saya mencari tutorialnya di jagat maya tapi hari ini saya temukan web yang sangat bermamfaat buat saya.Salam saya MARKUS KONO

    Bang jangan lupa follback blogku ya,klo boleh bisa kasi info buat aku apa saja kekuranagn yg ada di blogku .
    Anaktimor-17 Blog-Official Web For Anak Kefa ASli.

    BalasHapus
  19. Nakusan Computer18 September 2012 pukul 15.21

    punya saya ga berhasil sob...Hmmmmm
    makasih sob dah berbagi.

    BalasHapus
  20. Cara Memesan Ace Maxs9 Oktober 2012 pukul 03.45

    aduh panjang banget nih gan tutornya,,,

    BalasHapus
  21. obat stroke16 November 2012 pukul 22.18

    tapi merkipun panjang mantap kayaknya.. cumanyang masih saya bingung.. pungsi utamanya lebh untuk meningkatakan seo apa bukan ya? atau sekedar mempermudah atau pernak pernik aja nih..

    BalasHapus
  22. obat tradisional asma15 Desember 2012 pukul 06.04

    kalau untuk wordpress bisa gak sob,,,,,,,,,,

    BalasHapus
  23. penyakit hepatitis c28 Maret 2013 pukul 00.44

    langsung di praktekin aj gan..makash bnya gan..

    BalasHapus
  24. aifafa18 April 2013 pukul 07.20

    mantap gan

    BalasHapus
  25. DARAH TINGGI23 Mei 2013 pukul 20.39

    nah itu kan untuk blogspot??? nah ada gx buat wordpress gan????????

    BalasHapus
  26. Master Dealer7 Juli 2013 pukul 07.05

    Thanks infonya Pak, sangat bermanfaat sekali untuk menunjang bisnis online saya.

    BalasHapus
  27. Anonim6 Oktober 2013 pukul 07.56

    thks atas infonya om :0
    http://freebiexp.blogspot.com

    BalasHapus
  28. Apradiz Renfaan14 April 2014 pukul 15.21

    thanks gan tipsnya...

    BalasHapus
  29. Unknown22 Desember 2014 pukul 20.32

    kunjungan siang gan

    BalasHapus

BLOGGER

TUTORIAL BLOGGER

TUTORIAL BLOGGER

REKOMENDASI

REKOMENDASI

Artikel Terbaru

POST POPULER

Entri Populer


HEADLINE

DAFTAR ISI

DAFTAR ISI


BLOGGER

Comments

HTML

Side Ads

CSS

Footer Ads

JAVASCRIPT

Random News


BACKLINK

INFO

Bagi anda yang berminat tukar link, silahkan copy linknya lalu pasang di Blog anda. Dan bila sudah terpasang, jangan lupa beritahu saya, agar link anda segera saya pasang di Blog tercinta ini.

CEO BLOG MAS NOER

Noer cholis

Plosokuning V, Minomartani, Ngaglik, Sleman, Yogyakarta.

TUKAR LINK

TUKAR LINK




Baca artikel "Manfaat Tukar Link"











Baca artikel "Manfaat Tukar Link"

LINK SAHABAT

LINK SAHABAT


CHAT

CHAT




TESTIMONI

Follow Us

Bila anda merasa artikel ataupun tutorial yang ada di Blog ini bermanfaat, anda bisa berikan suport comment melalui form ini. Form ini sangat bagus sebagai BACKLINK buat blog anda, silahkan tinggalkan link anda....

RECENT COMMENT

Recent Comments


top down