Frames for Images in Blog Posts

Want your images in your blog posts to look more attractive and capturing than the regular plain display.
Then lets customize is at you want.

Now you might be wondering, do I have to work on Photoshop, or write Javascripts, or know lot of coding.

NO!! NO!! NO!!

Its a simple fix with CSS and CSS3 trick. Just a small fix, and you have a new good-looking blog/website for you.

How you do it?

Step 1: Login Blogger
Step 2: Go to Design -> Edit HTML -> and Download full template (as usual for precautionary measure)
Step 3: Search for
]]></b:skin>
Step 4: Now if you want photo frame type border around it then paste this code


.post img {
padding:3px;
border: 10px solid #AAAAAA !important;
}
.post a img {
padding:3px;
border: 10px solid #AAAAAA !important;
}


If you want shadow type border then paste this code


.post img {
padding:2px;
-webkit-box-shadow:#888888 0 30px 30px !important;
box-shadow:#888888 0 30px 30px !important;
background: none repeat scroll 0 0 #FFFFFF !important;
}
.post a img {
padding:2px;
-webkit-box-shadow:#888888 0 30px 30px !important;
box-shadow:#888888 0 30px 30px !important;
background: none repeat scroll 0 0 #FFFFFF !important;
}

Step 5: Save Template

And you have a good looking images, all over you blog now. Wasn't it simple now :)

Check out some other tricks by clicking on the labels below, and customize your blog as you want. :)