# A bunko novel set vertically, with furigana > Sōseki's Ten Nights of Dreams on an A6 bunko page: 38 characters down 15 lines, read from the right, readings beside the rare kanji, titles in three lines. - HTML version: https://postext.dev/en/cookbook/bunko-novel-furigana - Recipe Nº 117 · Page & grid · Level 2 (Intermediate) · Outputs: Canvas, PDF - Genres: Fiction, drama & literary prose - Requires postext ≥ 1.16.1, postext-pdf ≥ 1.16.1 · tested with 1.16.1, postext-pdf 1.16.1 on 2026-10-05 - Pages: [一](https://postext.dev/cookbook/bunko-novel-furigana/en/p01.webp?v=845c434a), [二](https://postext.dev/cookbook/bunko-novel-furigana/en/p02.webp?v=845c434a), [三](https://postext.dev/cookbook/bunko-novel-furigana/en/p03.webp?v=845c434a), [四](https://postext.dev/cookbook/bunko-novel-furigana/en/p04.webp?v=845c434a), [五](https://postext.dev/cookbook/bunko-novel-furigana/en/p05.webp?v=845c434a), [六](https://postext.dev/cookbook/bunko-novel-furigana/en/p06.webp?v=845c434a), [七](https://postext.dev/cookbook/bunko-novel-furigana/en/p07.webp?v=845c434a) - PDF: https://postext.dev/cookbook/bunko-novel-furigana/en/bunko-novel-furigana.pdf?v=845c434a - Open in Sandbox: https://postext.dev/en/sandbox#recipe=bunko-novel-furigana&lang=en (.postext: https://postext.dev/cookbook/bunko-novel-furigana/en/bunko-novel-furigana.postext) - Last updated: 2026-10-05 - Other languages: [es](https://postext.dev/es/cookbook/bunko-novel-furigana.md), [ca](https://postext.dev/ca/cookbook/bunko-novel-furigana.md), [zh](https://postext.dev/zh/cookbook/bunko-novel-furigana.md), [ja](https://postext.dev/ja/cookbook/bunko-novel-furigana.md), [ar](https://postext.dev/ar/cookbook/bunko-novel-furigana.md) ## In short The opening of a classic Japanese book as a pocket paperback: the text runs in columns from top to bottom, read from right to left, with small kana beside the harder characters. ## What you'll build Nine pages of a Japanese pocket paperback (文庫, bunko) of Natsume Sōseki's *Ten Nights of Dreams*, the first and second nights, on an A6 page of 105 × 148 mm bound on the right. The title page lies alone on the left of the spine; from page 2 the text runs top to bottom in lines read from the right, 38 characters down and 15 lines across, Shippori Mincho B1 at 9 pt on a pitch of 1.75 em. The readings Aozora Bunko gives for the harder kanji stand beside them in half-size kana, each night's title takes three lines of the grid, and the left-hand pages carry the book's title down the fore-edge over a folio in kanji numerals. The European pocket book with the same structure is [Nº 104](https://postext.dev/en/cookbook/catalan-pocket-novella.md), and the Chinese vertical novel is [Nº 075](https://postext.dev/en/cookbook/vertical-novel-right-bound.md). **This recipe answers:** - How do I set a Japanese novel vertically, bound on the right, like a bunko paperback? - How do I add furigana over kanji, one reading per character or one for the whole word? - How do I turn an Aozora Bunko text into a Postext book? - How do I make a Japanese heading take three body lines (3行取り), so the text stays on the grid? ## The short answer A bunko page, 38 characters down 15 lines, bound on the right. ```js // script.js, lines 33–52 // 'vertical-rl' sets each line top to bottom and the lines from right to left; with the // binding left to 'auto' the book opens from the right, so page 1 is a left-hand page and // the spreads read [3 | 2]. locale 'ja' gives the cjk settings Japan's values: they are // written out below so you can see them, and leaving them out sets the same page. const page = { sizePreset: 'custom', width: mm(105), height: mm(148), dpi: 200, // 文庫判 A6 backgroundColor: col('paper'), // 天 above 地; left is the spine side (the right edge of a left-hand page). The grid // grows the margins of each pair alike, so the head stays deeper than the foot. margins: { top: mm(15), bottom: mm(11), left: mm(9), right: mm(12), mirror: true }, pageNumbering: { format: 'japanese-informal' }, // folios 一, 二 … 十, 十一 }; const layout = { layoutType: 'single', writingMode: 'vertical-rl' }; const cjk = { grid: { enabled: true, charsPerLine: CHARS, linesPerPage: LINES }, lineBreak: 'ja-very-strict', // 行頭禁則: no 、。」ー or small kana at the head of a line hangingPunctuation: 'allow', // ぶら下げ: a 、。 that would open a line hangs below the last paragraphStartBracket: 'half', // ③: a 「 that opens a paragraph fills the indent cell ruby: { align: 'jis', overhang: 'kana' }, // JIS 1:2:1, a reading may run onto kana only }; ``` ## Ingredients **Teaches** - [Vertical text](https://postext.dev/en/docs/configuration.md#vertical-writing): Chinese and Japanese set top to bottom in lines read from the right (layout.writingMode 'vertical-rl'), with columns as tiers, figures and tables standing upright and punctuation in its vertical forms. - [Furigana: kana readings over kanji](https://postext.dev/en/docs/japanese-layout.md#furigana): Kana readings set over horizontal kanji and right of vertical ones. {漢字|かん|じ} gives each character its own reading and lets the line break between them (jukugo ruby), {夕方|ゆうがた} one reading for the word (group ruby), and :ruby[…]{mode align} chooses either way. In a document tagged ja the readings are spaced 1:2:1 (JIS), may overhang the kana beside them by one ruby character but never a kanji, and keep their small kana. - [Headings over body lines (gyōdori)](https://postext.dev/en/docs/japanese-layout.md#headings-and-blocks): A Japanese heading takes a whole number of body lines and sits centred in them: lineSpan: 3 on a heading level is 3行取り, so the text after it stays on the grid. Alongside: indents counted in body ems (字下げ), lines set flush with the foot or raised from it (地付き, 地からN字上げ) for dates and signatures, and short headings spread to a fixed width (序　章). **Also uses** - [Books bound on the right](https://postext.dev/en/docs/configuration.md#binding) - [Japanese line breaking (kinsoku)](https://postext.dev/en/docs/japanese-layout.md#line-breaking-kinsoku) - [Japanese punctuation spacing (yakumono)](https://postext.dev/en/docs/japanese-layout.md#yakumono-punctuation-spacing) - [Character grid](https://postext.dev/en/docs/configuration.md#character-grid) - [Japanese numerals and kana counters](https://postext.dev/en/docs/japanese-layout.md#numerals-and-counters) - [Aozora Bunko import](https://postext.dev/en/docs/japanese-layout.md#aozora-bunko-sources) - [Kana, kanji and rōmaji](https://postext.dev/en/docs/japanese-layout.md#kanji-kana-and-rōmaji) - [Chinese, Japanese and Korean fonts](https://postext.dev/en/docs/configuration.md#chinese-japanese-and-korean-fonts) - [Ruby: pinyin and zhuyin readings](https://postext.dev/en/docs/document-format.md#chinese-marks-ruby-and-warichu) - [Running heads and folios](https://postext.dev/en/docs/configuration.md#headers--footers) - [Heads by page role](https://postext.dev/en/docs/configuration.md#text-elements) - [Mirrored margins](https://postext.dev/en/docs/configuration.md#mirrored-margins) - [Heading styles](https://postext.dev/en/docs/configuration.md#heading-styles) - [Heading levels](https://postext.dev/en/docs/configuration.md#per-level-overrides) - [Paper colour](https://postext.dev/en/docs/configuration.md#page) - [Semantic colour palette](https://postext.dev/en/docs/configuration.md#color-palette) - [PDF export](https://postext.dev/en/docs/configuration.md#generating-pdfs) - [Chinese line breaking](https://postext.dev/en/docs/configuration.md#east-asian-typography) - [Chinese punctuation widths](https://postext.dev/en/docs/configuration.md#punctuation-widths) - [Heading attributes](https://postext.dev/en/docs/document-format.md#heading-attributes) - [Designed openers](https://postext.dev/en/docs/configuration.md#span-and-advanced-design) - [Fonts embedded in the PDF](https://postext.dev/en/docs/configuration.md#why-a-font-provider) - [Roman front matter](https://postext.dev/en/docs/document-format.md#numbering) - [Running heads per section](https://postext.dev/en/docs/configuration.md#heading-styles) - [Unnumbered chapters](https://postext.dev/en/docs/configuration.md#heading-styles) **Config at a glance** - [`bodyText`](https://postext.dev/en/docs/configuration.md#body-text), [`cjk`](https://postext.dev/en/docs/configuration.md#east-asian-typography), [`colorPalette`](https://postext.dev/en/docs/configuration.md#color-palette), [`footer`](https://postext.dev/en/docs/configuration.md#headers--footers), [`header`](https://postext.dev/en/docs/configuration.md#headers--footers), [`headingStyles`](https://postext.dev/en/docs/configuration.md#heading-styles), [`headings`](https://postext.dev/en/docs/configuration.md#headings), [`layout`](https://postext.dev/en/docs/configuration.md#layout), [`locale`](https://postext.dev/en/docs/configuration.md#hyphenation), [`page`](https://postext.dev/en/docs/configuration.md#page) **APIs** - [`buildDocument`](https://postext.dev/en/docs/configuration.md#building-a-document), [`clearMeasurementCache`](https://postext.dev/en/docs/configuration.md#measurement-cache), [`decompressWoff2`](https://postext.dev/en/docs/configuration.md#browser-font-provider-fontsource--woff2), `loadVerticalAlternates`, [`renderPageToCanvas`](https://postext.dev/en/docs/configuration.md#rendering-a-page-to-a-bitmap), [`renderToPdf`](https://postext.dev/en/docs/configuration.md#generating-pdfs) **Typefaces** - Shippori Mincho B1 (OFL-1.1), Noto Sans JP (OFL-1.1) ## Method ### 1 · Turn the page, count it in characters and tag it `ja` The code is [the short answer](#the-short-answer) above. `layout.writingMode: 'vertical-rl'` lays each page out as a horizontal page turned a quarter turn clockwise, and `page.binding`, left at `'auto'`, binds a vertical book on the right: page 1 is still the recto, but it lies on the left of the spine, and `mirror: true` puts its inner margin on its right ([Vertical writing](/en/docs/configuration#vertical-writing), [Binding](/en/docs/configuration#binding)). The [character grid](/en/docs/configuration#character-grid) makes the type area 38 characters of 9 pt down (120.7 mm) and 15 lines of 15.75 pt across (83.3 mm); the margins in `page` are minimums, and the grid grows each pair by the same amount, so the head stays 4 mm deeper than the foot. Ask for more lines than the margins leave room for and the grid quietly drops one (`cjkGridClamped` in `doc.configWarnings`): the 9 mm spine and 12 mm fore-edge are what lets 15 lines fit. `locale: 'ja'` sets the rest the way Japanese books are set, so the four `cjk` lines written out here change nothing; they show what the tag picks. `ja-very-strict` is JIS X 4051's line-start rule (行頭禁則): no line opens with 、。」, ー or a small kana such as っ. `hangingPunctuation: 'allow'` lets a 、 or 。 that would otherwise open a line hang below the last character (ぶら下げ), which bunko do instead of squeezing the line. `paragraphStartBracket: 'half'` is JLReq's pattern ③: a paragraph that opens with 「 sets the bracket in the second half of its one-character indent, so the first character of speech stands where every other paragraph's does ([East Asian typography](/en/docs/configuration#east-asian-typography)). Chinese books differ on both counts: they hang no mark by default and indent a paragraph two characters, bracket or not. ### 2 · Give each night's title three lines of the grid ```js // script.js, lines 56–63 // lineSpan sets the heading in a band of three body lines, its characters centred in it, so // the text after it stands on the grid's lines. Aozora marks the titles ５字下げ (中見出し); // indent counts body characters, whatever the heading's own size. const night = { level: 1, fontFamily: MINCHO, fontWeight: 600, fontSize: pt(12.5), lineSpan: 3, indent: em(5), // JLReq §4.1.3 breakBefore: { enabled: false }, // the nights run on (gotcha: headings-drop-h1-break) }; ``` A Japanese heading takes a whole number of body lines, 行取り (gyōdori), so the lines after it stay on the same grid as the lines before. `lineSpan: 3` sets 第一夜 in a band of three 15.75 pt lines with its characters centred across them; the heading's 12.5 pt does not move the grid, and on page 6 第二夜 lands mid-page with the text after it on the same lines as the text before. `indent: em(5)` reads body characters (五字下げ), which is how the Aozora text marks a 中見出し and how JLReq counts heading indents ([Per-level overrides](/en/docs/configuration#per-level-overrides)). ### 3 · Bring the text and its readings from Aozora Bunko The two nights come from Aozora Bunko's card 799, converted with `aozora.py` from the postext-port skill. The converter reads the file as CP932, turns each reading written `仰向《あおむき》` into a group reading `{仰向|あおむき}`, one run of kana over the whole word, and each `［＃５字下げ］…［＃「第一夜」は中見出し］` into a heading. In a `ja` document the readings follow JIS X 4051: a reading shorter than its base is spread along it 1:2:1, and a longer one may run onto a neighbouring kana but never onto a kanji ([Marks, ruby and warichu](/en/docs/configuration#marks-ruby-and-warichu)). The leading of 1.75 em leaves 6.75 pt between lines, room for the 4.5 pt readings. ### 4 · Put the hashira down the fore-edge, the folios in kanji ```js // script.js, lines 67–78 // anchor 'outer' is the fore-edge: the left margin of an odd page, the right of an even one // in a book bound on the right. The 柱 starts two characters below the head of the text. const foreEdge = (id, content, parity, edge, y, pages) => ({ kind: 'text', id, content, parity, pages, writingMode: 'vertical-rl', fontFamily: GOTHIC, fontSize: pt(7), letterSpacing: pt(1), color: col('muted'), overflow: 'clip', placement: { anchor: { to: 'outer', edge }, offset: { y: em(y) } }, }); const header = { elements: [ foreEdge('hashira', '{title}', 'odd', 'top', 2, 'body'), // never on the opening page foreEdge('folio', '{pageNumber}', 'all', 'bottom', -2, 'all'), ] }; const none = { elements: [] }; ``` In a vertical bunko the running head (柱, hashira) is small and sits in the outer margin. `anchor.to: 'outer'` places an element there, the left margin of an odd page and the right one of an even page in a book bound on the right, and `writingMode: 'vertical-rl'` sets it top to bottom ([Vertical text elements](/en/docs/configuration#vertical-text-elements)). The title 夢十夜 runs on the left-hand pages only (`parity: 'odd'`), and `pages: 'body'` would keep it off any page that opens a chapter. `pageNumbering.format: 'japanese-informal'` prints the folios 二, 三 … 九 ([Numbering](/en/docs/configuration#numbering)). ### 5 · Centre the title page on the trim ```js // script.js, lines 82–110 // A design on a vertical page is laid out in the flow frame: x runs down the page and y // across it, leftwards from the right edge. Anchored to the page (the trim), the frame and // the title stand on the page's axis, 52.5 mm in, whichever side the spine is on. const at = (down, across) => ({ anchor: { to: 'page', edge: 'top-left' }, offset: { x: mm(down), y: mm(across) } }); const AXIS = 105 / 2; // mm const TITLE = 28 * PT; // mm: 夢十夜 in 28 pt, three characters and two 8 pt gaps down const frame = { kind: 'box', id: 'frame', placement: { ...at(30, AXIS - 23), size: { width: mm(88), height: mm(46) } }, // 88 mm down, 46 mm across style: { borderColor: col('vermilion'), borderWidth: pt(0.75) } }; const titlePage = { id: 'title', numbered: false, toc: false, span: 'page', header: none, footer: { elements: [ // The colophon across the foot, in the edition's language: each \n in the attribute // starts a line; the box hangs from the foot of the page, centred. // Noto Sans JP: Shippori Mincho B1 has no ō or ū for the rōmaji. { kind: 'text', id: 'colophon', content: '{attr.colophon}', fontFamily: GOTHIC, fontSize: pt(5.25), lineHeight: 1.45, color: col('muted'), overflow: 'wrap', align: 'center', placement: { anchor: { to: 'page', edge: 'bottom' }, offset: { y: mm(-4) }, size: { width: mm(84) } } }] }, breakBefore: { enabled: true, parity: 'any' }, advancedDesign: { enabled: true, minHeight: lines(LINES), slot: { elements: [ frame, { kind: 'text', id: 'book', content: '{titleText}', fontFamily: MINCHO, fontWeight: 800, fontSize: pt(28), lineHeight: 1, letterSpacing: pt(8), color: col('ink'), placement: at(44, AXIS - TITLE / 2) }, { kind: 'text', id: 'author', content: '{author}', fontFamily: MINCHO, fontSize: pt(11), letterSpacing: pt(4), color: col('ink'), placement: at(92, AXIS + TITLE / 2 + 4) }, ] } }, }; ``` The title page is a level-1 heading with a style of its own, `# 夢十夜 {style="title" …}`, whose design fills the page. Its elements are anchored to the page itself, not the type area, because the type area of a mirrored page sits 1.5 mm off centre: `x` runs down the page and `y` across it from the right edge, so `AXIS` is half the page's width on either side of the spine. The colophon in the footer is set in Noto Sans JP: Shippori Mincho B1 has no ō or ū, and the PDF would draw empty boxes for Sōseki. ### 6 · Load each weight with the characters it sets ```js // script.js, lines 219–228 // Fontsource cuts a Japanese face into about 120 files; loadCjkFonts fetches the ones the // text touches (gotcha: cjk-fonts-slices). vertical: true loads the face's vertical forms // for the canvas: 、。「」ー and small kana such as っ stand differently down a line. const title = markdown.match(/^title: "(.*)"$/m)[1]; const author = markdown.match(/^author: "(.*)"$/m)[1]; const heads = markdown.match(/^# [^{\n]*/gm).join(''); await loadFonts(FONTS, markdown); // the Latin files: the colophon, with ō and ū await loadCjkFonts({ [MINCHO]: ['400'] }, markdown, { vertical: true }); await loadCjkFonts({ [MINCHO]: ['600', '800'] }, `${heads}${title}${author}`); await loadCjkFonts({ [GOTHIC]: ['400'] }, `${title}一二三四五六七八九十`, { vertical: true }); ``` Fontsource serves each weight of a Japanese face as about 120 files, each covering a range of characters, and `loadCjkFonts` fetches the files the text it is given touches. The text weight gets the whole sample with `vertical: true`, which also loads the face's vertical forms for the canvas: 、。「」 and ー, and the small kana, which stand in the upper right of their cell in vertical text. `renderToPdf` takes `cjkPdfProvider`, which embeds the same files as subsets. ## The whole recipe One file, composed from the recipe's folder with the sample text and the Cookbook's shared kit inlined; it builds its own page. To run it, put it in a `