AsciiDocにおいて表紙を作る場合には、以下の設定を行います。

  • タイトルに入れる文字の設定

    • スタイルファイルおよび属性で設定します

  • 背景の設定

    • 画像ファイルもしくはPDFファイルを選択できます

順番に説明します。

タイトルに入れる文字の設定

スタイルファイルの設定

YAMLファイルの"title_page"セクションを設定します。

主に、タイトル、サブタイトル、著者情報、バージョン情報の文字の種類・サイズ・位置などを設定します。ロゴを入れることも可能で、その位置を設定するのもこのセクションです。

#------
# Title Page Section
#------
title_page: //(1)
  align: center
  logo: //(2)
    top: 10%
    align: right
  title: //(3)
    top: 60%
    font_size: $heading_h1_font_size
    font_stye: bold
    font_color: #FFFFFF
    line_height: 0.9
  subtitle: //(4)
    font_size: $heading_h3_font_size
    font_style: bold
    font_color: #FFFFFF
    line_height: 1
  authors: //(5)
    font_size: $base_font_size_large
    font_style: normal
    font_color: #FFFFFF
    margin_top: $base_font_size * 1.25
  revision: //(6)
    font_size: $base_font_size
    font_style: normal
    font_color: #FFFFFF
    margin_top: $base_font_size * 1.25
    delimiter: "<br/>" //(7)

  1. タイトル全体の設定

  2. ロゴの位置などの設定

  3. タイトル文字設定

  4. サブタイトル文字設定

  5. 著者名の文字設定

  6. バージョン番号の文字設定

  7. この記述を挿入するとバージョンと日付を改行することができます

タイトル全体で文字の種類・サイズを設定しても良いし、それぞれで設定することも可能です。ただし、位置（左・中央・右）は、全体の設定でしかできないようです。ロゴの位置は個別に設定できます。

属性の設定

ADOCファイルの属性（Attribute）を設定します。

:author: Author //(1)
:revdate: 2019年10月18日 //(2)
:revnumber: 0.9版 //(3)
:version-label: //(4)

  1. 著者名

  2. 日付

  3. バージョン番号

  4. 値無しにすると好みのバージョン名にすることができます

実は、本文（Body）内で記述することもできます。上の設定を本文内で書くと以下のようになります。

= AsciiDocのTips: 表紙の作り方
Author <author@hoge.hoge>
v0.9, 2019-10-18

私は属性に書くのが好みです。

背景の設定

背景を入れることで、本格的な文書に見えてきます。

背景画像の設定

背景画像を設定します。タイトル文字などは、ADOCファイル内で設定できます。

:title-page-background-image: image:title-page-back.png[] //(1)

  1. :title-page-background-image: の属性を使います。

以下は、出力された表紙の例です。

sample title 001

PDFファイルの設定

表紙となるPDFファイルを設定します。タイトル文字などは設定できません。第一段落はコメントアウトしておきましょう。

:front-cover-image: image:title-page.pdf.pdf[] //(1)

・・・

//= AsciiDocのTips: 表紙の作り方 //(2)

  1. :front-cover-image: の属性を使います。

  2. 第一段落はコメントアウトします。こうしないと空白のページが表紙と目次の間にできてしまいます。

表紙のデザインについて

実は表紙のデザインを作成するのが一番大変だったりします。Officeのテンプレートで検索しても、あまりたくさん見つかりませんでした。自力で作るテクニックも無くどうしようか悩んでいたところ、

Canva というサイトを見つけました。今回の例はここで作成しました。

簡単な手順。

  • 新規登録してログインします

  • [デザインを作成] ⇒ 分野を選択 ⇒ 気に入ったテンプレートを選択 ⇒ コメントや背景などを編集変更することができます
    canva001

  • 保存は基本的に自動保存ですが、ファイル ⇒ 保存 で手動保存することもできます

  • 上の方にある meisyou の名称未設定の部分を編集して、名前を変更しておくと再編時に分かりやすいです

  • 再編集は、ホーム ⇒ すべてのデザイン で見つけることができます

  • ローカルPCへのダウンロードは、 download で行います

    • 高解像度のPDFがおすすめです

    • PDFを画像にする時は、 PDF-XChange などを使ってPNGにエクスポートします。この方法だと400dpiなど高解像度の画像で保存することができます。

複雑なことをしなければ無料登録でもいろいろと試すことができます。

本ページについて

本ページはAsciiDocで作成しています。 こちら にサンプルを置いておきます。サンプルは、「 Visual Studio CodeからPDFを出力する 」の方法で比較的簡単にPDFやHTMLにすることができます。

Homeへ
AsciiDocの記事Topへ
本ページはAsciiDocで作成しました。