Home » » Cara Membedakan Warna Setiap Widget

Cara Membedakan Warna Setiap Widget

Written By Unknown on Sabtu, 03 November 2012 | 00.11

Selamat siang sahabat blogger kali ini saya akan memposting sebuah tutorial yang berjudul Cara Membedakan Warna Setiap Widget yang pada kesempatan sebelumnya saya juga sudah membahas tentang widget yang agak berbeda dengan judul Mengatur Letak Widget Pada Halaman Tertentu. Oke seperti biasa tidak usah banyak basa basi mari kita kembali ketopik, Berikut beberapa langkahnya :

[1] Pastikana sobat sudah masuk blogger anda
[2] Lalu pilih Tata Letak > Lakukan pengeditan pada salah satu widget yang ingin diubah dengan mengklik tulisan Edit, Misalnya

[3] Lalu hasilnya akan menampilkan sebuah halaman seperti gambar dibawah ini & lihat ID dari widget yang digunakan




Seperti yang terlihat pada gambar diatas, Widget Label yang saya gunakan memiliki ID Label1. ID ini akan kita gunakan untuk melakukan editing CSS pada template blog.
[4] Langkah berikutnya adalah masuk ke menu Design > Edit HTML. Backup template anda terlebih dahulu. Karena dalam pengeditan membutuhkan kejelian dalam membaca kode. Jika salah pengeditan bisa dikembalikan lagi.
[5] Cari kode berikut ]]></b:skin> Lalu copykan kode ini sebelum kode yang sudah kita cari
#Label1 h2 {
 background: url(http:/http://mari-merapat.blogspot.com/files/header%20widget%20purple.jpg);
border: 0px solid #ccc; padding: 0px;
font: 12px/1.4em Arial, sans-serif;width:100%;margin-bottom:10px;border-top:1px solid #ccc;border-left:0px solid #ccc;border-bottom:1px solid #ccc;border-right:0px solid #ccc;}

NB : #Label1 : diambil dari nama widget ID yang anda gunakan.
h2 : biasanya template menggunakan tag h2 untuk judul widget/gadget.

[6] Simpan template anda, dan lihat hasilnya. Jika belum muncul, berarti ada CSS lain yang mempengaruhi Style anda. Karena pembuat template memiliki cara penulisan berbeda untuk templatenya.
Share this article :

4 komentar:

 
Support : Blogger Template Free | Johny Template | Mas Template
Copyright © 2012. M-Merapat - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger