How To Remove All Image Shadows In Blogger?

By default Blogger adds drop shadows to images. This can be very annoying especially if you have images in your sidebar that are part of the blog’s design. It applies the shadows to all images so today I’m going to show you how to remove them. It is very easy thanks in part to the Blogger template designer’s recent update.Some peoples do not want shadow around there all images in the blogger, so i am going to tell him that how to remove shadow from all images in his blog.

The screen shoot of demo is also giving in the post. If you have any other problem feel free to ask. After reading through my tips on cleaning up your blog, a few people asked for instructions on how to remove image shadows in Blogger. There are two ways to do this — one is by adding a bit of CSS and the other is by removing it. Some templates don’t come with this feature, so you gotta add it on your own if you want it. But some of you are using templates that do come with this feature.

I’m gonna show you how you can get rid of the shadows and borders in 1 easy step.Blogger templates such as Simple include a rather large box shadow and border around most images on the blog. I find this style suited best to photo blogging, but not so well fit to my topics and posting style. Many others I’ve encountered feel the same. Luckily, It’s a simple matter of altering a key CSS style to remove this feature from your images.

Features:

1.) Simple Steps To Do It.
2.) It Will Remove All Image Shadow Of Your Blog.
3.) It Will Also Light Up Your Template Size And Loading Time.

How To Remove In Blogspot?

1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To “Template“.
4.) Back Up Your Template.
5.) Now Click “Expand The Template”.
6.) Now Press CTRL+F And Search .post-body img,
Here The Code Will Be Like The Below One…

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img, .BlogList .item-thumbnail img {
padding: $(image.border.small.size);
background: $(image.background.color);
border: 1px solid $(image.border.color);
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
}

Now Delete These Last Three Line From The Code And Save It. You Will Get No Shadow Around Your All Images In The Blog.

-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);

Customization:

1.) You Can Also Change Or Remove Image Padding, Background Color, Border Color-Size-Style, Shadow Size And Spread And Can Also Add Extra CSS To It.
2.) Save And Done.