Home About Meet Contact

Friday, April 12, 2013

How To: Remove the Blogger Picture Shadow

I don't know about you, but one of the first things that needed to go when I first started my blog, was the weird little shadow that formed behind every picture!

I mean, don't get me wrong- I LOVE BLOGGER and will forever hold them close to my heart. For the most part they are easy to use and just plain awesome! But that one little tick- that darn shadow...just BUGGED ME!

If you just cannot climb in the same boat as me- no problem! No harm and no foul. Totally get it. But if you are sitting at your desk, hanging by the edge of your seat, going, "YES YES YES!" then this blog is for you. How to remove that silly little shadow around all of your images.


So as you can see, our blog images (and some images elsewhere) did indeed have that little bugger. I mean, I guess it's not the stupidest thing...but it sure bugged me! You Sir, gots to go!

This trick is like, SUPER DUPER simple. I promise. But I do need to say- this trick is (of course) only for Blogger users AND those that are using the SIMPLE VIEW template. So, if you're using DYNAMIC VIEW, this won't work. Also, my step-by-step will be using the new blogger interface. By "new" I mean the one you probably already have- because it was available back in like...2011 or something. 

Ok! Moving on!


1. Make sure you are signed into your blog. You can tell if you are by looking at the top right corner. On your blog's homepage, click on DESIGN.


2. Next, you're going to click on TEMPLATE on the left hand side.

3. Once that has been clicked, find the CUSTOMIZE box and go ahead and click it.


Notice, here is a great way to tell if you're using the SIMPLE template or another one. As you can tell, we are indeed using it!

4. Since we're good to go, on the left hand side, find ADVANCED and click.


5. A little scroll box will show up directly to the right. Scroll down until you find ADD CSS and go ahead and click that.


6. Next, a white box will appear. In that box copy and paste this code EXACTLY:

.post-body img, .post-body .tr-caption-container, .ss, .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;
}

Easy right? Once your code is pasted, make sure to hit ENTER after the last character, "}".


7. Once the code is pasted and you've hit enter after the last character, go ahead and click APPLY TO BLOG. If you're nervous it didn't work- you will immediately notice the shadow has been removed on the preview that shows below what you're doing :)


Violà! You've now removed those pesky shadows from any and all images on your blog!

If you decide you hate it and want those shadow frames back, just follow the steps again- except delete all the text in that white box, then click APPLY TO BLOG. 

Hope that helps, guys!!!

Pin It

88 comments:

  1. THANK YOU! I've been wanting to get rid of the picture shadow forever! :)

    LB

    ReplyDelete
  2. Ahhh! Thank you!!! I thought that little shadow was just something I was going to have to live with!!!!! And such an easy tutorial!!!! Thank you, again!

    ReplyDelete
  3. LOVED this tutorial - you are AWESOME!! :) Thanks for sharing - you are so good at this stuff!

    ReplyDelete
  4. Thanks for sharing this tip!

    ReplyDelete
  5. Thanks so much! I have been hating those pesky shadows and wasn't sure how much I wanted to mess with it to fix it.... but thanks to you it was so easy! whoop whoop

    ReplyDelete
  6. Thank you, I have been trying to do this for a long time, too

    ReplyDelete
  7. Thank you so much for this tutorial! I'm really anal about things like that stupid shadow! I feel like it really throws off the clean lines and ambiance I strive for on my blog design!

    thethreepeasinapodblog.blogspot.com

    ReplyDelete
  8. excellent tip, beautifully explained TY!

    ReplyDelete
  9. So glad you guys benefited! YAY!

    ReplyDelete
  10. Thank you so much, from Denmark!! :D
    Have looked at many Danish guides, but none have works - so thank you! :D

    www.daniellahorsmark.dk

    ReplyDelete
  11. Thank you! Thank you! I tried three other tutorials before this one, and this one did the trick!

    ReplyDelete
  12. thank you SO much! This really helped and my blog is now shadow free ^__^

    ReplyDelete
  13. THANK YOU!!!! (and yes i meant to use all caps) This has been on my last nerve all day. I can carry on now with more important matters.

    ReplyDelete
  14. I can't get it to work :( I made sure to do everything correctly, didn't touch the HTML, and hit enter after the last character! Any tips?

    ReplyDelete
  15. Thanks the help, and for explaining the steps so clearly! I got tired of the shadows and and glad to have them gone.

    ReplyDelete
  16. Didn't work. I've tried every code I can find on the web and nothing works :(. Could you help?

    ReplyDelete
  17. I'm pretty sure I love you a little bit right now. Seriously. I've been dreading changing codes and crap. This was SO EASY! <3

    ReplyDelete

  18. this was a piece of cake!!
    Thank you very much <3

    ReplyDelete
  19. This was such a wonderful help: thanks a bunch! Your tutorial was one of the most user-friendly ones I've used in a long time. :)

    ReplyDelete
  20. THANK YOU!! Glad I found this tutorial :)

    ReplyDelete
  21. Paper suppliers-Papico is one of the leading agents of paper manufacturing companies in UK and a trusted vendor for major paper mills Europe. Papico deals in various paper types like: coloured copier paper, A4 copier paper, envelop and graphic papers, recycle and poster papers.

    ReplyDelete
  22. Obviously, excellent. Thank you.

    ReplyDelete
  23. Thank you for sharing this! I finally found something that works!

    charlottechristmas.blogspot.co.uk

    Charlotte xo

    ReplyDelete
  24. I LOVE YOU! THANK YOU SO MUCHHHHHH!

    ReplyDelete
  25. waaaa thanks a lot! been looking for this!

    ReplyDelete
  26. Hi Christina,

    This was very helpful. Thank you! :)

    - Erin
    www.erinbettis.com

    ReplyDelete
  27. YOU ARE MY FAVORITE PERSON!! I have been searching for how to do this for SOOOO long and finally found your tutorial and the boxes are gone forever!!! You are my hero :)

    ReplyDelete
  28. Yay, it worked!! Thank you!! :) xoxo!!

    ReplyDelete
  29. This comment has been removed by the author.

    ReplyDelete
  30. Goa holiday packages from Delhi - Tour package in India leading travel agency offers goa tour packages, goa tour packages from delhi, goa holiday packages from delhi, cheap goa tour packages from delhi, cheap goa trip package from delhi.

    ReplyDelete
  31. Thank you! This is a great tip that I just implemented on my blog! sewingmamaraeanna.blogspot.com

    ReplyDelete
  32. just a big huge t h a n k y o u ! I've been through dozens of blogs explaining how to remove that ugly frame but none was that clear. You have a new follower :-)

    ReplyDelete
  33. Tempo Traveller Hire For Shimla - Tour package in India leading travel agency offers shimla tour packages,Shimla Tour Packages India, shimla tour packages from delhi,shimla package trip from delhi.

    ReplyDelete
  34. Agra Jaipur Tour - japji Travel India Offers 4 Days Golden Triangle Delhi Agra Jaipur Tour Package, car hire from delhi to agra, luxury agra jaipur tour packages, budget hotels in jaipur, delhi agra jaipur tour package cost, agra jaipur tour by car, jaipur agra travel.

    ReplyDelete

  35. Find Best deals on Hotel Booking, Resorts, Holiday Packages, Honeymoon Packages, Cheap Hotels, Budget Hotel Booking at Jouneytrip.com"
    india tour package
    vacation packages in india

    ReplyDelete
  36. Thank you so much! It worked perfectly! I've been trying to figure out how to remove that forever. xo

    ReplyDelete
  37. OMG thank you so much! It has been bothering me forever! You are a lifesaver :)

    ReplyDelete
  38. Thanks so much :) my blog is finally starting to look a bit more polished!

    ReplyDelete
  39. I read your interesting blog. If anyone wants to adventure honeymoon package in unbeatable price with best service.

    ReplyDelete
  40. you've been very helpful! thank you so much!

    ReplyDelete
  41. nice
    http://www.manithar.com/

    ReplyDelete
  42. A MILLION TIMES THANK YOU FOR THIS! I've been googling this for.... nearly 2 years hahaha and nothing I've found has worked until your post. <3

    ReplyDelete
  43. Thanks, this helped me a whole lot.

    ReplyDelete
  44. Ugh! Thankyou! Just makes your blog look like its constantly in edit mode, thank you!
    Xxx

    ReplyDelete
  45. Thank you so much! Been trying for ages! Your instructions were so easy to use!

    ReplyDelete
  46. Worked! You are a star(fish)! :)

    ReplyDelete
  47. thank you so much! your code worked perfectly!
    http://fullycurious.blogspot.com/

    ReplyDelete
  48. Thanks for supplying the code. Appreciate you making it so easy for the rest of us! So relieved to find a fix for those shadows!

    ReplyDelete
  49. Thank you for such a useful guide! Has made me feel so much better about my blog! :) x

    Amy Caitlin | cloudcaitlin24.blogspot.com

    ReplyDelete
  50. Thanks A MILLION for this. So clearly explained and easy to follow :-)

    ReplyDelete
  51. YES!
    Now my signatures look like signatures instead of shadow-boxed pictures!

    ReplyDelete
  52. Thanks A MILLION for this
    http://the10essentialsofforextrading.blogspot.com/

    ReplyDelete
  53. Your blog is quite interesting i found it very informatic Commercial Real Estate Reviewthanx for posting
    onlice clipping path

    ReplyDelete
  54. Thanks for posting this! I'm so happy that the shadow is now removed...yay!

    ReplyDelete
  55. Just want to than you for your tremendous effort.
    Your tutorial is so detailed.
    clipping path service

    ReplyDelete
  56. i was searching such detailed tutorial on shadow masking for many days and here you are..
    Thanks christina..
    clipping path

    ReplyDelete
  57. thank you so much but not working on all images...any suggestions?
    Xo
    Jen
    http://effortlesseverydaystyle.blogspot.com/

    ReplyDelete
  58. Just found this and you've made my day! Thanks. I found similar instructions elsewhere but couldn't follow them. You've typed it so simply that I figured out in seconds. :-D

    ReplyDelete
  59. THANK YOU!!!! so much... I've wanted rid of those horrid frames for as long as I've been blogging. This was so simple (it would need to be simple in my case o_O) - I'm always a bag of nerves when messing with HTML, and had never even heard of CSS until reading your post, but this was so straight forward. *Am smiling* :D

    ReplyDelete
  60. I’m really amazed with your posting skills as well as with the layout on your blog site. Is this a paid style or did you modify it yourself? Either way keep up the pleasant quality writing, it is rare to see a great site such as this one these days.I recently came to know about http://www.dadabhaitravel.ae/, their Holiday Packagaes are very effective and affordable.
    Holiday Packagaes

    ReplyDelete
  61. I have a graphic design related business. Picture shadow we are always create. The tutorial help our professional work. Thanks for sharing.

    clipping path service
    clipping path
    color correctoin service

    ReplyDelete
  62. Thanks for sharing such a great article and it's helpful for everyone. Great Post! Budget Hotels In Agra

    ReplyDelete
  63. I believe this is one of the so much significant info for me. And I’m glad studying your article. But wanna observation on some common issues, The website taste is great, the articles are actually nice : D.
    Good activity, cheers
    Jaipur to Triveni Dham Taxi

    ReplyDelete
  64. Hello my family member! I want to say that this article is amazing, great written and come with approximately all vital infos.

    I’d like to look extra posts like this.

    Kota to Jaipur taxi

    ReplyDelete
  65. Awesome Blog...Nice Posts...Thanks For Sharing...!!!clear vision 5

    ReplyDelete
  66. I feel great after reading your article. You will find a lot of related content on Google But make sure that good content is hard to find. Your blog is good. I found a good packaging blog about packaging Which provides you with good packaging for your business. This company makes great bcusto cereal box, Burger Boxes
    customized snack box and other packaging. If you want new packing for Cerea you can visit this and get the best packaging....
    carpets in sunderland

    ReplyDelete
  67. Much obliged to you such a huge amount for this instructional exercise! I'm truly butt-centric about things like that idiotic shadow! I have an inclination that it truly loses the perfect lines and mood I take a stab at on my blog plan!...
    angrygran

    ReplyDelete
  68. Desert Safari Dubai Tours 2021 - Get 30% Off Now! Our Desert Safari Dubai Tour Package includes Camel Safari, Arabian Falcon, Sandboarding, Quad Biking, ...سفاري دبي.الشروط والأحكام. التذكرة الواحدة صالحة لشخص واحد فقط; عملية الدفع التي تمت بنجاح سيتم تاكديها من خلال تلقيك رسالة عن طريق
    سفاري دبي

    ReplyDelete
  69. Thank you so much for sharing this tutorial with us! I'm a total wuss when it comes to stuff like that dumb shadow! It really messes up the clean lines and ambiance I try to achieve with my blog design!,,
    vaporvm.com

    ReplyDelete