logiblo

ロジのめもちょうです。本サイトはこちら→https://logica-physica.info/

MacのPagesでePub書き出して縦書き対応メモ

「誰でも電子出版~MacとPagesで作るiBooksキンドル本!縦書きにも対応!」を参考に、縦書きePub(挿絵あり)作ってみました。

まずはPagesで目次を付けたり、挿絵を挿入したり、ルビをふったりと編集します。
画像の配置は、ページ区切りを挿入してできた空白ページに画像を配置して、ページいっぱいに広げるといい感じでした (しかし、使用してる画像が多いと、Pagesは勝手に画像を削除します・怒。これはあとで手書きで追加しました……)。

その後は、ePubを解凍し(The Unarchiverとかで解凍できる)、内部のファイルを編集します。

縦書き対応

OPSディレクトリ内「epub.opt」の記述、

<spine toc="ncx">

<spine page-progression-direction="rtl" toc="ncx">

に書き換える。

さらに、OPS/css/ディレクトリ内「book.css」に、以下を追記。

body{
	writing-mode: vertical-rl;
	line-break: normal;
	-epub-writing-mode: vertical-rl;
	-webkit-writing-mode: vertical-rl;
	-epub-line-break: normal;
	-webkit-line-break: normal;
}

(「誰でも電子出版〜」では、-webkit-writing-modeしか設定していなかったのですが、それではiBookで縦書き表示されませんでした)。

縦中横

Pagesでは縦書きに対応してない、つまり縦中横も対応していないので、縦中横を一カ所一カ所設定します。OPSディレクトリ内の「chapter-*.xhtml」をそれぞれ開いて、エディタで正規表現置換すれば一発ですね。

<span class="tcy">!!</span>

「book.css」にも以下を追記。

span.tcy {
	-webkit-text-combine: horizontal;
	-webkit-text-combine-upright: all;
	text-combine-upright: all;
	-epub-text-combine: horizontal;
}

(傍点とか脚注をやりたい場合も、同様にCSSでなんとかしましょう。)

(.mobi変換→.azk変換でiOSKindleで確認しましたが、iOS Kindleは感嘆符の縦中横が上手く表示できません。この問題についてはこちら→「iOS版のKindleで感嘆符の縦中横が潰れる問題」。)

挿絵サイズをテキスト描画領域と同じサイズにする

(注:テキスト描画領域外はマージンになる)

「chapter-*.xhtml」の、imageタグ部分のインラインCSSでwidthを100%にする。

<span style="display:inline-block;text-indent:0px;vertical-align:baseline;width:100%;"><img src="images/image-hoge.jpg" alt="image-hoge.jpg" style="width:100%;"/></span>

挿絵の前後で改ページを指定

指定せずとも改ページされて表示されましたが、デバイスによって差異があるといけないので念のため、画像の前後で改ページを指定しました。

<span style="display:inline-block;text-indent:0px;vertical-align:baseline;width:100%;" class="pagebreak-both"><img src="images/image-hoge.jpg" alt="image-hoge.jpg" style="width:100%;"/></span>
.pagebreak {
	page-break-after: always;
}
.pagebreak-before {
	page-break-before: always;
}
.pagebreak-both {
	page-break-before: always;
	page-break-after: always;
}
hr.pagebreak {
	border: 0;
	height: 0;
	visibility: hidden;
}

最後に

Pagesからの書き出し時に、解像度が下げられてしまった画像があったら、差し替えます。

そして最後に、「誰でも電子出版~」に記載されているAutomatorスクリプトで、サービスメニューにePubパッケージ化するメニューを追加します。
ですが、このスクリプトで作ったePubには「.DS_Store」が含まれてしまい、ePUB構文エラーになるので(実用には問題ありませんが)、「.DS_Store」を削除するコマンドを追記してます。で、ディレクトリを選択して実行。

これでePubができました!

あとはフォント指定まわりの書き換えでしょうか(埋め込むにしろ埋め込まないにしろ)。