A drop cap is nice but….

Recently, I got an email asking how to make a drop cap in ebooks.

At first, I poo poo’d the idea but then I thought, it’s not up to me to say what goes in your ebook.

Do I recommend a drop cap? Not really because you never know what size font your reader has set on their eReader but if you like this effect, you should know how to do this so I’ve supplied the code below:

You can put this CSS in the <head><style> section of your html code.

The code is a class and looks like this:

.dropcap {float: left;
margin-right: 5px;
color: purple;
font-family: ‘Arial’, Georgia, sans-serif;
font-size: 48px;
font-weight: bold;
margin-top: -5px;}

Now that your eyes are rolling back in your head or huge in panic, let’s explain what I just wrote. The dot or period means the above is a class and when you put a <span class=”dropcap”> in front of the letter you want it to drop and then after the letter put the ending code of </span>, it should look like the following when you write it in the <body> section of your ebook’s html file:

<p><span class=”dropcap”>Y</span>ou need a drop cap as the first letter of the first paragraph of each of your chapters. If you want to stand out and say hey, I can format and you can’t. Neener. Neener.

And then you get this in your ebook:

You need a drop cap as the first letter of the first paragraph of each of your chapters. If you want to stand out and say hey, I can format and you can’t. Neener. Neener.

Pretty snazzy huh?

So what does the code look like when putting it in ebook’s HTML:

<html>
<head>
<title>Your eBook Name</title>
<style>
.dropcap {float: left;
margin-right: 5px;
color: purple;
font-family: Arial, Georgia, sans-serif;
font-size: 48px;
font-weight: bold;
margin-top: -5px;}
</style>
</head>
<body>
<a name=”chap01″><center><h3>Chapter 1</h3></center></a>>br /><br />
<p><span class=”dropcap”>Y</span>ou need a drop cap as the first letter of the first paragraph of each of your chapters. If you want to stand out and say hey, I can format and you can’t. Neener. Neener.</p>
<p>you then continue on with your paragraphs putting in as many as you need with beginning and ending paragraph codes.</p>
</body>
</html>

EZy Peezy right? Well it is if you copy the drop cap code from above (between the horizontal lines) and paste the code into your text editor and then save it as .html

graphic of Judith Tramayne's signature in her article 'Ez-ily make a drop cap in your ebook'

P.S. Coding for ebooks is really EZ with my EPUB and Kindle EBook Course.

P.P.S. The drop cap isn’t necessary in most ebooks and should only be used if your ebook warrants the extra coding.