学ぶ
カスタムPDFテンプレート:プレミアムなブランドレポートを作成する
カスタムテンプレートビルダーを使って、ワードマーク、セリフ体、ブランドカラー、フルページ背景を備えたダークテーマのフルブリード(フチなし)ブランドレポートをデザインし、アプリやAPIで再利用する方法を解説します。
カスタムテンプレートを使えば、シンプルなMarkdownが、まるでデザインスタジオで制作されたかのようなドキュメントに生まれ変わります。独自のワードマーク、タイポグラフィ、カラーをページ全体に適用できます。一度作成すれば、その後エクスポートするすべてのレポート、提案書、概要書を、ワンクリックでブランドイメージに沿ったものにできます。
本ガイドでは、Aureliaという完全なサンプルを最初から最後まで作成する手順を解説します。これは、成果物にも仕事と同等のこだわりを求めるクライアントに対し、エージェンシーやコンサルタントが送るような、ダークテーマでフルブリード(フチなし)のブランド戦略レポートです。手順に従えば、あなたのアカウントに独自のバージョンが保存されます。このレシピは、請求書、ピッチデック、作業範囲記述書(SOW)などにも応用可能です。

完成図 — 保存したテンプレートを通して、通常のMarkdownからレンダリングされたもの。
作成するもの
Aureliaは意図的に「高級感」を演出しており、そのすべての要素をビルダーで制御できます。
- フルブリードの背景 — ページの端まで広がる深いネイビーのグラデーション。
- ゴールドのワードマークのタイトルロゴと、文字間隔を空けた小さな機密情報の表記。
- セリフ体のタイポグラフィ — 見出しにはコントラストの高いディスプレイ書体、本文には洗練されたブックセリフ体。
- ブランドパレット — 温かみのあるゴールドの見出し、クリーム色の本文、ゴールドの罫線が入った引用ブロック。
- 実際のドキュメント構造 — エグゼクティブサマリー、ポジショニングマトリックスの表、ロードマップなど、すべてダークページでも読みやすいようにスタイル設定されています。
始める前に
- アカウントにサインインします。ビルダーは Dashboard(ダッシュボード) → Template builder にあります。
- 有料プランを推奨します。テンプレートのデザインと保存は無料ですが、透かしなしでエクスポートしたり、Executiveのようなプレミアムベースを使用したりするには、有料プランが必要です。
- 2つのアセットを準備します:
- 透過PNG形式のロゴまたはワードマーク。幅が広く高さの低いワードマーク(例:1200×170)は、スリムなタイトルロゴとして美しく映えます。
- (オプション)A4縦サイズ(約1240×1754)の背景画像。暗くコントラストの低いグラデーションやテクスチャが最適です。ごちゃごちゃした写真はテキストの邪魔になります。
ヒント:手元に背景画像がありませんか? 単色の暗い背景色(Background color)を設定するだけでも、後述のプレミアムなダークスタイルが適用されるため、画像をアップロードせずにテンプレート全体を構築することも可能です。
ステップ 1 — ビルダーを開き、テンプレートに名前を付ける
Dashboard → Template builder を開きます。画面は3つのエリアに分かれています。左側にテンプレートライブラリ(Template library)、中央にレイアウトビルダー、右側にすべての編集を行うテンプレートインスペクター(Template inspector)があります。
テンプレートインスペクターで以下の設定を行います:
- 名前(Name) を
Aurelia — Brand Strategy Reportに設定します。 - 後で識別できるように、短い 説明(Description) を追加します。
- ベーステンプレート(Base template) を Executive に設定します。これは、エレガントな見出しの罫線と力強い表のスタイルを備えた洗練されたベースです。
- コンバーターでこのテンプレートを初期選択状態にしたい場合は、デフォルトテンプレートに設定(Set as default template) にチェックを入れます。

3パネル構成のビルダー。テンプレートインスペクターでの変更はすべて即座にページに反映されます。
ステップ 2 — フルブリードのページ背景を追加する
テンプレートインスペクターで ページシェル(Page shell) セクションを見つけます。ここでは、用紙の端まで到達するページの外側部分を制御します。
- 背景画像(Background image) の下にある 背景画像をアップロード(Upload background image) をクリックし、暗いA4サイズのアートワークを選択します。自動的にページの端から端まで塗りつぶされます。
- 4つの padding(パディング) の値は
0のままにしておきます。ドキュメントにはすでにブリード(塗り足し)の内側に適切なマージンが確保されています。 - オーバーレイ(Scrim)を追加します。これは画像の上に薄く色を重ねてテキストを読みやすくする機能です。オーバーレイの色(Scrim color) を
#05070Fのような黒に近い色に設定し、オーバーレイの不透明度(Scrim strength) を約 18% に調整します。
画像がない場合は、代わりに 背景色(Background color) を #070B18 のような深いネイビーに設定してください。どちらの場合でも、ビルダーはダークページであることを認識し、ベーステンプレートのライトページ用の装飾(白い引用カード、ゼブラ柄の表の行、控えめな太字のアクセントなど)を自動的にクリーンアップするため、設定した色が綺麗に映えます。

ページシェル:フルブリードの背景と、可読性を高めるための穏やかなオーバーレイ。
ステップ 3 — ロゴとフッターを配置する
引き続きテンプレートインスペクターで、ブランディング(Branding) セクションを開きます:
- ブランド名(Brand name):
Aurelia - サブタイトル(Subtitle):
Brand Strategy Studio - フッターテキスト(Footer text):
Aurelia Brand Studio · Confidential— これはすべてのページの下部に印刷されるランニングフッターになります。
次に、レイアウトビルダー上で ヘッダー(Header) ブロックを選択します。選択ブロック(Selected block) パネルで 画像をアップロード(Upload image) をクリックし、透過されたワードマークのPNGを選択します。ページ上部にスリムなタイトルロゴとして表示されます。

ブランディングテキストは、ヘッダーとランニングページフッターに反映されます。
ステップ 4 — ヘッダー行のスタイルを設定する
ヘッダー ブロックを選択したまま、選択ブロック パネルをスクロールします:
- テキスト(Text) に、短く自信に満ちた一文を入力します:
Brand Strategy Studio · Confidential。 - テキストの色(Text color) を
#A7A08Bのような落ち着いた温かみのあるグレーゴールドに設定し、主張しすぎないようにします。 - 配置(Alignment) を 中央(Center) に設定し、ワードマークの下の中央に配置されるようにします。
- タイトルロゴとレポートタイトルの間隔を空けるため、少し 下部マージン(Margin bottom) (
28程度)を追加します。

ブロックごとのテキストの色と配置設定により、ダークページでもヘッダーとフッターのテキストが美しく映えます。
ステップ 5 — プレミアムなタイポグラフィを設定する
ここから、テンプレートが単なるドキュメントではなく、ブランドとしての顔を持ち始めます。タイポグラフィ(Typography) セクションを開き、要素(Element) ドロップダウンを使用して各要素のスタイルを設定します。Aureliaでは2つのフォントのみを使用します。この抑制がプレミアム感を演出します。
| 要素 | フォントファミリー | フォントサイズ | 色 | 備考 |
|---|---|---|---|---|
| 本文(Body) | EB Garamond | 16 | #CBC6B8 |
軽やかでエディトリアルな雰囲気を出すため、行の高さ(Line height)を1.75に |
| 見出し 1(Heading 1) | DM Serif Display | 40 | #F3EEE2 |
レポートのタイトル — 温かみのあるオフホワイト |
| 見出し 2(Heading 2) | DM Serif Display | 25 | #C9A44E |
ゴールドのセクション見出し |
| 見出し 3(Heading 3) | EB Garamond | 13 | #B6AD94 |
大文字(Uppercase)、文字間隔(Letter spacing)3 — スモールキャップスのキッカー |
| 引用(Blockquote) | EB Garamond | 21 | #E6D3A3 |
ゴールドの罫線が入った引用ブロック |
| テーブルヘッダー(Table header) | EB Garamond | 13 | #F3EEE2 |
大文字(Uppercase)、文字間隔(Letter spacing)1.5 |
各行について、要素を選択し、フォントファミリー(Font family) を選び、フォントサイズ(Font size) を入力し、色(Color) スウォッチをクリックして、追加設定(文字間隔(Letter spacing)、変換(Transform)、行の高さ(Line height))を行います。ダークテンプレートの鍵は色です。ここで明るいテキストの色を設定することで、ページが生き生きとします。

要素ごとのタイポグラフィ。要素を選択し、その要素のみのスタイルを設定します。
ステップ 6 — プレビュー、テスト、保存
- レイアウトビルダーの下にある Exact PDF preview(正確なPDFプレビュー) を展開し、ページの忠実なレンダリングを確認します。
- 実際のコンテンツでテストします。 見出し、表、引用、リストなどを含む実際のドキュメントを貼り付け、すべてが読みやすい状態を保っているか確認します。Aureliaは、ポジショニングマトリックスやロードマップも崩れることなく処理できます。
- テンプレートを保存(Save template) をクリックします。これで テンプレートライブラリ(Template library) に表示され、どこでも使用できるようになります。

実際のコンテンツ — 表、リスト、太字のリード文 — ダークページでも鮮明に表示されるようスタイル設定されています。
ステップ 7 — コンバーターでテンプレートを使用する
- コンバーターを開きます(Convert リンク、またはビルダーから 変換を開く をクリック)。
- Markdownを貼り付けるか、記述します。
- 保存済みテンプレート(Saved templates) の下から、Aurelia — Brand Strategy Report を選択します。
- プレミアム PDF をダウンロード(Download Premium PDF) をクリックします。
これで完了です。Markdownが、完全にブランド化された透かしのないレポートとして出力されます。
ステップ 8 — APIで自動化する
テンプレートを保存すると、同じブランド化されたPDFをプログラムから生成できるようになります。AIの出力、CMSのコンテンツ、または定期的なレポートを、クライアントに提出できるドキュメントに変換するのに最適です。
1. APIキーを作成する。 Dashboard → API keys に移動して作成します。キーは mp_live_ で始まり、一度しか表示されないため、安全な場所にコピーしてください。
2. テンプレートのIDを見つける。 サインインした状態で、ブラウザで https://markdowntopdfconverter.com/api/custom-templates を開きます。JSONレスポンスには、保存されたすべてのテンプレートとその id がリストされています。使用したいテンプレートのIDをコピーします。
3. 変換エンドポイントを呼び出す。 Markdownと customTemplateId を送信します:
curl -X POST https://markdowntopdfconverter.com/api/v1/convert \
-H "Authorization: Bearer mp_live_YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"markdown": "## Northwind Outdoor — Brand Strategy\n\nYour report content in Markdown…",
"templateId": "executive",
"customTemplateId": "YOUR_TEMPLATE_ID",
"filename": "northwind-brand-strategy",
"options": { "pageNumbers": true }
}' \
--output northwind-brand-strategy.pdf
Node.jsでの同じリクエスト:
const res = await fetch("https://markdowntopdfconverter.com/api/v1/convert", {
method: "POST",
headers: {
Authorization: `Bearer ${process.env.MP_API_KEY}`,
"Content-Type": "application/json",
},
body: JSON.stringify({
markdown: "## Northwind Outdoor — Brand Strategy\n\nYour report content…",
templateId: "executive",
customTemplateId: "YOUR_TEMPLATE_ID",
filename: "northwind-brand-strategy",
options: { pageNumbers: true },
}),
});
const pdf = Buffer.from(await res.arrayBuffer());
レスポンスはPDFファイルそのもの(Content-Type: application/pdf)です。保存したデザインを適用するには customTemplateId を渡し、そのベーステンプレート(ここでは executive)を templateId に設定します。すべてのオプションについては、完全なAPIドキュメントを参照してください。
プレミアムな仕上がりのためのデザインのヒント
- フォントは最大2つまで。 1つのディスプレイセリフ体と、1つのブックセリフ体(またはクリーンなサンセリフ体)を組み合わせます。フォントの種類を増やすのではなく、フォントサイズ、太さ、色で階層を作りましょう。
- ページに余白を持たせる。 ゆったりとした行の高さと控えめなオーバーレイは、余計な装飾よりも「プレミアム感」を高めます。
- コントラストを意図的に作る。 ダークページでは、最も明るいトーンをタイトルに、ゴールドをセクション見出しに、柔らかなオフホワイトを本文のために取っておきましょう。
- 透過ロゴのみを使用する。 透過PNGのワードマークはどんな背景にも綺麗に馴染みますが、白い背景がついたロゴはそうはいきません。
- 出力前にテストする。 長い見出し、幅の広い表、コードブロックなど、常に実際のコンテンツでプレビューし、後で予期せぬ崩れが起きないようにしましょう。
次のステップ
- テンプレート比較ガイドで、6つの組み込みのベーステンプレートを比較する。
- アプリを初めて使う場合は、スタートガイドから始める。
- 自動化の準備ができたら、APIドキュメントを詳しく見る。