TAMBAH STAR RATING SEDERHANA DI BLOGSPOT

Tadi pagi bangun tidur kepikiran bagaimana supaya nambahkan rating berupa gambar bintang.. coba cari-cari plugin yang ada kebanyakan 5 star, sedangkan rating yang sudah saya berikan 10 star.. yahh daripada kelamaan nyari akhirnya bikin sendiri saja.
Jika ingin mengetahui cara membuat rating bintang versi saya,  silahkan dlihat langkah-langkahnya dibawah ini..


1. Siapkan 3 buah gambar bintang seperti ini..

Bintang Kosong

Bintang Penuh

Bintang Setengah

2. Simpan ke 3 gambar tersebut kedalam Posting yg baru berupa Draft saja.. gunanya utk menaruh gambar bintang di blogspot anda. Catat url masing-masing gambar bintang..

3.  Di menu Layout tambahkan gadget baru yaitu HTML/JavaScript, letakkan diatas Blog Posts, Title kosongkan saja.. isi scriptnya nanti seperti ini

<script language="javascript">
function setStar(star, half, id)
{
    var iHalf = 0;if(half == true)iHalf = 1;
    var total = 10 - star - iHalf;
    var str = "";
    for(var i=0; i < star; i++)
        str = str + "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzsD2s4s19x6iXz99yjQXA4o2x0Hfye7TkG7GgItvs4C4DipsA6RSBinDA9DOX_2nyBCaPp10xfcq_h1gLL6mBVmc9l_EcQ3z-KRXfwE_Xjm_MPC5Als2pGr1I-iUjygmwC_-Prhlh7HTj/s1600/fullstar.jpg'/>";
    for(var i=0; i < iHalf; i++)
        str = str + "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5U8VDN5nmmXX2CSMUFbsiYfXI9sdsHD43vTmI6NzrNENnvB-lXP1nzTqFphcimSEbk_5ltyPlZ7slHfKwEmhqZHoebEbcVvSEqQ96aD9qkwi36addnwaHR0nGOX-lWQMxBQESuKnNza6D/s1600/halfstar.jpg'/>";
    for(var i=0; i < total; i++)
        str = str + "<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2QIKUoEg3u3FQ1aiVIAeiv1b0ODgh0Zs4dZ1t-9CedmizOAOQdok5lp9cNO1NxwuJKvDx3XWvf8qgKzonNXSp8f4-El7DX0x7hK_wWyxLBdi0XnTAl3pc5Rw70nE7csj5Ic18dfLdJ1ad/s1600/emptystar.jpg'/>";
    document.getElementById("ratingstar" + id).innerHTML = str;
}
</script>

Angka 10 diatas menunjukkan jumlah maksimum bintang, bisa diubah terserah anda jumlah maksimum bintang yg diinginkan.
Ubah bagian yang berwarna biru dengan url gambar bintang anda yg telah disimpan sebagai draft
Simpan gadget ini.

4. Didalam posting anda tambahkan script seperti ini, sisipkan dibagian yang anda inginkan..

<label id="ratingstarROBOT BOYS"></label>
<script language="javascript">
setStar(8,true,"ROBOT BOYS");
</script>

fungsi javascript diatas setStar memiliki 3 parameter
- Parameter 1 = Jumlah Nilai
- Parameter 2 = Apakah ada nilai setengahnya (true jika ada, false jika tidak)
- Parameter 3 = Id Label (misalkan diberi nama yang unik)
contoh diatas setStar(8,true,"ROBOT BOYS")
artinya nilai bintangnya adalah 8.5 dan akan ditulis didalam label "ROBOT BOYS"
Bagian biru diatas adalah id unik anda.. misal diisikan judul posting..

5. Oke.. sudah selesai... hasilnya bisa dilihat di postingan2  komik saya di blog ini..