見出し画像

Obsidianのノートを組版しPDF・EPUBに書き出すプラグイン「Vivlio」を公開しました（縦書き・段組みOK!）

nonkuri
縦書きPDF出力例

　タイトルそのままですが、Obsidianのノートを組版し、PDF・EPUBに書き出すプラグイン「Vivlio」を公開しました。

　Obsidianは文章の執筆にはとても便利なのですが、完成した原稿をPDFやEPUBにするには、別のアプリや変換ツールへ持ち出す必要がありました。

　過去にEPUBを作成したときは、「でんでんコンバーター」を利用させていただきました。無料で使いやすいコンバーターですが、やはりファイルのアップロードなどにそれなりに手間がかかります。それに、実際に縦書き組版したときにどのように出力されるかは、コンバーターを通してみるまでわかりません。

　そこで、オープンソースのCSS組版システムである「Vivliostyle」を使って、Obsidianのノートをそのまま組版し、完成イメージを確認しながらPDF・EPUBに書き出せるプラグイン「Vivlio」を作成しました。例によって例のごとく生成AIエージェント製（Claude Code + Codex）です。
　コミュニティプラグインとして登録済みです。

https://github.com/nonkuri/obsidian-vivlio

　Markdownの原稿と出来上がりのPDFやEPUBファイルをまとめたものをダウンロードできるようにしていますので、興味がある方はご参考にどうぞ。

　以下、本記事の内容は、Vivlio 0.8.0 時点のものです。


Vivlioプラグインとは

　Vivlioは、ObsidianのMarkdownノートをVivliostyleでCSS組版するデスクトップ版Obsidian専用プラグインです。組版エンジンはプラグインに同梱しているため、外部アプリとやりとりすることなく、ノートからPDFやEPUBを作成することができます。初回起動時の追加ダウンロードもありません。

　VivliostyleはオープンソースのCSS組版システムで、Chromiumベースで動いているため、Electronベース（そのベースはChromium）のObsidianと相性がいいのではないかと思い、使わせていただきました。

　Obsidianの右サイドペインに実際の組版イメージをプレビュー表示できます。プレビューとPDFは同じVivliostyleエンジンと同じスタイルシートを使用するため、原稿を編集しながら紙面の仕上がりを確認できます。

　縦書き・横書きとも対応しているので、小説、同人誌、技術書、マニュアルなど、Markdownで書いたさまざまな原稿に利用できます。

　プラグイン内蔵のテーマで出力することはもちろん、CSSでテーマを自作することも可能です。

Vivlioでできること

PDFと同じ組版結果をライブプレビュー

　Vivlioの大きな特徴は、Obsidian内で組版結果を確認できることです。

　左側でMarkdown原稿を編集し、右側で組版された紙面を確認できます。原稿や設定を変更すると自動的に再組版されるため、修正を確認しやすくなっています。

　Obsidian標準のPDF書き出しでは困難な、次のような日本語組版にも対応しています。

  • 縦書き

  • 段組み

  • ぶら下げ

  • 和文と欧文の間隔調整

  • ルビ、傍点、縦中横

  • 柱、ノンブル、改ページ

  • トンボと塗り足し（それぞれ単独でも指定可能）

  • 文庫判などの用紙サイズと、1行の文字数・1ページの行数の指定

  • 章や扉などを始めるページの左右指定と、必要に応じた白丁の挿入

複数のノートをまとめて1冊にできる

　1つのノートをそのまま1冊として書き出すこともできますし、章ごとに分けたノートをまとめて1冊として書き出すこともできます。

　複数ノートをまとめる方法は、次の2つです。

  • フォルダ直下のMarkdownファイルをファイル名の自然順（`2.md`を`10.md`より前にする順序）で並べる

  • `index.md`などの目次ノートに書かれた`[[ウィキリンク]]`の順番で並べる

　たとえば、次のように章ごとにノートを分けておけば、`index.md`のリンク順で1冊の本として組版できます。

小説/
├─ index.md
├─ 01-第一章.md
├─ 02-第二章.md
└─ 03-第三章.md
# 目次

- [[01-第一章]]
- [[02-第二章]]
- [[03-第三章]]

小説でよく使うルビ・傍点・縦中横に対応

　通常のObsidian記法に加え、青空文庫やカクヨムで使われる書き方にも対応しています。

  • `漢字《かんじ》`：直前の漢字にルビ

  • `任意の文字よみ`：`｜`以降の文字列にルビ

  • `{漢字|かんじ}`：Vivliostyle Flavored Markdown式のルビ

  • `《《強調したい文字》》`：傍点

  • `^^1/2^^`：4文字までの縦中横

  • `==強調==`：設定に応じて傍点・太字・`<mark>`などに変換

  • `［＃改ページ］`、または`===`だけの行：強制改ページ

　このほか、行頭の全角スペースを字下げとして扱ったり、縦書き中の1桁・2桁の半角数字を自動的に正立・縦中横させたり、3行以上の連続した空行を紙面のアキとして反映したりできます。

　Obsidianの画像埋め込み、ノート埋め込み、ウィキリンク、コールアウト、タスクリスト、Mermaid、Dataviewの描画結果なども組版できます。普段のObsidianで使っている記法をなるべくそのまま原稿に利用できるようにしました。

縦組み二段組にも対応

　縦組み小説向けには、1段組の`novel`に加えて、二段組の`novel-2col`テーマを用意しています。新書、B6、A5の二段組プリセットも選べます。

theme: novel-2col
size: JIS-B6
charsPerLine: 23
linesPerPage: 17

　`charsPerLine`と`linesPerPage`は1段あたりの字詰め・行数です。扉、目次、奥付、表紙は1段組のままになり、ページ脚注は二つの段にまたがって配置されます（オプションで章末に段組配置も可）。

PDFとEPUB 3に書き出せる

　組版した原稿は、PDFまたはEPUB 3として書き出せます。

　PDFはタグ付きでテキスト検索が可能です。しおり、書誌情報、ページラベル、表紙も付けられます。フォントはObsidianが使用しているChromiumによってPDFへ埋め込まれ、使用した文字だけにサブセット化されます。

　EPUBは画面サイズや文字サイズに応じてレイアウトが変わるリフロー型です。テーマのCSS、表紙、目次、ランドマーク、書誌情報を収録できます。

書き出し前に原稿を点検

　PDFやEPUBを生成する前に、次のような問題を確認します。

  • リンク先や画像が見つからない

  • 紙面上で画像の実効解像度が300dpiを下回る

  • 指定したフォントがPCにない

  • 表紙画像と用紙の縦横比が大きく異なる

  • EPUBに表紙が指定されていない

　警告を見てから書き出しを続けるか、いったん中止して原稿を修正するかを選べます。

インストール

　Obsidianのコミュニティプラグインからインストールできます。

  1. 設定を開く

  2. コミュニティプラグイン→閲覧を開く

  3. `Vivlio`で検索する

  4. インストールを押し、続けてプラグインを有効にする

　手動で導入する場合は、GitHubのリリースページから`main.js`、`manifest.json`、`styles.css`をダウンロードし、次のフォルダに配置してください。

<Vault>/.obsidian/plugins/vivlio/

　なお、Vivlioはデスクトップ版Obsidian 1.8.7以降に対応しています。PDFの生成にObsidian内のChromiumを利用するため、モバイル版では動作しません。

基本的な使い方

　まずは組版したいノートを開き、左側のリボンにある本のアイコンを押します。コマンドパレットからVivlio: プレビューを開くを実行しても構いません。

　右側にプレビューが開き、上部のツールバーから次の操作ができます。

  • 再組版：原稿や設定、CSSを読み直して再組版

  • テーマ：組版に使うテーマを選択

  • PDF：PDFの書き出しダイアログを開く

  • EPUB：EPUBの書き出しダイアログを開く

　フォルダを1冊として扱いたい場合は、ファイルエクスプローラでフォルダを右クリックし、Vivlio: 本としてプレビューまたはVivlio: 本として書き出すを選びます。

本ごとの設定は`vivlio.yaml`にまとめる

　書名、著者名、テーマ、縦書き・横書き、用紙サイズ、文字数、行数、表紙などは`vivlio.yaml`でまとめて設定できます。異なる設定のものをコピーしておけば、原稿はそのままに組版結果だけ変えられます。

title: 遠雷
author: 山田花子

theme: novel
writingMode: vertical-rl
size: 文庫
charsPerLine: 39
linesPerPage: 15
startSide: left
footnote: gcpm

cover: 装丁/表紙.png
sections:
  titlePage: auto
  toc: auto
  colophon: auto
pageNumbering: continuous
startPage: 1
cropMarks: false
bleed: 3mm

　上記は設定例の一部です。`vivlio.yaml`は、コマンドパレットからVivlio: 本の設定を作成を実行すると、ウィザード形式でを作ることができます。なお、設定は3段階方式になっていて、Vault全体の既定値、`vivlio.yaml`、各ノートの`vivlio-*`の順で設定を上書きできます。

CSSで自分用のテーマも作れる

　Vivlioには、縦組み小説向けの`novel`、縦組み二段組向けの`novel-2col`、6×9 インチの欧米向け英語小説向けの`english-novel`、横組みのマニュアル・技術書向けの`manual`という4つのテーマが用意されています。

　さらに、Vault内のCSSファイルを指定して、自分用の組版テーマを作ることもできます。一から作ることもできますし、既存テーマを読み込み、文字数や行数、色、コールアウトの枠など、必要な部分だけを変更することもできます。

@import url("vivlio:novel");

:root {
  --vs-novel--chars-per-line: 42;
  --vs-novel--lines-per-page: 17;
}

.callout-warning {
  border-color: #b00;
}

　原稿だけでなく、版面や装飾までVaultの中で管理できるのは、Obsidianを執筆環境にしている人にとって便利だと思います。

　上の画像はサンプルとしてダウンロードできる独自CSSでの装飾例です。

　ちなみに、CSSを作るときはChatGPTに相談すると簡単にできます。サンプルCSSもChatGPTと相談しながら作りました。

https://github.com/nonkuri/obsidian-vivlio/tree/main
このプラグインで使える英語小説用のcssを作ってほしい。 美しいレイアウトにしてね。

　こんな感じで始めて、あとは「ドロップキャップ（章冒頭の大きな文字）を入れて」、などと要望を伝えていくと、いい感じのCSSをよしなに作ってくれます。

使うときの注意点

  • 目次のページ番号は、プレビューですべてのページが組まれるまで`??`と表示される場合があります。PDF・EPUBへの書き出し時には正しい番号になります。

  • 画面上でも最初から目次のページ番号を確定させたい場合は、設定の全ページを最初に描画するを有効にします。ただし、プレビュー表示は遅くなります。

  • フォント自体はプラグインに同梱していません。PDFやEPUBへの埋め込みが許可されているかどうかは、使用するフォントのライセンスを確認してください。

  • EPUBはリーダーによって表示に差があるため、配布前に実際の端末やアプリでも確認することをおすすめします。

Obsidianの中で「書く」から「本にする」まで

　Vivlioを使うと、ObsidianでMarkdown原稿を書き、そのままページとしてプレビューし、PDFやEPUBに書き出せます。

　原稿と組版用の設定、表紙画像、CSSテーマを同じVaultで管理できるため、修正のたびに別のアプリへ原稿を移す必要がありません。小説や同人誌、個人制作の技術書などをObsidianで書いている方に、ぜひ試してもらえればと思います。

　詳しい設定や原稿の書き方は、GitHubの日本語READMEとマニュアルにまとめています。

#Obsidian #プラグイン #Vivliostyle #Markdown #Obsidianプラグイン #PDF #EPUB #組版 #CSS組版 #日本語組版 #縦書き #段組み #電子書籍 #個人出版 #同人誌制作 #執筆支援 #小説 #小説執筆 #執筆環境 #出版 #物語投稿サイトTALES

いいなと思ったら応援しよう！