Pasang Star Rating Dengan Gambar Author

Pasang Star Rating Dengan Gambar Author
Pasang Star Rating Dengan Gambar Author Tanpa Harus Mendaftar Di Google+ dan akan tampil di hasil pencarian Serp Google. kali ini kita akan mudah memasangnya di blogger tanpa harus repot-repot untuk mendaftarkan blog di profil google+ . hanya menggunakan microdata dari Rich Snippets Google. dengan beberapa itemtype vocabulary.org . karena banyak sekali blog pemula yang bingung untuk mendaftarkan diri di google+ yang ingin menampilkan foto profilnya di Serp google. nah berikut test yang saya lakukan pada richsnippet google yang hasilnya akan seperti gambar di bawah :
Pasang Star Rating Dengan Gambar Author
Berikut kontribusi HTML akan menghasilkan sebuah description penulis dan keterangan secara otomatis di tiap halaman artikel blog.
contoh gambar di bawah :
Pasang Star Rating Dengan Gambar Author
CARA MEMASANG PADA TEMPLATE BLOGGER
1. Edit template > cheklist expand > kemudian pasang CSS > Cari ]]></skin> lalu simpan CSS letakan tepat di atasnya.
.review-author {
    background-color: rgba(0,0,0,0.1);
    display: inline-block !important;
    height: 100%;
    width: 100%;
    border: 1px solid #afafaf;
    box-shadow: 1px 2px 3px rgba(0,0,0,0.5),0 0 10px rgba(0,0,0,0.1) inset;
    -moz-box-shadow: 1px 2px 3px rgba(0,0,0,0.5),0 0 10px rgba(0,0,0,0.1) inset;
    -webkit-box-shadow: 1px 2px 3px rgba(0,0,0,0.5),0 0 10px rgba(0,0,0,0.1) inset;
}
2 . Cari code <data:post.body/>. dan letakan HTML berikut tepat di bawahnya.
Jika pada template anda code <data:post.body/> ada dua. maka pilih yang pertama saja. jika gagal pilih yang kedua. jika masih gagal pasang pada semua code dari pada bingung. hehehe

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='review-author' style='margin-top:30px'>
<div itemscope='' itemtype='http://data-vocabulary.org/Review-aggregate'>
<div style='padding:5px; width:0%; float:left;'>
<img itemprop='photo' src='URL_Gambar_Anda'/></div>
<div style='width: 80%;padding:5px; font-size:11px; float: right;'>
Judul: <span itemprop='itemreviewed'><data:post.title/></span><br/>
Rating: <span itemprop='rating' itemscope='' itemtype='http://data-vocabulary.org/Rating'>
      <span itemprop='average'>10</span>
      out of <span itemprop='best'>10</span>
    </span>
    based on <span itemprop='votes'>24</span> ratings.
    <span itemprop='count'>155</span> user reviews.<br/>
Ditulis Oleh <data:post.author/><br/>
Description : <data:blog.metaDescription/></div>
</div>
</div>
</b:if>       

NB : Ganti src='URL_Gambar_Anda' dengan URL Poto Profil author anda.
Terakhir Simpan template.
untuk melihat hasilnya silahkan anda check di Rich Snippets Testing Tool dan masukan URL Artikel terbaru anda .

license by under 88 blogspot.com
Post By : denzdii
Terkait : Rich Snippets -Recipes

13 comments:

  1. sudah saya coba kang trik nya, tapi picture na guedeeee banget yak tampilnya...hahahaha... coba lagi yakk ntar di kasih kabar lagee

    ReplyDelete
    Replies
    1. untuk gambar profil usahakan gambar max 72px

      Delete
  2. oh.. makasih kang infonya nanti saya coba lagi, di haturanan linggih di blog seadanya...:-bd

    ReplyDelete
    Replies
    1. Ok sob... hatur nuhun... atos linggih.. tapi teu aya kopi ach.. :D

      Delete
  3. mantepp,akhirnya nemu disiini....makasih masbray

    ReplyDelete
  4. kalo bole,kasih tutor jg donk masbray cara buat kotak koment keq gini ya,makasih

    ReplyDelete
  5. This comment has been removed by the author.

    ReplyDelete
  6. Description : data:blog.metaDescription

    deskripsinya itu diambil dari meta description y mana ya sob..??
    mohon pencerahan.... :)

    ReplyDelete
    Replies
    1. description blognya di aktifin aja, nanti di postingan ada tempat menulis descriptionnya \o/

      Delete
  7. kalo di wordpress bisa ga om? pake coding juga.

    ReplyDelete
  8. alhamdulilah berhasil kang, hatur nuhun.. :-d

    ReplyDelete
  9. ijin nyoba mang nuhun yak :D
    softwikia

    ReplyDelete
  10. salam kenal kang. Maaf mau nanya.
    yang angka 155 user reviews itu kan artinya jumlah berpa kali artikel itu dilihat. Bisa ga angka 155 itu di ganti dengan yg real, ga ditentukan 155 gitu..kode gimana tuh ya..ada yg bisa bantuin ga ..

    ReplyDelete

Perhatian !! Komentar Pada Bulan September 2012 belum bisa di balas.
di karenakan semua admin sedang sibuk dengan urusan kulliahnya.
semoga setelah akhir bulan artikel dan komentar akan segera di update.


terima kasih atas perhatiannya sekali lagi kami minta maaf yang sebesar-besarnya.

 
loading...
Top