Tampilkan postingan dengan label menampilkan rating bintang. Tampilkan semua postingan
Cara Mudah Memasang Rating Bintang Di Postingan - Pada artikel sebelumnya saya sudah menjelaskan cara memasang rating bintang di artikel postingan yang setelah saya cermati ternyata masih ada beberapa teman blogger yang kesulitan dalam menerapkan cara tersebut, seperti yang dialami Menghilangkan Bau Mulut dan juga yang dialami oleh Klik Disini. Menanggapi beberapa keluhan dari artikel sebelumnya tersebut, maka dari itulah artikel Cara Mudah Memasang Rating Bintang Di Postingan ini saya buat khusus untuk anda yang menginginkan rating bintang tampil di artikel blog anda.
Berbeda dengan cara sebelumnya yang harus merubah tampilan blogger ke draft.blogger dan menambahkan beberapa kode kedalam template dan hasilnya juga belum tampak yang kemungkinan karena pengaruh koneksi atau karena kode rating merupakan dari old versionnya blogger sehingga untuk menampilkan rating bintang di artikel cukup memakan waktu loading yang lama dan pada artikel ini saya akan memberikan solusi terbaik dan termudah dalam memasang rating bintang di artikel postingan blog tapi cara ini tidak berlaku untuk menampilkan rating bintang di Google dan cara ini juga telah saya terapkan di blog saya yang lain, seperti terlihat pada gambar berikut ini
Seperti terlihat pada gambar diatas, memasang rating bintang di postingan kali ini bukan hanya menampilkan banyaknya bintang yang terklik sebagai vote oleh pengunjung blog anda tapi juga menampilkan banyaknya view artikel yang terlihat atau yang telah dibaca oleh pengunjung blog anda,,, keren bukan dan widget ini hampir sama dengan milikinya wordpress bahkan ada beberapa plugin rating bintang yang mirip dengan tampilan seperti gambar diatas. Lalu bagaimana cara memasang rating bintang di postingan tersebut?
Berikut Cara Mudah Memasang Rating Bintang Di Postingan
Rate this posting: adalah tulisan yang terdapat didalam kode script rating bintang, silahkan dihapus agar tidak ikut tampil
<div style='clear: both;'/> adalah kode tambahan untuk memutus paragraph
Semoga dengan adanya salah satu artikel tentang memasang rating bintang di postingan ini bisa memudahkan anda untuk menampilkan rating bintang di blog anda. Jika ada pertanyaan, silahkan tinggalkan komentar anda di artikel ini, Cara Mudah Memasang Rating Bintang Di Postingan
Berbeda dengan cara sebelumnya yang harus merubah tampilan blogger ke draft.blogger dan menambahkan beberapa kode kedalam template dan hasilnya juga belum tampak yang kemungkinan karena pengaruh koneksi atau karena kode rating merupakan dari old versionnya blogger sehingga untuk menampilkan rating bintang di artikel cukup memakan waktu loading yang lama dan pada artikel ini saya akan memberikan solusi terbaik dan termudah dalam memasang rating bintang di artikel postingan blog tapi cara ini tidak berlaku untuk menampilkan rating bintang di Google dan cara ini juga telah saya terapkan di blog saya yang lain, seperti terlihat pada gambar berikut ini
Seperti terlihat pada gambar diatas, memasang rating bintang di postingan kali ini bukan hanya menampilkan banyaknya bintang yang terklik sebagai vote oleh pengunjung blog anda tapi juga menampilkan banyaknya view artikel yang terlihat atau yang telah dibaca oleh pengunjung blog anda,,, keren bukan dan widget ini hampir sama dengan milikinya wordpress bahkan ada beberapa plugin rating bintang yang mirip dengan tampilan seperti gambar diatas. Lalu bagaimana cara memasang rating bintang di postingan tersebut?
Berikut Cara Mudah Memasang Rating Bintang Di Postingan
- Buka situs layanan rating bintang terlebih dahulu di Graddit.com seperti yang terlihat pada gambar berikut ini
- Selanjutnya klik pada menu Rating widgets atau gambar Ratings, bukan yang Polls
- Setelah mengkilk menu Rating widgets, maka akan muncul halaman seperti gambar berikut ini dan ikuti tahapan memasang rating bintang sesuai nomer yang telah saya berikan pada gambar dengan penjelasan sebagai berikut
- Pasang kode link CSS di antara kode <head> .... </head> (lihat gambar di no.1) ditemplate blog anda
- Pilih widget tampilan rating bintang yang ingin anda tampilkan di postingan blog anda (lihat gambar di no.2)
- Pilih platform blog anda yaitu Blogger (lihat gambar di no.3)
- Salin kode script rating bintang kedalam template blog anda (lihat gambar di no.4)
Untuk menyalin kodenya dan agar tampilan rating bintang berada dibawah judul artikel blog, silahkan ikuti caranya sebagai berikut;- Buka laman pengeditan Template blog anda
- Centang Expand Template Widget
- Cari kode <data:post.body/>
- Salin kode script rating bintang sebelum kode <data:post.body/> yang kedua, lihat contoh berikut yang telah saya terapkan diblog saya yang lain
<div class='post-body entry-content'>
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><b>Readmore</b><a expr:href='data:post.url' rel='nofollow'><data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'>
<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'>{[["☆","★"]]}</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 + "&views=yes&average=yes&votes=yes"'></script></b:if><div style='clear: both;'/>
<data:post.body/>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
- Selesai dan klik Simpan Template. Silahkan lihat hasilnya...
Rate this posting: adalah tulisan yang terdapat didalam kode script rating bintang, silahkan dihapus agar tidak ikut tampil
<div style='clear: both;'/> adalah kode tambahan untuk memutus paragraph
Semoga dengan adanya salah satu artikel tentang memasang rating bintang di postingan ini bisa memudahkan anda untuk menampilkan rating bintang di blog anda. Jika ada pertanyaan, silahkan tinggalkan komentar anda di artikel ini, Cara Mudah Memasang Rating Bintang Di Postingan
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Mudah Memasang Rating Bintang Di Postingan
Cara Membuat Rating Bintang Di Posting Artikel Blog adalah cara yang sama dengan cara membuat & menampilkan rating bintang di Google namun beda penampilan. Jika cara membuat rating bintang di posting artikel blog akan menampilkan tombol rating bintang secara otomatis disetiap artikel blog yang akan membantu pengunjung blog memberikan penilaian terhadap artikel yang dibacanya. Sedangkan cara membuat & menampilkan rating bintang di Google, akan membantu artikel blog lebih banyak dikunjungi oleh pengunjung melalui search engine karena adanya nilai pageview yang tampil. Semakin tinggi nilai pageviewnya, semakin banyak pengunjung yang akan membaca artikel blog dan itu pun juga tergantung dari posisi SERP artikel di search engine. Jika posisi SERP ada di halaman belakang, ya sama saja hasilnya nol! :)
Berikut Panduan Cara Membuat Rating Bintang Di Posting Artikel Blog
Berikut Panduan Cara Membuat Rating Bintang Di Posting Artikel Blog
- Masuk ke akun blogger melalui Draft.Blogger.com
- Pilih dan klik Tata Letak
- Klik edit pada tab kolom Posting Blog
- Tampil halaman pop-up seperti berikut ini
- Beri tanda pada check box Show Star Rating
- Selanjutnya beralih ke dashboard blogger anda...
- Pilih dan klik Template >> Edit Html >> Lanjutkan >> centang Expand Template Widget >> tekan Ctrl + F di keyboard
- Cari kode <data:post.body/> atau <p><data:post.body/></p>
- Tempatkan kode berikut dibawah <data:post.body/> atau <p><data:post.body/></p> atau komponen yang menyertainya seperti Artikel terkait, Tombol sosial bookmark, Permalink blog, dll.
<span class='star-ratings'>
<b:if cond='data:top.showStars'>
<div expr:g:background-color='data:backgroundColor' expr:g:text-color='data:textColor' expr:g:url='data:post.absoluteUrl' g:height='42' g:type='RatingPanel' g:width='280'/>
</b:if>
</span> - Simpan template dan lihat hasilnya seperti yang tampak pada artikel blog ini yang berdampingan dengan tombol sosial bookmark
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Membuat Rating Bintang Di Posting Artikel Blog
Cara Membuat & Menampilkan Rating Bintang Di Google merupakan salah satu cara untuk menampilkan banyaknya review terhadap blog atau artikel blog yang berguna dalam optimasi SEO agar blog atau artikel blog mendapatkan posisi yang baik di SERP karena banyaknya view page atau halaman yang tampil. Selain itu, dengan menerapkan cara membuat & menampilkan rating bintang di Google, juga akan menjadi daya tarik tersendiri dan meningkatkan nilai klik karena adanya tampilan rating bintang untuk artikel blog di search engine seperti tampilan gambar berikut ini
Berikut Cara Membuat & Menampilkan Rating Bintang Di Google
Berikut Cara Membuat & Menampilkan Rating Bintang Di Google
- Anda harus punya akun di Google Plus terlebih dahulu, jika belum silahkan klik https://plus.google.com/
- Masuk ke akun blogger anda. Pilih dan klik Template >> Edit Html >> Lanjutkan >> centang Expand Template Widget >> tekan Ctrl + F di keyboard.
- Cari kode <head>
- Tempatkan kode <link href='https://plus.google.com/113748039543292949277' rel='author'/> tepat dibawah kode <head>.
Sebelumnya, 113748039543292949277 merupakan ID dari akun Google Plus saya, silahkan ganti dengan ID Google Plus anda. - Simpan temlate.
- Tempatkan kode <link href='https://plus.google.com/113748039543292949277' rel='author'/> tepat dibawah kode <head>.
- Cari kode <body>
- Tempatkan kode berikut tepat dibawah kode <body>
<div>
<div itemscope='' itemtype='http://data-vocabulary.org/Review'> - Cari kode </body>
- Tempatkan kode </div></div> tepat diatas kode </body>
- Simpan template.
- Tempatkan kode berikut tepat dibawah kode <body>
- Cari kode post-title entry-title dengan hasil pencarian seperti berikut
<h3 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>
</h3>
</b:if>- Tempatkan kode <span itemprop='itemreviewed'><span itemprop='description'> dan </span></span> diantara kode post-title entry-title
- Hasilnya akan seperti ini
<span itemprop='itemreviewed'><span itemprop='description'>
<h3 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>
</h3>
</span></span>
</b:if> - Simpan template.
- Cari kode <data:post.body/> atau <p><data:post.body/></p>
- Tempatkan kode berikut tepat dibawah kode <data:post.body/> atau <p><data:post.body/></p> atau diantara elemen-elemen (Artikel terkait, sosial bookmark, dll)
Description: <span itemprop="description"><data:post.title></data:post.title></span>
Rating: <span itemprop="rating">3.5</span>
Reviewer: <span itemprop="reviewer"><data:post.author></data:post.author></span>
ItemReviewed: <span itemprop="itemreviewed"><data:post.title></data:post.title></span> - Simpan Template.
- Tempatkan kode berikut tepat dibawah kode <data:post.body/> atau <p><data:post.body/></p> atau diantara elemen-elemen (Artikel terkait, sosial bookmark, dll)
- Agar panduan cara membuat & menampilkan rating bintang di Google ini berhasil. Lakukan verifikasi penulis blog (author) ke akun Google Plus anda, dengan cara berikut ini
- Masuk ke akun Google Plus anda.
- Klik menu Edit Profil yang ada disebelah atas.
- Klik menu Kontributor Untuk yang ada disebelah bawah.
- Klik tambahkan tautan khusus.
- Isikan label dengan judul blog anda.
- Isikan url dengan url blog anda.
- Simpan
- Klik Pengeditan Selesai.
- Langkah terakhir, kunjungi http://www.google.com/webmasters/tools/richsnippets untuk mengetahui berhasil tidaknya cara membuat & menampilkan rating bintang di Google ini.
- Isikan url dari link artikel blog anda
- Jika berhasil, maka akan seperti gambar berikut ini
<
Rating: 4.5
Reviewer: Unknown
ItemReviewed: Cara Membuat & Menampilkan Rating Bintang Di Google
