How to add background color of specific widget or gadget in Blogger

How to add background color of specific widget or gadget in Blogger

0
data:blog.title
background color

We can easily make our template little bit different by using  simple trick. Generally a blog combination of several widget or gadget on sidebar and footer section, so we can make it different by adding some colors. By this trick you can easily add different background color in different widget or gadget.  But first you have to find out the widget ID first to change specific widget background color. In this tutorial I will show you how to change the Label widget background color and you would be able to change others widget background color easily. 

HOW TO FIND THE WIDGET ID

Finding your each and every widget ID is very simple. Just log into your Blogger account and visit your blog. Now you can see the QuickEdit icon on bottom left corner of the every widget.

 www.bloggerspice

Now Click On Right Button of Label widget and Click on Copy Link Location and Paste is in Notepad

bloggerspice.com


The code will be like below--

http://www.blogger.com/rearrange?blogID=6138654713154058787&widgetType=Label&widgetId=Label1&action=editWidget&sectionId=sidebar

Here the widget ID is Label1 You will find for other widget different ID (e.g. HTML 2, HTML 3, HTML 4)


Step 1 Go to your Blogger Dashboard

Step 2 Now click on Edit HTML-> Unfold code  

Step 3 Now Find this code ]]></b:skin>  by pressing  Ctrl + F

Step 4 Paste the below code  Before/above ]]></b:skin> 

#Label1{
background: #04BDFA;
}

Step 5 Now hit the save Button

Customization 


  • Change #04BDFA with different color code. You will get the color code from Here
How to add background color of specific widget or gadget in Blogger
4 Stars stars - "How to add background color of specific widget or gadget in Blogger" We can easily make our template little bit different by using  simple trick. Generally a blog ...

Post a Comment

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form

Name

Email *

Message *