Pages

Friday, April 20, 2012

Widget ID

Have you ever wonder how to customize each widget on your blog? Let's said you have teen widgets and you want every one of them has a unique appearance. But, unfortunately, you have no idea to do it.
Ok, let's try customize it together. But, first we have to know which widget we want to customize. In this example, I'll take widget called 'Label'.

Then I go to (after login to Blogger, off course) EditHTML and find widget called 'Label'.
Here, what I've got:

Now I know the 'id' of my widget, the id is 'Label1'. Then, I make some CSS for it:
#Label1{
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;
}

I put my CSS on to template just above ]]></b:skin>. After I save it then I view my blog to find if it working or not.

Now, why don't you give it a try?

No comments:

Post a Comment