A Gearhead's Guide to E-book Publishing - Lesson 5: Opening Paragraphs

Lesson 4 of this tutorial was about splitting and formatting chapters in your e-book. In this lesson you're given some choices for tweaking the chapter text a bit.

Here's Chapter 1 as it exists so far:

Observe that all the paragraphs are indented .3 inches. Book designers often use a zero indent for the opening paragraphs of chapters and scenes. This page is the first page of Chapter 1 and it also has a scene break. To cause them to indent differently, start by adding a style for first paragraphs.

    1. Open Style0001.css in the Styles folder of the Book Browser.
    2. Add this line of code to the file:

        p.first { text-indent:0 }

This statement defines a class named first that you can apply to paragraphs with the  <p>...</p> tag. To apply the class to the <p> tags:

    3. For each chapter file:
        a. Double-click the chapter's html file name in the Book Browser to open the chapter file
        b. Change the display to Code View (F2 toggles between Page View and Code View)

Here is Chapter 1 in Code View:

(If you have difficulties reading the screen shots in this blog, click on them for a zoomed-in view.)

Kind of daunting if you don't have much experience with html and css. This is where you take the plunge. But don't worry, it will be brief and not hard at all.

        c. Position the typing cursor within the <p> tag
        d. Change the tag to:
            <p class="first">
        e. Do the same for any opening paragraphs for scenes in the chapter
        f. Press F2 to toggle back to Page View and see the effects of these changes

Book designers often set off the first paragraph of each chapter with a drop cap, where the first letter of the paragraph stands out with bold face type, perhaps a different and larger font, and extending to lower lines. Not all e-reader devices support drop caps, so it's best to just simulate the effect, which you can do by setting that first letter to bold face type. To do that:

        g. Select (highlight) the first letter of the paragraph
        h. Click the Bold button (the one with the thick blue A icon)
        i. Deselect the letter and view the results

There's one more item to address in each chapter. That three-asterisk wingding that separates scenes ought to be center-aligned. There are two ways to do that:

If you don't have many scene breaks in your book, for each one:

        j. Click on the scene break wingding
        k. Click the Center button (the one with centered horizontal lines)

-or-

        j. Add this class to the Styles0001.css file:

           p.scene { text-align:center; }    

        k: Change the <p> tag ahead of each wingding to this:

                <p class="scene">

Here's your book so far as you view Chapter 1:

As usual, save your work and return for the next lesson. There is work ahead. The book needs a cover, a table of contents, and other things.

---

Table of Contents Introduction
Lesson 1: HTML
Lesson 2: Content
Lesson 3: Frontmatter
Lesson 4: Chapters
Lesson 5: Opening Paragraphs
Lesson 6: The Cover
Lesson 7: TOC, Metadata
Lesson 8: Epub Validation
Lesson 9: The Mobi (Kindle) Format

A Gearhead's Guide to E-book Publishing - Lesson 4: Chapters

Lesson 3 of this tutorial discusses the formatting of an e-book's frontmatter. This lesson is about dividing the book into separate html files and formatting the chapter headings and opening paragraphs.

By splitting the book into separate html files you ensure that each chapter starts on its own page.

Begin with Sigil opened to the first page of the html file that contains the text for all chapters.

    1. Scroll through the document and stop at each chapter heading
    2. For each chapter heading do the following:
        a. Place the typing cursor anywhere in the chapter heading
        b. Click the h2 button

By assigning the h2 style to each chapter heading, you ensure that the chapter headings will be used to build the table of contents, which comes in a later lesson.

The chapter headings will look like this one for Chapter 1 of the book:

(Don't do steps c. and d. for Chapter 1. You already did it when you separated the chapters from the frontmatter in Lesson 3.)

        c. Place the typing cursor at the beginning of the chapter heading
        d. Select Insert->Split Marker (or press Ctrl+Enter)

This action splits the current chapter away from the remaining chapters in the book. The current chapter retains the name that had been shared by them all, and the remaining ones get a new name as this illustration shows:

You might be happy with the default filenames that Sigil assigns since their sequential numbers align with the chapter numbers. I prefer to use meaningful names when the book has a lot of chapters and the chapters have titles. So I do the following:

        e. Select the previous (Current for chapter 1) chapter in the Book Browser (the html file that you just split off)
        f. Rename (Ctrl+Alt+R) it to something you'll recognize later when you edit the book's contents

(Don't use space characters in your filenames. They mess things up later.)

The following screen shot shows the renamed files for all chapters:

That's enough for now. The next lesson discusses how to tweak the book's format with respect to chapter headings and opening paragraphs.

---

Table of Contents Introduction
Lesson 1: HTML
Lesson 2: Content
Lesson 3: Frontmatter
Lesson 4: Chapters
Lesson 5: Opening Paragraphs
Lesson 6: The Cover
Lesson 7: TOC, Metadata
Lesson 8: Epub Validation
Lesson 9: The Mobi (Kindle) Format

A Gearhead's Guide to E-book Publishing - Lesson 3: Frontmatter

Lesson 2 of this tutorial is about integrating a book's html file into the beginnings of an epub file. This lesson shows how to format the book's frontmatter.

Frontmatter comprises the first pages of the book. It includes the title page, a copyright page, the dedication, acknowledgments, and so on. Print editions typically put these elements on separate pages, and e-books often leave them on a single coninuous page. It's your choice. This lesson assumes that the front matter is already typed into the document.

Because the book is in html format, there are no page breaks, and all the frontmatter text is in the default font, aligned on the left margin, and with a 0.3 inch first-line indent. These are the values that this lesson changes.

Split off the Frontmatter

    1. Open Sigil with the new epub file from Lesson 2 opened to the frontmatter

 



    2. Postion the typing cursor on the chapter heading of Chapter 1 just before the first character
    3. Press Ctrl+Enter
This action splits the the html file into two files where the typing cursor is positioned as shown here:

Observe that the Book Browser shows a new file named Section0001.html and that the new file is selected. That file contains all the text for the book from Chapter 1 to the end. The next lesson deals with that file. For now we're interested only in the frontmatter.

Rename the Frontmatter File

It isn't necessary to rename the file, but later, when there are many files in the Book Browser, it helps if they have meaningful names.

    1. Select (double-click) the original file name (bandit.html in this example)
    2. Rename (Ctrl+Alt+R) the selected file to frontmatter.html

Format the Frontmatter

You must decide whether you want the frontmatter split into individual pages or on one page. For individual pages, use Ctrl+Enter to make the split, rename the files (titlepage.html, copyright.html, and so on) and format them separately. For this lesson we'll keep them together.

Sigil has formatting tool buttons in a tool bar that allow you to change the font and alignment of selected text in the document. You could get fancy and use specific css statements in the Style0001.css file, but since each element appears only once in a book, you might as well just take the easy way.

The formatting used in this lesson is only typical. You might prefer something different.

    1. Select all the text in the frontmatter (Ctrl+A)
    2. Click the the Center button in the alignment toolbar (that's the button with horizontal lines centered as its icon)
    3. Select the text you want bolded
    4. Use the Bold button (the fat blue A icon) to set the text's font to boldface

Here's the frontmatter with the formatting I've chosen

You might want to add vertical spacing between the several parts of the frontmatter. Don't try to do that by using the Enter key to insert blank lines. It will look okay in Sigil, but the html rendering software in the e-reader device will eat the blank lines. For vertical spacing, you need to get deeper into CSS and add styles that control it. That will be another lesson later. For now, we'll leave it the way it is.

Save your work and take a break. The next lesson is about formatting chapters in the book.

---

Table of Contents Introduction
Lesson 1: HTML
Lesson 2: Content
Lesson 3: Frontmatter
Lesson 4: Chapters
Lesson 5: Opening Paragraphs
Lesson 6: The Cover
Lesson 7: TOC, Metadata
Lesson 8: Epub Validation
Lesson 9: The Mobi (Kindle) Format

A Gearhead's Guide to E-book Publishing - Lesson 2: Content

Lesson 1 of this tutorial explains how to convert a word processor document to an html file suitable for insertion into a new epub file. This lesson shows how to begin that integration. You start with a free program named Sigil, which is an epub editor that does a lot of the mundane epub architectural work that you'd have to do yourself if you were hand-coding the epub with a text editor.

You can download Sigil by following the links at the Sigil Home Page.

A Bare-bones Epub

    1. Open Sigil. The program starts with a blank epub file ready to be fleshed out.

    2. Right-click the Text folder in the Book Browser pane (on the left side)
    3. Choose Add Existing Files...
    4. Select the html file you built in Lesson 1 of this tutorial
    5. Select (double-click) the new html file name in the Book Browser

Here's the book scrolled down to the beginning of Chapter 1 past the frontmatter, which we'll deal with later.

Stylesheet

Next we add CSS code to the epub that specifies how each component of the book is rendered by the e-reader device. So far, all you have are paragraphs as defined by the <p> and </p> tags that you added to the text in Lesson 1, and the narrative is rendered in the default paragraph format for web pages.

Start by adding a style sheet to the epub.

    1. Right-click the Styles folder in the Book Browser
    2. Select Add Blank Stylesheet

Now there is an empty file named Style0001.css in the Styles folder. If you prefer the default paragraph formatting, you can skip the next step.

    3. Type the following line of CSS code into the blank stylesheet:
       
    p {text-indent:0.3in; margin-top:0; margin-bottom:0}

This code tells the e-reader device how to render all text that falls between the <p> and </p> tags. Specifically it says that the first line of the paragraph is to be indented .3 inches and that there is to be no extra margin space at the top and bottom of the paragraphs.

The epub document now has chapter headings, narrative, and a style sheet with one style so far. Now the headings and narrative must be associated with the style and any others that follow.

    1. Right-click the html file in the Book Browser
    2. Select Link Stylesheets...
    3. Check the Stylesheet filename in the Link Stylesheets dialog
    4. Click OK

The paragraphs now are indented on the first line and have no extra spacing between each other. We'll do additional work on the chapter headings in the next lesson.

Save Your Work
Use the File/Save command to save the epub file now. The next lesson is about formatting the book's frontmatter.

---

Table of Contents Introduction
Lesson 1: HTML
Lesson 2: Content
Lesson 3: Frontmatter
Lesson 4: Chapters
Lesson 5: Opening Paragraphs
Lesson 6: The Cover
Lesson 7: TOC, Metadata
Lesson 8: Epub Validation
Lesson 9: The Mobi (Kindle) Format

A Gearhead's Guide to E-book Publishing - Lesson 1: HTML

From Manuscript to HTML

You start by converting your book's word processor document—the book itself—to a raw HTML format. Here's the beginning of a story written in Word.

Note: The screen shots in this tutorial are blurry and not easy to read (for old eyes, anyway). That's just how the BlogSpot software renders images. It works okay for snapshots, but graphical illustrations lose some of their detail. Simply click on a screen shot image for a better rendering of a screen shot you need to see in more detail.

From your word processor

    1. Surround all italicized words and phrases with <i>...</i> tags which signify the beginning and ending of italicized text in html
    2. Save the book as raw text (.txt)
Here's how you'd do that in Word:

 

Make sure that lines end in CR/LF and that no line breaks are inserted.

Next you'll use Notepad++ to convert the text file to a raw html file
    1. Turn on "Show All Characters" (button w/ blue paragraph mark)
    2. Line breaks show as CRLF

    3. Use the Replace All command with Extended Search Mode selected
            Find what:        \r\n
            Replace with:   </p>\r\n<p>

The \r and \n sequences represent the CR (carriage return) and LF (line feed) characters in the text. If you are doing this with Word, you would use the More->Special->Paragraph Mark character in the Find/Replace dialog.
    4. Insert a <p> tag  at the beginning of the file
    5. Delete the <p> tag at the end of the file

 



The <p> and </p> tags indicate the beginnings and endings of html paragraphs.
    6. Save the file
    7. Rename the file with the file extension .html
You now have an incomplete html file of your book. You can click it to open your browser and read it that way.

There's a lot of work to be done, and the file lacks the <html>, <head>, <body>, and other tags that a well-formed html file needs. Those come later when you integrate the html file into an epub file, which starts in the next lesson.

---

Table of Contents Introduction
Lesson 1: HTML
Lesson 2: Content
Lesson 3: Frontmatter
Lesson 4: Chapters
Lesson 5: Opening Paragraphs
Lesson 6: The Cover
Lesson 7: TOC, Metadata
Lesson 8: Epub Validation
Lesson 9: The Mobi (Kindle) Format