Jul 12, 2017

How To Remove Border Around Images In Blogger Posts


Have you ever wondered why every image in your blogger posts is surrounded with shadows and borders? Here is the reason. By default, blogger shows border and shadow around images or photos in blog posts. If you you find this annoying and wants to get rid of them, just follow my guide below to get it done.



see the difference in the screenshot below:




FollowThe Steps Below

Method One:
==> Go to your blogger Dashboard
==>Theme > Customize > Advanced > Add CSS
==> Copy and paste the code below inside
==> Click Apply to Blog.

.post-body img, .post-body .tr-caption-container, .Profile img, .Image img,
.BlogList .item-thumbnail img {
  padding: 0 !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;
}
remove shadows and borders around images in blogger posts

After applying the above code, your blogger images will no longer appear with border and shadows around them.

Note:  If the above method doesn't work for you, follow method Two below:



Method Two:
==> Go to Blogger's Dashboard > Theme > Edit HTML
==> Backup your template so you can reverse back if you make any mistake
==> Click anywhere on the code area and search for the code below by pressing CTRL + F
  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);
Note: if you can't find the entire code, then try to find this line and the rest of it should appear:
-moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, .1);
Then, carefully delete the entire code and Save your template.
Cheers!





Follow:


Click these buttons to follow LawrenceIfeanyi:

No comments:

Feel free to share your comment(s) via comment box below.

Sign in to comment "anonymously" without entering verification text.

Want to be notified when I reply your comment? Tick the "Notify Me" box.

We will try to response your comment(s) as soon as possible.

If your comment is unrelated to this post, please drop it through the Contact Us page HERE .

Please DON'T spam.


THANK YOU FOR STOPING BY.



Post a Comment

Designed by: Nwaonuma Ifeanyi.
Phone No.: (+2348037343364)