Customize Each Sidebar Header Differently

To costumize the header of every widget in your blog differently, follow these steps:
 
First of all , find out Unique ID Name of each Blogger Widget:

1. Log into your Blogger Account
2. And click the link that says  View your Blog
3. At your Blog below each widget you will find this Edit key image,
4. Hover your mouse cursor on it and right Click and choose Copy Link Location
5. The link will look something like this, 

http://www.blogger.com/rearrange blogID=#####&widgetType=HTML&widgetId=HTML4&action=editWidget

Copy your Widget ID and keep it save as it will be used in the next part. In my case you can easily see that the widget Id is HTML4
HTML/JavaScript widgets are usually assigned such ID’s as HTML1, HTML2, HTML3 and so on.
About me widget will have an ID like Profile1 and Link lists widgets have Ids as LinkList1, LinkList2 etc.
The ID’s are case sensitive so use them as they appear.

How to Customize a Widget using its Unique ID?

will now customize the Widget’s Heading Style i.e H2 tag. Customization of other portions of the Widget will be shared in future posts.

#ID h2{
background:#575656;
margin:10px 0 10px 0;
padding:8px 0 8px 10px;
font-size:12px;
font-family: Sans-serif, Arial, Helvetica;
font-weight:bold;
text-transform:uppercase;
color:#ffffff; text-shadow:0 1px 0 #fff;
}

Now replace ID with your unique widget ID. To change the background color change #575656 and to change the Font colour change #ffffff. May be you will like using your Colour Code Generator Tool 

6. Hit save and you are Done!
View your blog to see the new dress :)

That’s All!

Hope you find it useful and worth trying.

from: mybloggertricks

Posted in: Blogger tricks