How to Create a Fixed Format Ebook (Part 3): Placing Text

Fixed_Format_text_example

In the last two posts of this series, I covered how to set up a fixed format ebook and how to add images to a fixed format ebook. In this post I’ll cover how to place text on specific parts of a fixed format ebook’s “page,” which includes placing text on top of the image.

First, you’ll want to open up your stylesheet (CSS) in Sigil, and add code for each page of your book. This sounds like a lot, but luckily a standard children’s book is 32 pages, so it’s not too bad. Having each line of text on each page in its own class in the CSS stylesheet will let you decide where exactly on the page the text will appear, so that it can be readable on top of the image.

The image above shows page 1 and page 2 of the book. Here is what the CSS code looks like for those two pages:

Fixed_Format_CSS_paragraphs

Basically, I created rules for where the text should go. On page 2, for example, I made the top margin large enough so the text would appear in a fairly plain part of the image, to make it easy to read. I also gave it some space in the left and right margins. I also changed the color on page 2 slightly, to a lighter brown/yellow. The reason you don’t see code for the color on page 1 is because I set that as the default color for all text in the <p> tag.

Now all you have to do is add this style rule to the HTML page. Here is what the code view of page 2 in Sigil looks like:

Fixed_Format_HTML_paragraphs

Once you add this code, your ebook will look a lot like the first image in this post. Congrats, the main parts to create a fixed format ebook are done!

In the next post of this series, I’ll go over how to embed fonts. Tip: you can also embed fonts in reflowable ebooks (ebooks for novels, nonfiction, and basically any type of book that’s not a picture/illustrated book).

Advertisements

4 thoughts on “How to Create a Fixed Format Ebook (Part 3): Placing Text

  1. Pingback: How to Create a Fixed Format Ebook (Part 4): Embedding Fonts | Musings and Marvels

  2. Pingback: How to Create a Fixed Format Ebook (Part 5): Read Aloud Code | Musings and Marvels

  3. Pingback: How to Create a Fixed Format Ebook (Part 6): KF8 Magnify Text | Musings and Marvels

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s