Want to show yours blog post Look like Magazine , Or want to Show yours blog post first Letter In different font and style, or want to show yours blogs in Dropcaps like in a fancy magazine as what you see, in this post and in below image . I saw instructions for this trick at Mandarin Design and I wanted to share this beauty with you all.This is a amazing trick and leave a very nice impression on readers towards yours blogs. 
-tags, with a class named “dropcaps”. In your CSS-definitions, you can set this first letter to Very Big, and in a different color. Most Important things of this is that this hack can be used by any blogger , Does’nt matter whether he/she is from blogspot or wordpress or anyother service provider.
To Use this Hack in yours post just copy the below code and paste in your Css Style sheet any where, If you are confused about the Css location you can read basic of blogger Hacks
.dropcaps {
float:left;
color: $headerBgColor;
font-size:100px;
line-height:80px;
padding-top:1px;
padding-right:5px;
}
After doing all the above steps one thing you have to do is to put below code in every Post in which you want yours first letter to appear big .
<span style="color: #ff0000"><span class="dropcaps">Post First Letter Goes Here</span></span>
The result is very Interesting a large capital that stretches over 5 lines.Hope you Enjoy !! This Trick and leave yours response about this Posts.
Try Some More Useful Links From Below !!
- Magazine Style Drop Caps (Beautiful Beta)
- Easy CSS Drop Caps (Mandarin Design)
- Magazine Style First Letter with CSS (DesignGala)
Styling Blockquotes in your Blog posts Try Link from Below for different style Blockquotes:
- Blockquotes with image quotes
- Simple Double Quotes
- Simple CSS Pullquotes
- Snazzy Pullquotes for your Blog
- Automatic Pullquotes with JavaScript and CSS
- Blogger Archive Hacks -Show Blog Post Headers In Archive
- Change Edit Font Sizes on Blogger (Blogspot) Blog
- Add Insert Digg Buttom In Blogger (Blogspot ) Blog Post
- Hide Remove Blog Title And Description From Blogspot Header
- Expand Post With Read More Or Continue Reading In Blogger (Blogspot)
7 Responses to “Show Blog Post First Letter In Different Size and Font”
Please Wait
Leave a Reply
Thx For This Great Tutorial on Creating Blogger Post In Different Style Using Different Fonts In Blogger and Wordpress Thax Again i will use this Trick on My Post.
Digital Tips
Hi there. I don’t know what’s wrong with the html code in my template, but I cannot get the drop cap to work no matter what I do. I’ve tried it before , I’ve tried it before and I dont’ even HAVE a !!!!!!!!! Help me, please! You can email me directly from my blog. Thank you!!!!!!!
Justine :o )
Hmm I Hv Visited Yours Website Its Great To See Yrs Blog ,If You want me to insert this Trick into yrs blogger blog then i will do that also. But before tht i recommed to try it once more .Remember you have to inser code in yrs Template First and Then Use Second Code In Every Post.
Well, I figured out a way to make it work for me. Since I couldn’t get it to work in the template, I just went under settings and put the code for the drop cap into a post thingy that makes it pop up every time I start a new post. So, all I have to do then is pop my first letter in between the tags.
Justine :o )
heeey how did u delete the “grab widget link” from wowzio widget
i end up by having a notice when i tried to remove the “grab widget” link..
how can i remove the notice
the code above is incorrect, no? It has too closing tags for span.
I meant two (not too) closing tags for span.