Kumpulan Trick Blog TErbaru

About

New Trick hayalah blog kecil yang mencoba untuk memberikan dan menyajikan trick dan tips tentang blog
Kamis, 21 Januari 2016

Cara Mudah Memasang Rating Bintang Di 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 sobat yang menginginkan rating bintang tampil di artikel blog sobat.

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

Cara Mudah Memasang Rating Bintang Di Postingan

Seperti terlihat pada gambar diatas, memasang rating bintang di postingan kali ini bukan hanya menampilkan banyaknya bintang yang terklik sebagai vote oleh pengunjung blog sobat tapi juga menampilkan banyaknya view artikel yang terlihat atau yang telah dibaca oleh pengunjung blog sobat,,, 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
  1. Buka situs layanan rating bintang terlebih dahulu di Graddit.com seperti yang terlihat pada gambar berikut ini
    Cara Mudah Memasang Rating Bintang Di Postingan
  2. Selanjutnya klik pada menu Rating widgets atau gambar Ratings, bukan yang Polls
  3. Setelah mengkilk menu Rating widgets, maka akan muncul halaman seperti gambar berikut ini
    Cara Mudah Memasang Rating Bintang Di Postingan
    dan ikuti tahapan memasang rating bintang sesuai nomer yang telah saya berikan pada gambar dengan penjelasan sebagai berikut
    1. Pasang kode link CSS di antara kode <head> .... </head> (lihat gambar di no.1) ditemplate blog sobat
    2. Pilih widget tampilan rating bintang yang ingin sobat tampilkan di postingan blog sobat (lihat gambar di no.2)
    3. Pilih platform blog sobat yaitu Blogger (lihat gambar di no.3)
    4. Salin kode script rating bintang kedalam template blog sobat (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 sobat
      • 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 != &quot;item&quot;'>
        <div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
        <script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</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 == &quot;item&quot;'>
        <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
        <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'>{[[&quot;&#9734;&quot;,&quot;&#9733;&quot;]]}</div>
        <div expr:id='&quot;ffbs_stats_&quot; + data:post.id' class='ffbs_stats'></div>
        <script type='text/javascript' expr:src='&quot;http://www.graddit.com/rate/eng/5/&quot; + data:post.id + &quot;?id=&quot; + data:post.id + &quot;&amp;stats=ffbs_stats_&quot; + data:post.id + &quot;&amp;labels=labels_&quot; + data:post.id + &quot;&amp;info=info-&quot; + data:post.id + &quot;&amp;info_delay=2&amp;url=&quot; + data:post.url + &quot;&amp;views=yes&amp;average=yes&amp;votes=yes&quot;'></script></b:if>
        <div style='clear: both;'/>
        <data:post.body/>
        </b:if>
        <div style='clear: both;'/> <!-- clear for photos floats -->
        </div>
  4. Selesai dan klik Simpan Template. Silahkan lihat hasilnya...
Tambahan:
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 sobat untuk menampilkan rating bintang di blog sobat. Jika ada pertanyaan, silahkan tinggalkan komentar sobat di artikel ini, Cara Mudah Memasang Rating Bintang Di Postingan




Klik untuk melihat kode: :) =( :s :D :-D ^:D ^o^ 7:( :Q :p T_T @@, :-a :W *fck* x@

TOP