31 Dec 2011

Home » » Remove Drop Shadows from Images on Blogger

Remove Drop Shadows from Images on Blogger

10:59    5 comments

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.











before










after




So here goes!

Log in to Blogger and navigate to Template > Customise > Advanced > Add CSS

Then copy the following code and paste into the 'add CSS' box.


.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,.BlogList .item-thumbnail img { padding: none !important; border: none !important; background: none !important; -moz-box-shadow: 0px 0px 0px transparent !important; -webkit-box-shadow: 0px 0px 0px transparent !important; box-shadow: 0px 0px 0px transparent !important;}

Click on 'Apply to Blog'.

There you have it. The drop shadows have disappeared. Easy peasy isn't it?

5 comments:

  1. Leanne2 January 2012 at 02:59

    Thanks for the tip! I've added it to mine and it looks a lot cleaner! Loving this blog! x

    ReplyDelete
  2. Katy Scarlett2 January 2012 at 11:30

    Just done this little tip. My blog will get better! One Faye tip at a time! haha xx

    ReplyDelete
  3. admin2 January 2012 at 12:01

    Awww thankyou :)

    ReplyDelete
  4. admin2 January 2012 at 12:04

    Lol! I plan to do lots more tutorials.

    ReplyDelete
  5. Chloe12 March 2012 at 08:21

    Hi, I just tried to follow this tutorial to remove the drop shadows. I copied and pasted the above code into the Add CSS box as instructed and applied to my blog, but the drop shadow is still appearing. Just wondering if there's anything else I needed to do?

    ReplyDelete