Beautify Your Blog || Deleting the Photo Shadow
The default for most layouts puts a pesky little shadow border around every photo. Today I am going to give you a few simple steps to get rid of that irritating border.
1. In the left sidebar of your blogger dashboard click “Template”.
2. Under the Live on Blog thumbnail click “Edit HTML”.
3. Use Ctrl F to open finder and type in the following: .post-body img
4. That search will pull up the following code
.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);
}
-moz-box-shadow: 0px0px0pxtransparent!important;
-webkit-box-shadow: 0px0px0pxtransparent!important;
box-shadow: 0px0px0pxtransparent!important;
}
6. Click “Preview Template”.
7. If it looks good click “Save Template”.
I found out how to get rid of the "Powered by blogger" on the bottom, but I would like to know how to keep a copyright on the bottom.
Our Fairy Tale
what about adding that follow via bloglovin banner at the top of the screen?
Oh I love this series! I am still trying to figure out how to make the spacing smaller inbetween my photos (like how natthefatrat has) so if you ever figure it out let me know!
So…what if I don't have the "Add Custom CSS" box to add the new CSS??
🙁 I couldn't get it to work, but I was really proud of myself for being able to find the code by myself because my Command F was being funny
whoo hoo! got this figured out!
Sooo… Do I delete the code from the HTML and then open the template designer and add the code there?
THANK YOU SO MUCH!!