Old Novels into New—Part 4
November 21st, 2010So far I’ve talked about preparing your book cover, preparing your manuscript, and converting your Word doc into an epub file; and I’ve shown you a glimpse of the CSS code you get to work with this time, in Part 4 where we talk about editing your epub file.
At this time you should be at least a little bit familiar with HTML and CSS, through experience or through a tutorial.
Go into Sigil and open up the epub file created in Part 3. Look in the left hand column, find the style sheet (in the styles folder) and open that up.
Next, open up a chapter file. Chapter 1 is good to start. If you’re not already in code view, switch to code view by clicking the angle bracket icon at the top.
Now, open up the two files below. They will open in new tabs in Firefox, but probably in new windows in IE.
Look at the sample chapter code and compare it to yours. You’ll see some new style “classes.†Just for fun, go ahead and copy the code for the whole “chapterline_block” div into your own chapter file. Put it right under the body tag. Now switch to book view. You should see the word “chapter†in a big ugly font, and the number 8 in a small font.
Now look at the enhanced style sheet and compare it to yours. You’ll see lots of additional styles in the enhanced style sheet. Go ahead and copy the sections that define “div.chapterline_block,†“h1.chapterline,” and “p.chapternumber” into your stylesheet in Sigil. Paste them at the end of the file. Then look again at the chapter file. Did anything change? Hopefully, the chapter number is now nicely styled.
Feel free to change the styling to suit your needs and taste. Go ahead and experiment until you get something you like. Once you’re satisfied with the chapter opening you can copy and paste the code into all other chapters. Then you’ll just have to change the chapter numbers (and chapters titles of course, if you are using any).
I prefer to learn by looking at examples, so here are a couple other examples that might be useful when learning to style:
Fixing Stuff
Line spacing: If you started with a double spaced manuscript your lines will be too far apart. Fix this by adjusting the line-height parameter in all your “s†styles, in your style sheet. I use 18pt.
Excess code:
It’s not unusual to see stuff like this:
<body class="calibre">
<div class="s1">
<p class="calibre2">Chapter 8</p>
</div>
<div class="s1">
<p class="calibre2"><span class="none1">In Lot</span><span class="none1"></span>
<span class="none1">s carnivorous-</span><span class="none1">plant collection there
were</span> several sundews started from seeds that Netta had given him. The sundews were tiny. If Lot
made a circle of his thumb and forefinger, each plant could fit within it. They had no stems, only thin petioles
growing from a central bud, each petiole supporting a sticky paddle at its end.</p>
</div>
<div class="s2">
<p class="calibre2">One....
Notice the ridiculous repetition of “span†tags? Logically, this shouldn’t matter, but for some reason only the text within the first span tag gets set in small caps, so I use a search and replace operation to get rid of the extra tags. I replace this–
</span><span class=”none1″>
with nothing, and replace
</span> <span class=”none1″>
with a space.
Here’s the cleaned up version:
<body class="calibre">
<div class="chapterline_block">
<h1 class="chapterline" id="heading_id_2" title="Chapter">Chapter</h1>
<p class="chapternumber">8</p>
</div>
<div class="s1">
<p class="calibre2"><span class="firstwords">In Lot's carnivorous-plant collection there
were</span> several sundews started from seeds that Netta had given him. The sundews were tiny. If Lot
made a circle of his thumb and forefinger, each plant could fit within it. They had no stems, only thin petioles
growing from a central bud, each petiole supporting a sticky paddle at its end.</p>
</div>
<div class="s2">
<p class="calibre2">One....
You might notice the same issue where italics are used. If the display works, you can probably leave it, but as I’ve mentioned before, I can’t stand messy code, so I use another search and replace to take out the extra span tags.
Here’s a lovely example:
<p class="calibre2">Abruptly, the camera bee lifted into the air. It hovered between Lot and Urban, its water-bead eye reflecting the dark, curving walls. <span class="none">How much do you know?</span> it demanded, in a tiny, tinny, feminine voice. <span class="none">Do you know why cold storage is empty?</span> <span class="none">No.</span> <span class="none">I can see not.</span> <span class="none">That shock on your faces.</span> <span class="none">Shao? </span> <span class="none">Stop recording.</span> <span class="none">We have enough video to do the story.</span> <span class="none">Now I want to know why. </span></p>
And here’s the cleaned up version:
<p class="calibre2">Abruptly, the camera bee lifted into the air. It hovered between Lot and Urban, its water-bead eye reflecting the dark, curving walls. <span class="none">How much do you know?</span> it demanded, in a tiny, tinny, feminine voice. <span class="none">Do you know why cold storage is empty? No. I can see not. That shock on your faces. Shao? Stop recording. We have enough video to do the story. Now I want to know why.</span></p>
Subscripts:
Do you ever use chemical formulas? O2 for example, or CO2? I do, on occasion. Calibre doesn’t seem to know what to do with subscripts. They have mark-up, but the style doesn’t do anything. The easiest thing is to modify the font size for their style so it’s much smaller than the default font size. I think I set it to 0.7em, but I forgot to include it in the stylesheet, so don’t look for it.
By the way, the default font size generated by Calibre is 1em. Don’t bother changing this. E-book readers allow the font size to be adjusted, so 1em is as good as anything else.
Once you figure out how to code chapter 1, use the same process for the rest of the chapters.
You’ll also need to set up the title page, copyright page, etc.
And of course you are periodically saving your work, right? And making back ups at the end of the day? Of course you are.
For further reading, here’s the Sigil manual.
Next time: Part 5—finishing your e-book.
Posted on: Sunday, November 21st, 2010 at 11:45 am
Categories: E-book How-to.