Membuat widget or gadget berbeda-beda tampilan

Otrelah boogle_lover kali ini saya akan menulis trik bagaimana caranya membuat widget/gadget berbeda-beda tampilan untuk background, warna tulisan , border dan lain-lain. trik ini di khususkan terutama bagi yang suka berexperimen dan pingin beda.
Untuk melihat hasilnya bisa boogle_lover  lihat di blog bloon_online ini.

perhatin
Saya menggunakan trik ini pada minima standar , jadi mungkin untuk template yang lain bisa saja kasus-nya berbeda-beda.

Pemahan Dasar

1. Ini sering saya jelaskan. Setiap kita menambah gadget baik Html/Javascript, Text, Linklist dan lain-lain, Blogspot menambahkan Id yang sangat khusus berupa angka / penomeran di ujung nama gadgetnya . untuk widget/gadget Html misalnya HTML1, dan jika kita menambah widget HTML lagi maka yang kita dapati menjadi HTML2, HTML3, HTML4. begitu juga untuk widget yang lain-nya.
2. Untuk mengetahui nama dan id sebuah widget/gadget secara mudah boogle_lover dapat mengenalinya melalui halaman depan ketika posisi kita login. buka/tekan gambar berbentuk obeng&kunci ( atau bisa juga pada halaman page elements tekan Edit pada gadgetnya ). setelah jendela gadget terbuka periksa pada bagian frame atas. seperti yang di tunjukan gambar di bawah ini.


3. Pemahaman dasar selanjutnya menggenal bagian-bagian script html gadget secara garis besar. ( yang nantinya dapat boogle_friends mangfaatkan untuk mengatur latar belakang berupa gambar/color, warna tulisan , border/binkai dan lain-lain. red )


a. id = Text1 merupakan gadget itu sendiri
b. h2 merupakan title/judul gadget
c. widget-content merupakan konten / isi gadget

Jika di ilustrasikan hasilnya akan seperti ini.


4. Pemahan dasar yang terakhir ialah dalam penulisan css nya hurup-nya harus benar dan sesuai. contoh Text1 = penulisan yang benar - text1 = penulisan yang salah. HTML1 = benar – Html1 = salah.
Otre deh boogle_friends ternyata pegel juga nulis-nya hehe..
Setelah memahami tulisan di atas yang kita lakukan menambah kode Css –nya ke dalam blog ( biasanya saya menyimpan sebelum tulisan ini   ]]></b:skin> . red ).
Oh iya jangan lupa karena ini merupan sebuah selektor id , maka menurut buku mang omo harus di awali dengan tanda pagar [ # ] . jadi contohnya seperti ini.

sebelum tulisan ini
]]></b:skin>
masukan kode css di bawah ini
a.

#Text1 {background:#d3c6ac;padding:3px;}

b.

#Text1 h2 {background:#8bed99}

c.

#Text1 .widget-content {background:#99bde1;}

Untuk gadget Html

#HTML1 {background:#d3c6ac;padding:3px;}
#HTML1 h2 {background:#8bed99}
#HTML1 .widget-content {background:#99bde1;}

thankiyu untuk komentarnya :)

Wibiya : ToolBar Blogger Canggih

Wibiya - salah satu website yang menyediakan fasilitas free toolbar untuk blog Anda, toolbar dari wibia ini sangat canggih.
Fitur dari toolbar wibiya ini diantaranya : pencarian langsung, who's online, live video, translate, timeline, Bermacam-macam Facebook widget, twitter, youtube, Live chat dan foto sharing kamu. Hmmm canggih bukan toolbar ini? penasaran ingin lihat Demonya?? langsung aja kunjungi wibia dan lihat di browser kamu bagian bawah.

Setelah Anda melihat-lihat apakah Anda ingin memasangnya kedalam Blogger Anda? Nah dibawah ini ulasan cara membuatnya.

1. Buka website wibiya.com dan klik tombol "Get It Now"

2. Pada Form "Create An Account" isi form sesuai dengan data Anda lalu kik tomblol "Next"

3. Lalu milih tema toolbar Anda pada bagian "Select A Theme" Lalu klik tombol "Next"

4. Pada bagian "Application Setting" configurasi account-account Anda kedalam toolbar tersebut, Seletlah itu klik tombol "Next"

5. Pada bagian "Add it" atau final installation klik logo "Blogger" atau install on blogger

6. Pastikan Anda sudah Log in blogger untuk memasang widgetnya, setelah Anda klik logo blogger pada tahap Final, Anda langsung ditujukan pada "Import page elements" blogger



7. Select blog yang Anda ingin pasang Toolbarnya, Lalu klik tombol "Add Widget" maka toolbar akan terpasang otomatis dan melayang di bagian bawah blog Anda.

Nah selesai deh ulasan tentang cara membuat Toolbar canggih wibiya, toolbar ini banyak digunakan oleh para pemilik website untuk mempercanggih websitenya, jadi blog kita jika menggunakan toolbar ini serasa seperti di Facebook.

Sekian semoga bermanfaat.