Big First Letter in Blogger Blog Posts

If you want to decorate your blog posts in Blogger.Com blogs, Well, you can do it in different ways. You can add images to every post, you can add beautiful block quotes or you can use interesting pull quotes! But, ever noticed the ‘Big first letters’ in some of the popular blogs? This simple style helps in drawing the attention of your blog readers. Now, I will tell you how to add this style in your every blogspot posts.

You need to add a simple code to your blog template. If you are using a custom template, make sure you have access to the css code. And always backup your original Blogger template, before making the changes.

Follow these steps to add a ‘Big First Letter in Your Blog Post’:

Log in to your Blogger.Com account.

Go to the ‘Template‘ tab of your blog and click ‘Edit HTML‘.

Backup your existing template by clicking ‘Download Full Template‘ link.

Look your template codes in the ‘Edit Template‘ section and find the following code:

.post img {
or
.post-body img {

In Firefox, you can find it easily by pressing Ctrl+F and putting the code in the ‘find box’.

This code may have two to three lines with padding, border etc. Look for the end of this code. It ends with a } symbol. And add the following code below that symbol:

.post t { float:left; color: $headerBgColor; font-size:100px; line-height:80px; padding-top:1px; padding-right:5px; }

or

.post-body t { float:left; color: $headerBgColor; font-size:100px; line-height:80px; padding-top:1px; padding-right:5px; }

You can change the values of color, font-size etc. to suit your blog. (example: color:#FF0099)

Now save your template by pressing the ‘Save Template‘ button.

It is almost done. From now on, you need to put the first letter of your blog post inside the <t></t> tags. Mind it, it should be done in ‘Edit Html’ view of your blog editor. It will show a big first letter in your blog post.

To make it easier, you can add <t></t> in your post template. Go to Blogger Settings> Formatting and insert <t></t> in the Post Template and save the settings.

That’s it! Go and create a new post in blogger. You will see <t></t> in the HTML view of the post editor. Simply place the first letter of your blog post within the <t></t> tags and continue writing as usual. Publish your post and you will see a beautiful ‘big first letter’ in your blog post.