Split Chapter in Epub

I’m learning how to use InDesign to create epubs. It has a “Split Chapter” feature that allows you to create paragraph styles that you can apply to elements that you want to appear at the top of a page. For example, the following paragraph would be removed from the flow and appear at the top of the next page if I designate class “Top” a splitter under “Edit All Export Tags.”

<p class="Top">I want this paragraph to serve as a header.</p>

However, I discovered that this splitting is kind of an allusion; it literally creates a new file. In addition, it’s designed to work with paragraphs only; I prefer to use text wrapped in h2 and h3 tags as headers. I’m going to have separate files for each chapter, but some chapters have subheadings that I want to appear at the top of the next page, and I don’t want to break each chapter up into separate files.

So here’s my question:

Is there a CSS style that will make any element with the proper class appear at the top of the next page in an epub?

Incidentally, this is the style InDesign wrote for my class “Top.” However, it appears to be irrelevant, as the split is enabled by literally splitting the file into separate files. Thanks for any tips.

p.Top {
	color:#000000;
	font-family:"Minion Pro", serif;
	font-size:1em;
	font-style:normal;
	font-variant:normal;
	font-weight:normal;
	line-height:1.2;
	margin-bottom:0;
	margin-left:0;
	margin-right:0;
	margin-top:0;
	orphans:1;
	page-break-after:auto;
	page-break-before:auto;
	text-align:left;
	text-decoration:none;
	text-indent:0;
	text-transform:none;
	widows:1;
}

Yes, the " page-break-before: always; " would probably work for this. The InDesign rule-set you posted has the value “auto” which is the initial and afaik only breaks when the element doesn’t fit.

The “widows” property could maybe be useful but is awkward here and it has less support.

Try create a new class, like:

.new-page {
    page-break-before: always;
    break-before: always; /* for future devices */
}

The W3.org CSS 2.1/2.2 spec: https://www.w3.org/TR/CSS22/page.html
W3.org CSS 3 breaks: https://www.w3.org/TR/css-break-3/

Summary info at Mozilla Dev: https://developer.mozilla.org/en-US/docs/Web/CSS/Paged_Media

And the compatibility check at Can I Use: http://caniuse.com/#search=page-break

OT)
Seems like InDesign isn’t the ideal tool here (but it should?) as you describe it. Maybe alternatives (which I’ve not used myself):

ePub editor reviews: http://www.jedisaber.com/eBooks/editors.shtml

Working links:
eCub: http://www.softpedia.com/get/Others/E-Book/eCub.shtml
Jutoh: http://www.softpedia.com/get/Others/E-Book/Jutoh.shtml
Sigil: https://github.com/Sigil-Ebook/Sigil

1 Like

Awesome; works perfectly.

Epub software is an interesting topic. I’m just learning the ropes. I’m subscribed to Adobe CSS, so InDesign seemed like the natural choice, but I was blown away when I discovered that 1) epubs are essentially miniature websites, yet 2) InDesign doesn’t let you work with HTML! I can import Microsoft Word files but not Dreamweaver files. And the Word files create all kinds of problems - including certain tags that are zapped, as well as substantial code bloat.

The final straw was when I realized that the page break headers you create in InDesign are nothing more than paragraphs. It just doesn’t seem professional to use a paragraph where you should be using a header tag (e.g. h2, h3, etc.).

But I think I’ve found a good workaround. I just use InDesign to create a new project, which I export as an epub, after which I can use BBEdit to open the files and work with the HTML.

There are some more advanced InDesign features which I haven’t yet figured out how to port over, but I’m working on it. I also installed Sigil recently, though I haven’t had a chance to work with it yet.

Thanks again for the tip. I’ll check out some of your links, too.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.