Home
Blogger
Code

How to Add a Paragraph with Fancy Drop Cap in Blogger?

Admin

In this tutorial, I will show you how to add a paragraph with a fancy drop cap in Blogger. It looks very attractive when used at the beginning of a post.

Table of Contents

Hello Everyone! Welcome back to Dev Orbital. Today we are going to learn how to add a Fancy Drop Cap in Blogger. A drop cap is a large capital letter used as a decorative element at the beginning of a paragraph or section. The size usually spans two or more lines and looks very attractive when used at the first paragraph.

What is a Drop Cap?

A drop cap is where the first character of the first paragraph is larger than the other text, taking up two or three lines. Drop caps are used in books, newspaper articles, documents, and webpages to grab attention and signify the start of a significant section.

What is a Fancy Drop Cap?

Many Blogger templates have the drop cap feature, but they look standard. A fancy drop cap uses cool fonts and colors to make your content stand out. You can use it in any Blogger template by adding the following CSS and HTML.

Pros of Using Fancy Drop Cap

  • Grab the reader's attention
  • Modern and cool font styles
  • Gives a dynamic look to your site
  • Looks attractive at the start of a paragraph
  • Suitable for all types of content
Related Posts

How to Add Fancy Drop Cap in Blogger

  1. Login to your Blogger Dashboard.
  2. Go to the Themes section.
  3. Click the drop-down arrow and select Edit HTML.
  4. Search for ]]> and paste the following CSS just above it:
    5. @import url('https://fonts.googleapis.com/css2?family=Alex+Brush&display=swap');

.dropCap {
  color: #2274fb;
  font-family: 'Alex Brush', cursive;
  font-size: 100px;
  float: left;
  padding-top: 0.35em;
  padding-right: 0.25em;
}
  5. Create a new post or edit an existing post to add this fancy drop cap.
  6. Use the following HTML to start your paragraph with a drop cap:

<p><span class="dropCap">H</span>ello Guys! This is how the Drop Cap looks.</p>

Example:

Hello Guys! This is how the Drop Cap looks.

Conclusion

This tutorial showed how to add a paragraph with a fancy drop cap in Blogger. It makes your posts look more attractive and engaging. Share it with friends and follow our blog for more tutorials.

Post a Comment