• ITに強い編集プロダクション・リブロワークスのWebサイト

    テンプレートダウンロード機能でMDBPの書籍プレビューがさらに手軽に

    MDBPに、最近人気のA5版型のテンプレート(本文13級)ダウンロード機能を追加しました。市販書籍用の仮デザインを転用したもので、表やコラムのスタイルもあり、図版やソースコードに簡易的な囲み文字を入れられます。市販書籍に近いイメージの文書を手軽に作成できます。

    ※MDBPについては過去の記事を参照してください。

    操作方法は以下の動画でご確認ください。Markdownファイルと画像ファイルしかない状態からスタートして、テンプレートをダウンロードするだけでMDBPが必要とするCSSなどのファイルが準備できます。あとはVivliostyle Viewerをダウンロードすれば、数ステップで書籍プレビューを表示できるようになります。

    このテンプレートではGoogle Noto SansとNoto Serifを使用しています。それらのフォントをパソコンにインストールしておくとより正確に再現できます。

    今後もB5や縦書きなど一般的なテンプレートの追加を予定しています。

    postManipulate(後操作)機能を追加

    まだまだ実験的な機能ですが、Markdownをいじらずにデザイン都合でHTML構造を自動変更する機能を追加しました。見出しのデザインを凝ったものにするために、@div:secheader~@divendといったタグ風のレイアウト指示コードを入れる仕様としていますが、Markdownの標準ルールから離れてしまい、記述が面倒になるという問題があります。そこで、jQueryに似た機能を持つcheerioというライブラリを利用し、h2とpが並んでいたらdiv要素で囲むよう機能を追加しています。

    以下のショットは、h1と直後のp要素、h2と直後のp要素をそれぞれdiv要素で囲むようにした例です。

    操作内容は_postManipurate.jsonというファイルに「セレクタ」「メソッド」「パラメータ」を指定する形にしているので、プロジェクトごとに設定変更が可能です。

    [
      {
        "selector": "h1",
        "method": "wrapWithNextSib",
        "paramator": "<div class=\"coverpage\"></div>"
      },
      {
        "selector": "h2",
        "method": "wrapWithNextSib",
        "paramator": "<div class=\"secheader\"></div>"
      }
    ]