Customize Blogger’s poll Widget

October 17, 2007 by Adam Pahlevi  
Filed under Google Blogger


Dalam artikel kali ini, kita akan melakukan sedikit pengeditan di dalam template CSS kita untuk mempercantik widget Polling blogger kita. Misalkan kita akan nambagin beberapa sentuhan background dalam poll kita, atau poll kita mau diberi warna, dan merubah font serta bordernya? semuanya akan diungkapin di artikel yang satu ini.

Blogger, tidak lama bulan ini, telah meluncurkan sebuah widget bernama poll, yang mana mengijinkan para Bloggers untuk membuat widget polling. Kamu yang menentukan pertanyaan dan jawabannya, dan pengunjung situsmu menentukan pilihannya menurut jangka waktu yang disediakan oleh poll di blogger-blogmu. Ini terdengar seperti fitur yang bagus, tetapi sayang, kita tidak memiliki akses secara disen terhadap polling itu secara advance. Tapi tenang :), kita bisa melakukannya dengan lebih advance, yaitu secara manual.

Untuk memasang poll, pergi ke template -> page elements -> dan pilih Add a Page Element di sidebar yang kamu pilih. Pilih “poll”. Masukkan pertanyaan dalam poll-mu, dan juga suntikkan jawaban yang kamu tetapkan untuk dipilih bagi para pengunjung situsmu. Centang sebuah kotak (lupa namanya) jika kamu membolehkan jawaban lebih dari satu yang kamu harapkan dari mereka (ini berarti pengunjung dibolehkan menjawab lebih dari 1 jawaban). Dan atur tanggal paling lambat bagi pengunjungmu untuk memberikan tanggapan di polling di blogmu. Selesai dech.

Menambahkan Border dan Warna

Sekarang, mari kita menambahkan border dan warna background kedalam poll qta. Template -> Edit HTML, scrool text ke seperapat bagian CSS template-mu, dan tambahkan kode ini. Ya, untuk lebih mudahnya, kamu bisa menambahkan kode ini (yang berwarna merah) dibawah /* Sidebar Content */

/* Sidebar Content */

#Poll1{

background:#FFFF00;

border:3px solid #736AFF;

width:150px;

padding:0 10px;

}

(CTRL + CLICK to block this code)

Catatan (perhatikan):

1, ketika sebuah poll telah terbuat, blogger akan otomatis memberi tandara pada ID dalam widget tersebut. Jika hanya ada satu poll dalam blogmu, maka akan diberi nama ID oleh Blogger secara otomatis menjadi Pool1. tapi, jika ada poll lain didalam blog, maka yang kedua akan diberi nama Poll2, dan seterusnya

2. kita akan memberi warna background kuning (#FFFF00). Rubah dengan sembarang warna yang kamu suka jika mau.

3. Secara default, tidak ada border-frame pada widget yang berwarna. Untuk membuatnya berwarna pada widget Poll ini, kita akan merubah border menjadi 3 pixel terlebih dahulu. Kamu bisa melangsingkan ini menjadi 1 pixel jika kamu ingin membuat narrow-border. Oh ya, warna border disini sebagai contoh adalah #736AFF atau bisa dikatakan biru.

After saving the above modification to the template, this is the new look of our Poll widget. Doesn’t it catch your attention right away?

Jika kamu melakukan perbuhan seperti yang diatas, maka hasilnya akan tampax seperti ini.

Mengganti type Font pada Judul Polling

Jika kamu mau, kita bisa merubah font didalam blogger-poll kita dengan font yang berbeda dari font para widget yang lain. Kita diatas telah menambah beberapa kode untuk background, sekarang kita akan lakukan ini lagi (yang berwarna merah) juga tepat di bawah /* sidebar content /*, dan pastinya dibawah Poll1.

/* Sidebar Content */

#Poll1{

background:#FFFF00;

border:3px solid #736AFF;

width:150px;

padding:0 10px;

}

#Poll1 h2{

text-align:center;

font-size:140%;

color:#F87431;

font-family:arial;

font-weight:bold;

}

Catatan (penting):

1. properti Text-align diset ke center, akan merubah title widget poll mu dari kiri menjadi tengah. Jika kamu tak suka dirubah ketengah itu title, hapus aja nih baris kode.

2. Jika kamu tidak membutuhkan untuk memperbesar font. Kamu bisa mengubah font-size menjadi lebih kecil, ato sebaliknya.

3. Lagi, kamu bisa menambah sedikit warnah berbeda dalam warna text dalam widget poll-mu.

4. Disamping font-family, kamu bisa meubah wajah font dalam Judul Poll. Biasanya, font yang bersahabat untuk judul di blogger adalah Arial, Courier New, Georgia, Lucida Grande. Times New Roman, Trebuchet MS, dan Verdana.

dd another line of code - font-style: italic; - before the sign }

5. Kita akan membuat judul Poll kita tebel dengan menambah font-weight. Jika kamu ingin menjadi italic (cetak miring), kamu bisa menambah kode lain: font-stryle: italic; sebelum tanda }

Menambahkan gambar latar-belakang.

Selain membuat warna background, kita juga bisa menggunakan sebuah gambar menjadi latar belakang widget polling kita. Pertama buat gambar dan upload ke Google Pages (sebagai contoh doank). dan catatlah alamat URL dari gambar yang telah kamu upload. Habis gitu masuk ke Blogger Dashboard, Template, Edit HTML. dan tambahkan kode ini tepat seteleh pembukaan Poll1 dalam /*Sidebar Content*/ :

background:url(IMAGE URL);” (tanpa tanda petik), sehingga akan menjadi seperti ini :

/* Sidebar Content */

#Poll1{

background:url(IMAGE URL);

background:#FFFF00;

border:3px solid #736AFF;

width:150px;

padding:0 10px;

}

#Poll1 h2{

text-align:center;

font-size:140%;

color:#F87431;

font-family:arial;

font-weight:bold;

}

ganti Image URL dengan alamat gambar URL yang telah kita catat sebelumnya.

:) gimana mudah nggak? sulit?

this article is about Blogger Hack, Customization

Random Posts

Enter Google AdSense Code Here

Comments

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!