How add Drop Caps to already published posts in blogger
If you want to decorate your already published posts in a blogger blog by adding drop caps, you can easily do it by just editing your already published blog posts. In a new blogger blog post you can easily insert the Drop Caps code at the time of uploading it but if you want to insert a Drop Caps code to a blog post which is already published, you have to edit it, though the code is same. Here is the detailed procedure and the CSS code –
Drop Caps in Old Posts
How to activate dark theme in whatsapp व्हाट्सएप में डार्क मॉड कैसे एक्टिवेट करें
1. Login to your blogger Dash board.
2. Go to the list of your blog posts.
3. Go to the post you want to edit the drop caps CSS code.
4. Hover under the post title and click edit. The post will open in ‘Compose’ mode of the blogger post editor.
5. Now click the ‘HTML’ button in the blogger post editor, to open the post in the HTML mode of the blogger post editor.
6. Now add the following CSS code before the first letter of first paragraph of the post.
Digital Eye Strain or Computer Eye Syndrome Computervision Syndrome -Causes-Symptoms-Remedies
<span style="float: left; font-size: 65px; font-weight: bold; line-height: 45px; margin: 0px 6px 0px 0px; padding: 0px; position: relative;">
Then add the closing </span> tag after the first letter of the first paragraph of the blog post.
Note – If you are writing in Arabic, Urdu or any other language which goes right to left, Replace left by ‘right’, change 65px to increase or decrease the size of the first letter.
How to know complete hardware software history of an unknowncomputer
Now see the preview. If it is OK update your post.
Let us see an example
If the following the first paragraph of my blogger blog post and I wand to add the drop caps code to it-
There are a number of, say thousands of other stations located at a distance of 2-3 K.M. in the railways whereas Qayamsar railway station is situated at a distance of more than 12km from Fatehpur-Shekhawati
I will add the code as shown below -
<span style="float: left; font-size: 40px; font-weight: bold; line-height: 45px; margin: 0px 6px 0px 0px; padding: 0px; position: relative;">T</span> There are a number of, say thousands of other stations located at a distance of 2-3 K.M. in the railways whereas Qayamsar railway station is situated at a distance of more than 12km from Fatehpur-Shekhawati
After adding the drop caps code, If I see preview it should
appear like this.
8 Top free Email Service providers sorted on merits
On viewing the preview, If every thing is OK please update the post.
How do I add a drop cap on Blogger, Create Drop Caps to Blogger Posts easily, How do you insert a drop cap in Publisher, How do I add a drop cap to a WordPress page, How do I use Dropcaps, what is drop cap in ms word, Create Drop Caps For Blogger Posts And Comments, How add Drop Caps to already published posts in blogger.
That’s all, you are done.