First alphabet of post large and coloredThis was how Good Health Magazine was made to have the first alphabet colored and colored. After signing into Blogger Dashboard, click on SETTINGS tab followed by FORMATTING sub-tab. Right at the bottom of the page is the post template. Whatever you put into the post template will appear in every new post you create. You must first decide on the font size of the first alphabet as well as the color. For the color, you can use this site to help you decide on the color code to use in the script you must put into the post template:
A better alternative is to use an existing color from your site, for example, the post title font color. A great tool you can use is ColorPic which you can download from
I used it a lot. To use ColorPic, you must have the page from which you want to determine the hexadecimal color code opened together with ColorPic. Hover the mouse cursor over the area which you want to know the hexadecimal code. Nowever, if you intend to use the color of the post title for the color of the first alphabet, a problem will be when you hover the mouse cursor over the post title which for most Blogger template, is a clickable link, the post title changes color. To overcome this, use a very good free photo editor Irfanview (click BACK button to get back to this page). At your blog or website, press PRINTSCREEN key, open Irfanview and click EDIT > PASTE from the menu bar. The image of the page will be pasted into the Irfanview window. This time, when you hover your mouse cursor over the post title, it will no longer change color because it is only an image. Open ColorPic and hover your mouse cursor over the post title and the hexadecimal color code of the font of the post title will be displayed in ColorPic. Note it down. In the case of Good Health Magazine, the blog uses Hackosphere modified 3 column template and using the technique described, it was found that the hexadecimal color code of the post title was #CC6600, so this was the color code used for the script in scroll box below (colored red). You will also have to specify the font size (colored orange) and the font family, a list of browser safe font family you can use can be obtained from
for Windows and MAC. The font family I used is colored green in the script in the scroll box below:
Once you have decided on your font color, size and family, change the relevant part of the script in the scroll box above, sign into Blogger to get into the Dashboard, click SETTINGS for the blog you want to install this in, followed by FORMATTING sub-tab, and right at the bottom of the page, you will see a large box for the post template. Paste the script into the post template window and save. Once you have done that, each time you create a new post, you will see the script in the post editor window. Type your post above the script, and when you are finished, highlight the script
press ctrl+C or right-click and select "copy" to copy into the clipboard. Scroll to the top of your post, and paste this just before the first alphabet you want to be large and colored. Immediately after this first alphabet, either copy </span> from the script at the bottom of the post and paste it immediately after the first alphabet, or, this is what I myself preferred as it is easy to do, type </span> myself immediatlely after the first alphabet.
Now scroll to the bottom of the post, and highlight all the text plus spaces between the last alphabet and </p>, click the DELETE key to delete everything except </p> at the end of the post, and publish.
To illustrate, I will show the first part of the post in What is Advanced Healt Care Directive and why we need it and also the last part:
First alphabet of post font large, colored and with background colorThe method used for Podcasting Magazine is about the same as the above, except you add one more attribute
background-color:#D4FFFF; to the script: