ScreenCasts | Videos from screen

Building a Fixed-Layout ePub3 from InDesign (part 2)

We Use Dreamweaver to edit the ePub Package files

In the previous part, we added a master page header to to every page and used this to split the ePub.

Now we are unpacking the ePub and after creating a local Dreamweaver site, we edit the various files inside the ePub package.

Note that I am using a MAC with the latest OS (Mavericks) to do this work. This makes life easier since I can view the ePub file with Apple's iBooks app.

If you are working with a PC/Windows, then you can test the ePub with Readium within the Google Chrome browser.

Addendum: To make sure that the header (originally only on the master pages), will appear above the main text, make the header text box very wide so that it is the first item reading left to right. The articles will then put things in the correct order reading from top left.

If you cannot see the screencast here then - Download the screencast

Size of file is: 85 MB

Duration: 00:25:10

1509.85432222 seconds

Further Information

As mentioned in the ScreenCast, you will need to modify the content.opf to include the following:

The package identifier should change to this:

<package xmlns="http://www.idpf.org/2007/opf" unique-identifier="bookid" version="3.0" prefix="rendition: http://www.idpf.org/vocab/rendition/ ibooks: http://vocabulary.itunes.apple.com/rdf/ibooks/vocabulary-extensions-1.0/">;

You need to add this to the metadata section:

<meta property="rendition:layout">pre-paginated</meta>

You will also need to add the following within the <head> tag of each XHTML file:

<meta name="viewport" content="width=600,height=900" />

The numbers that I have used here (600x900) are important but you can change to your own requirements. In my example this will use the full height of the iPad when in landscape mode.

More variations on this in the next screencast.

Filed Under: CSS and HTMLInDesignMaking eBooks