Add a Background Image to Gadgets in Blogger

How to Add a Background Image to Gadgets/Widgets in Blogger:

We can add background images to Blogger gadgets/widgets. We can add unique images to different gadgets in Blogger. With the help of a small CSS code, you can add a background image.

Follow below steps to add a  background image to widgets/gadgets in Blogger

Step 1 : Go to Blogger Dashboard

Step 2 : Click on Template

Step 3 : Click on the Customize button. Under Customize, click on Advanced.

Step 4 : Click on "Add CSS" under "Advanced" options.

Add below CSS code to your blogger blog

#widget id1{
background: url(IMAGE URL) no-repeat;
}

Replace 'widget id1' in the above code with the ID of the widget to which you want to apply a background image. You can find the widget ID in the HTML code of your blog's layout.

To add a unique Background Images to Gadgets in Blogger


#widget id1{
background: URL(IMAGE URL) no-repeat;
}
#widget id2{
background:url(IMAGE URL) no-repeat;
}
#widget id3{
background: url(IMAGE URL) no-repeat;
}

Step 5 : Click on Apply to blog

That's it! You can easily add a specific background image to a specific widget on your Blogger blog using this method.

No comments:

Post a Comment