Image Caption massively used in image based Blog. Generally We
see different Journal or Magazine a small piece of sentence written below Image
that explain the subject or theme of the Image. Similarly in Blogger Blog Post
we often add caption for better understanding the Image. Suppose a Blogger has
written a long paragraph and Image placed in wrong space in that case if s/he
added a Caption for Blog Image then readers can easily understand. So this is
very important to add caption in Image. Many Blogger add irrelevant image which
is pointless to use on Post. However if Blogger become used to insert caption
on image then s/he will easily understand
which image is relevant. Though Blogger has this fantastic feature but many
Blogger don't know how to add caption on Blog Image. In this tutorial I will
show you how we can add Image caption easily. Please follow the below steps
that might be helpful for adding image caption.
Step 1 Log in to your Blogger Account and Go to your Blogger Dashboard
Step 2 Click on Now click on -> New
post and Upload an
image.
Step 5 Now click on Add caption option and write the few words about the
Image. You can change Font Bold or After that finally Publish your post.
That's it. Now check your post and see your Blog post
containing Caption that explaining the image.
Adding Some Style in your Caption Image
By following the above steps you will able to include simple
Caption in Blog Post. But by adding CSS code we can make it more attractive.
However we can able to modify the Caption text, font color etc. So just add the
below code by following the tutorial.
Step 1 Log in to your Blogger Account and Go
to your Blogger Dashboard
Step 2 Click on Now click on -> Template -> Edit
HTML
Step 3 Now find
the </b:skin> by pressing Ctrl+F
Step 4 Copy the code from below and Paste the code
above/before </b:skin>
/*Custom Caption Widget by www.bloggerspice.com */
table.tr-caption-container {
padding:5px;
background: #ffffff;
color: #222222;
border: 1px solid #eeeeee;
-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);
}
table.tr-caption-container img {
padding: 0;
background: transparent;
border: none;
-moz-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
-webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .1);
box-shadow: 0 0 0 rgba(0, 0, 0, .1);
}
td.tr-caption {
font:100% 'Oswald',Sans-Serif;
font-style: bold;
text-transform: capitalize;
}
Step 5 Now simply hit the Save template Button.
Again check your Blog and see the caption image with new style. I hope by adding caption on image your Blog readers will feel comfortable to read the content. For better explaining the Image there hasn't any alternative to insert caption on image.
Again check your Blog and see the caption image with new style. I hope by adding caption on image your Blog readers will feel comfortable to read the content. For better explaining the Image there hasn't any alternative to insert caption on image.
How do you write long captions that stay the same size of the image? Thanks
For my Post's thumbnail I have designed a template by using PhotoShop software... after that just add different image and text is flexibly re-sizable. So Caption character number doesn't matter. Thank you.