| FUNBREW PDF

NaN/NaN/NaN

証明書PDFを生成するとき、最も時間がかかるのはテンプレートのデザインです。ゼロからHTMLとCSSで証明書を組み立てるのは、意外と手間がかかります。

この記事では、すぐにコピペして使えるHTML証明書テンプレートを5種類提供します。修了証、賞状、ディプロマ、参加証、資格証明書――よくある証明書タイプをカバーしています。FUNBREW PDF APIでレンダリングすれば、数秒でプロ品質のPDFが生成できます。

証明書の自動発行システム全体の設計については証明書PDF自動生成ガイドを、バッチ処理の詳細はPDF一括生成ガイドを参照してください。テンプレートエンジンの活用方法はPDFテンプレートエンジンガイドで解説しています。

テンプレートの使い方

各テンプレートは以下の3ステップで使えます。

1. HTMLをコピーする

テンプレートのHTMLコードをコピーして、プロジェクトに貼り付けます。

2. データを差し替える

{{name}}、{{date}} などのプレースホルダーを実際のデータに置き換えます。テンプレートエンジン（Handlebars、Jinja2など）を使えば自動化できます。

3. PDF APIでレンダリングする

curl -X POST https://pdf.funbrew.cloud/api/pdf/generate \
  -H "Authorization: Bearer sk-your-api-key" \
  -H "Content-Type: application/json" \
  -d '{
    "html": "<YOUR_TEMPLATE_HTML>",
    "options": {
      "page-size": "A4",
      "orientation": "landscape"
    }
  }' \
  --output certificate.pdf

各言語での実装例は言語別クイックスタートで確認できます。

テンプレート1: 研修修了証

企業研修やオンラインコース修了時に発行する、スタンダードな修了証テンプレートです。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<style>
  @page {
    size: A4 landscape;
    margin: 0;
  }
  body {
    margin: 0;
    padding: 0;
    font-family: "Noto Serif JP", "Yu Mincho", serif;
    background: #fff;
  }
  .certificate {
    width: 297mm;
    height: 210mm;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .border-frame {
    position: absolute;
    top: 10mm;
    left: 10mm;
    right: 10mm;
    bottom: 10mm;
    border: 3px double #1a365d;
  }
  .inner-frame {
    position: absolute;
    top: 15mm;
    left: 15mm;
    right: 15mm;
    bottom: 15mm;
    border: 1px solid #c4a35a;
  }
  .content {
    position: relative;
    z-index: 1;
    padding: 30mm 40mm;
  }
  .label {
    font-size: 14pt;
    color: #666;
    letter-spacing: 0.5em;
    margin-bottom: 10mm;
  }
  .title {
    font-size: 36pt;
    color: #1a365d;
    font-weight: bold;
    margin-bottom: 15mm;
    letter-spacing: 0.3em;
  }
  .recipient {
    font-size: 24pt;
    color: #333;
    border-bottom: 2px solid #1a365d;
    padding-bottom: 3mm;
    margin-bottom: 10mm;
    display: inline-block;
    min-width: 150mm;
  }
  .description {
    font-size: 12pt;
    color: #555;
    line-height: 2;
    margin-bottom: 15mm;
    max-width: 200mm;
  }
  .date {
    font-size: 11pt;
    color: #666;
    margin-bottom: 8mm;
  }
  .organization {
    font-size: 14pt;
    color: #1a365d;
    font-weight: bold;
  }
</style>
</head>
<body>
<div class="certificate">
  <div class="border-frame"></div>
  <div class="inner-frame"></div>
  <div class="content">
    <div class="label">CERTIFICATE</div>
    <div class="title">修 了 証</div>
    <div class="recipient">{{name}}</div>
    <div class="description">
      上記の者は、{{course_name}}の全課程を修了したことを証します。
    </div>
    <div class="date">{{date}}</div>
    <div class="organization">{{organization}}</div>
  </div>
</div>
</body>
</html>

カスタマイズポイント:

border-frame の色でフォーマル度を調整（紺: 企業向け、金: 格式高い式典向け）
font-family を変更してブランドに合わせる
ロゴ画像を追加する場合は .content 内に <img> を配置

テンプレート2: 賞状・表彰状

社内表彰やコンテスト入賞者向けの賞状テンプレートです。金色のアクセントで格式を演出します。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<style>
  @page {
    size: A4 landscape;
    margin: 0;
  }
  body {
    margin: 0;
    padding: 0;
    font-family: "Noto Serif JP", "Yu Mincho", serif;
    background: #fffef7;
  }
  .certificate {
    width: 297mm;
    height: 210mm;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .gold-border {
    position: absolute;
    top: 8mm;
    left: 8mm;
    right: 8mm;
    bottom: 8mm;
    border: 4px solid #c4a35a;
    border-radius: 2mm;
  }
  .gold-inner {
    position: absolute;
    top: 12mm;
    left: 12mm;
    right: 12mm;
    bottom: 12mm;
    border: 1px solid #d4b86a;
  }
  .content {
    position: relative;
    z-index: 1;
    padding: 25mm 40mm;
  }
  .emblem {
    font-size: 48pt;
    margin-bottom: 5mm;
  }
  .title {
    font-size: 40pt;
    color: #8b6914;
    font-weight: bold;
    margin-bottom: 12mm;
    letter-spacing: 0.5em;
  }
  .recipient {
    font-size: 28pt;
    color: #333;
    border-bottom: 2px solid #c4a35a;
    padding-bottom: 3mm;
    margin-bottom: 8mm;
    display: inline-block;
    min-width: 150mm;
  }
  .honorific {
    font-size: 14pt;
    color: #666;
    margin-bottom: 10mm;
  }
  .reason {
    font-size: 13pt;
    color: #444;
    line-height: 2;
    margin-bottom: 15mm;
    max-width: 220mm;
  }
  .footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    width: 200mm;
  }
  .date-block {
    font-size: 11pt;
    color: #666;
    text-align: left;
  }
  .signer {
    text-align: right;
    font-size: 12pt;
    color: #333;
  }
  .signer-name {
    font-size: 16pt;
    font-weight: bold;
    margin-top: 2mm;
  }
</style>
</head>
<body>
<div class="certificate">
  <div class="gold-border"></div>
  <div class="gold-inner"></div>
  <div class="content">
    <div class="title">賞 状</div>
    <div class="recipient">{{name}}</div>
    <div class="honorific">殿</div>
    <div class="reason">
      {{reason}}
    </div>
    <div class="footer">
      <div class="date-block">{{date}}</div>
      <div class="signer">
        {{organization}}<br>
        <span class="signer-name">{{signer_name}}</span>
      </div>
    </div>
  </div>
</div>
</body>
</html>

カスタマイズポイント:

emblem に社章やトロフィーの絵文字・SVGを配置
reason に具体的な表彰理由を記載（複数行対応）
署名欄に印影画像を追加する場合は透過PNG推奨

テンプレート3: ディプロマ（学位・卒業証書）

教育機関やブートキャンプ向けの正式なディプロマテンプレートです。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<style>
  @page {
    size: A4 landscape;
    margin: 0;
  }
  body {
    margin: 0;
    padding: 0;
    font-family: "Noto Serif JP", "Yu Mincho", serif;
    background: #fefcf3;
  }
  .diploma {
    width: 297mm;
    height: 210mm;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: linear-gradient(135deg, #fefcf3 0%, #f5f0e1 100%);
  }
  .ornate-border {
    position: absolute;
    top: 6mm;
    left: 6mm;
    right: 6mm;
    bottom: 6mm;
    border: 2px solid #8b6914;
  }
  .ornate-border::before {
    content: '';
    position: absolute;
    top: 3mm;
    left: 3mm;
    right: 3mm;
    bottom: 3mm;
    border: 1px solid #c4a35a;
  }
  .content {
    position: relative;
    z-index: 1;
    padding: 20mm 45mm;
  }
  .institution {
    font-size: 16pt;
    color: #1a365d;
    letter-spacing: 0.3em;
    margin-bottom: 8mm;
    font-weight: bold;
  }
  .title {
    font-size: 32pt;
    color: #1a365d;
    font-weight: bold;
    margin-bottom: 10mm;
    letter-spacing: 0.4em;
    border-bottom: 2px solid #c4a35a;
    padding-bottom: 5mm;
    display: inline-block;
  }
  .conferral {
    font-size: 12pt;
    color: #555;
    margin-bottom: 8mm;
    line-height: 1.8;
  }
  .recipient {
    font-size: 26pt;
    color: #1a365d;
    font-weight: bold;
    margin-bottom: 8mm;
  }
  .program {
    font-size: 14pt;
    color: #444;
    margin-bottom: 5mm;
  }
  .description {
    font-size: 11pt;
    color: #666;
    line-height: 1.8;
    margin-bottom: 12mm;
    max-width: 200mm;
  }
  .signatures {
    display: flex;
    justify-content: space-around;
    width: 220mm;
    margin-top: 10mm;
  }
  .sig-block {
    text-align: center;
    min-width: 60mm;
  }
  .sig-line {
    border-top: 1px solid #999;
    padding-top: 2mm;
    font-size: 10pt;
    color: #666;
  }
  .sig-title {
    font-size: 9pt;
    color: #999;
    margin-top: 1mm;
  }
  .date {
    font-size: 11pt;
    color: #666;
    margin-top: 5mm;
  }
</style>
</head>
<body>
<div class="diploma">
  <div class="ornate-border"></div>
  <div class="content">
    <div class="institution">{{institution}}</div>
    <div class="title">卒 業 証 書</div>
    <div class="conferral">本証書は下記の者が所定の課程を修了したことを証する</div>
    <div class="recipient">{{name}}</div>
    <div class="program">{{program}}</div>
    <div class="description">{{description}}</div>
    <div class="signatures">
      <div class="sig-block">
        <div class="sig-line">{{dean_name}}</div>
        <div class="sig-title">学部長</div>
      </div>
      <div class="sig-block">
        <div class="sig-line">{{president_name}}</div>
        <div class="sig-title">学長</div>
      </div>
    </div>
    <div class="date">{{date}}</div>
  </div>
</div>
</body>
</html>

カスタマイズポイント:

.institution の上にロゴ画像（校章）を配置
学位名を動的に変更（学士、修士、博士）
成績優秀者には cum laude 等の注記を追加

テンプレート4: イベント参加証

セミナー、カンファレンス、ワークショップの参加証テンプレートです。モダンなデザインで、QRコードの配置スペースも用意しています。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<style>
  @page {
    size: A4 landscape;
    margin: 0;
  }
  body {
    margin: 0;
    padding: 0;
    font-family: "Noto Sans JP", "Hiragino Sans", sans-serif;
    background: #fff;
  }
  .certificate {
    width: 297mm;
    height: 210mm;
    position: relative;
    overflow: hidden;
  }
  .accent-bar {
    position: absolute;
    top: 0;
    left: 0;
    width: 15mm;
    height: 100%;
    background: linear-gradient(180deg, #2563eb, #7c3aed);
  }
  .accent-top {
    position: absolute;
    top: 0;
    left: 15mm;
    right: 0;
    height: 3mm;
    background: linear-gradient(90deg, #2563eb, #7c3aed);
  }
  .content {
    margin-left: 30mm;
    margin-right: 25mm;
    padding-top: 25mm;
    position: relative;
  }
  .event-badge {
    display: inline-block;
    background: #eff6ff;
    color: #2563eb;
    padding: 2mm 5mm;
    border-radius: 2mm;
    font-size: 10pt;
    font-weight: bold;
    margin-bottom: 8mm;
  }
  .title {
    font-size: 30pt;
    color: #1e293b;
    font-weight: bold;
    margin-bottom: 12mm;
  }
  .recipient {
    font-size: 22pt;
    color: #334155;
    margin-bottom: 5mm;
  }
  .recipient-name {
    font-size: 28pt;
    color: #1e293b;
    font-weight: bold;
    border-bottom: 3px solid #2563eb;
    padding-bottom: 3mm;
    display: inline-block;
    margin-bottom: 10mm;
  }
  .description {
    font-size: 12pt;
    color: #64748b;
    line-height: 2;
    margin-bottom: 15mm;
    max-width: 200mm;
  }
  .meta {
    display: flex;
    gap: 20mm;
    margin-bottom: 15mm;
  }
  .meta-item {
    font-size: 10pt;
    color: #94a3b8;
  }
  .meta-value {
    font-size: 12pt;
    color: #334155;
    font-weight: bold;
    margin-top: 1mm;
  }
  .footer {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
  }
  .organizer {
    font-size: 14pt;
    color: #1e293b;
    font-weight: bold;
  }
  .qr-placeholder {
    width: 25mm;
    height: 25mm;
    border: 1px dashed #cbd5e1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 8pt;
    color: #94a3b8;
  }
</style>
</head>
<body>
<div class="certificate">
  <div class="accent-bar"></div>
  <div class="accent-top"></div>
  <div class="content">
    <div class="event-badge">{{event_type}}</div>
    <div class="title">参加証</div>
    <div class="recipient">以下の者が参加したことを証明します</div>
    <div class="recipient-name">{{name}}</div>
    <div class="description">
      {{event_name}}に参加し、所定のプログラムを修了されました。
    </div>
    <div class="meta">
      <div class="meta-item">
        開催日<br>
        <span class="meta-value">{{event_date}}</span>
      </div>
      <div class="meta-item">
        会場<br>
        <span class="meta-value">{{venue}}</span>
      </div>
      <div class="meta-item">
        時間<br>
        <span class="meta-value">{{duration}}</span>
      </div>
    </div>
    <div class="footer">
      <div class="organizer">{{organization}}</div>
      <div class="qr-placeholder">QR Code</div>
    </div>
  </div>
</div>
</body>
</html>

カスタマイズポイント:

accent-bar のグラデーション色をブランドカラーに変更
QRコードは検証URLを埋め込んだ <img> に差し替え
meta セクションに追加情報（CPD単位数、CEU等）を追加可能

テンプレート5: 資格・認定証明書

技術認定やプロフェッショナル資格の証明書テンプレートです。認定番号や有効期限の記載欄があります。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<style>
  @page {
    size: A4 portrait;
    margin: 0;
  }
  body {
    margin: 0;
    padding: 0;
    font-family: "Noto Sans JP", "Hiragino Sans", sans-serif;
    background: #fff;
  }
  .certificate {
    width: 210mm;
    height: 297mm;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .header-band {
    width: 100%;
    height: 40mm;
    background: linear-gradient(135deg, #0f172a, #1e3a5f);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .header-text {
    color: #fff;
    font-size: 12pt;
    letter-spacing: 0.5em;
    text-transform: uppercase;
  }
  .body-content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 15mm 25mm;
    text-align: center;
  }
  .cert-title {
    font-size: 28pt;
    color: #0f172a;
    font-weight: bold;
    margin-bottom: 10mm;
    letter-spacing: 0.2em;
  }
  .divider {
    width: 60mm;
    height: 1px;
    background: #c4a35a;
    margin-bottom: 10mm;
  }
  .conferral-text {
    font-size: 11pt;
    color: #64748b;
    margin-bottom: 8mm;
  }
  .recipient-name {
    font-size: 24pt;
    color: #0f172a;
    font-weight: bold;
    margin-bottom: 10mm;
  }
  .qualification {
    font-size: 16pt;
    color: #1e3a5f;
    font-weight: bold;
    margin-bottom: 5mm;
  }
  .qualification-detail {
    font-size: 11pt;
    color: #64748b;
    margin-bottom: 15mm;
    line-height: 1.8;
    max-width: 150mm;
  }
  .cert-details {
    display: flex;
    gap: 15mm;
    margin-bottom: 15mm;
    font-size: 10pt;
  }
  .detail-box {
    border: 1px solid #e2e8f0;
    padding: 3mm 6mm;
    border-radius: 2mm;
  }
  .detail-label {
    color: #94a3b8;
    font-size: 8pt;
  }
  .detail-value {
    color: #334155;
    font-weight: bold;
    margin-top: 1mm;
  }
  .footer-band {
    width: 100%;
    padding: 8mm 25mm;
    background: #f8fafc;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e2e8f0;
    box-sizing: border-box;
  }
  .issuer {
    font-size: 11pt;
    color: #334155;
    font-weight: bold;
  }
  .verify-text {
    font-size: 8pt;
    color: #94a3b8;
  }
</style>
</head>
<body>
<div class="certificate">
  <div class="header-band">
    <div class="header-text">Professional Certification</div>
  </div>
  <div class="body-content">
    <div class="cert-title">認 定 証</div>
    <div class="divider"></div>
    <div class="conferral-text">以下の者が所定の要件を満たしたことを認定します</div>
    <div class="recipient-name">{{name}}</div>
    <div class="qualification">{{qualification_name}}</div>
    <div class="qualification-detail">{{qualification_detail}}</div>
    <div class="cert-details">
      <div class="detail-box">
        <div class="detail-label">認定番号</div>
        <div class="detail-value">{{cert_number}}</div>
      </div>
      <div class="detail-box">
        <div class="detail-label">認定日</div>
        <div class="detail-value">{{issue_date}}</div>
      </div>
      <div class="detail-box">
        <div class="detail-label">有効期限</div>
        <div class="detail-value">{{expiry_date}}</div>
      </div>
    </div>
  </div>
  <div class="footer-band">
    <div class="issuer">{{organization}}</div>
    <div class="verify-text">Verify at: {{verify_url}}</div>
  </div>
</div>
</body>
</html>

カスタマイズポイント:

header-band の色をブランドに合わせて変更
detail-box に追加フィールド（レベル、スコアなど）を追加可能
縦向き（portrait）なのでA4用紙にそのまま印刷可能
QRコードを footer-band に配置すれば検証リンクを埋め込める

テンプレートのAPI連携

curlでのレンダリング

# テンプレートファイルを読み込んでAPIに送信
HTML=$(cat certificate-template.html)
curl -X POST https://pdf.funbrew.cloud/api/pdf/generate \
  -H "Authorization: Bearer sk-your-api-key" \
  -H "Content-Type: application/json" \
  -d "{
    \"html\": $(echo "$HTML" | jq -Rs .),
    \"options\": {
      \"page-size\": \"A4\",
      \"orientation\": \"landscape\"
    }
  }" \
  --output certificate.pdf

Node.jsでのバッチ発行

const fs = require('fs');
const Handlebars = require('handlebars');

async function batchGenerateCertificates(recipients) {
  const templateHtml = fs.readFileSync('certificate-template.html', 'utf-8');
  const template = Handlebars.compile(templateHtml);

  for (const recipient of recipients) {
    const html = template({
      name: recipient.name,
      course_name: recipient.course,
      date: new Date().toLocaleDateString('ja-JP'),
      organization: 'テック株式会社'
    });

    const response = await fetch('https://pdf.funbrew.cloud/api/pdf/generate', {
      method: 'POST',
      headers: {
        'Authorization': `Bearer ${process.env.PDF_API_KEY}`,
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        html,
        options: { 'page-size': 'A4', 'orientation': 'landscape' }
      })
    });

    const pdf = await response.arrayBuffer();
    fs.writeFileSync(`certificates/${recipient.id}.pdf`, Buffer.from(pdf));
  }
}

Pythonでのバッチ発行

import requests
from jinja2 import Template

def batch_generate(recipients, template_path):
    with open(template_path) as f:
        template = Template(f.read())

    for recipient in recipients:
        html = template.render(
            name=recipient['name'],
            course_name=recipient['course'],
            date='2026年4月16日',
            organization='テック株式会社'
        )

        response = requests.post(
            'https://pdf.funbrew.cloud/api/pdf/generate',
            headers={
                'Authorization': f'Bearer {API_KEY}',
                'Content-Type': 'application/json',
            },
            json={
                'html': html,
                'options': {'page-size': 'A4', 'orientation': 'landscape'}
            }
        )

        with open(f"certificates/{recipient['id']}.pdf", 'wb') as f:
            f.write(response.content)

バッチ処理のベストプラクティス（並列度制御、エラーハンドリング、リトライ）についてはPDF一括生成ガイドを参照してください。

テンプレートカスタマイズのヒント

フォントの選択

証明書のフォーマル度に合わせてフォントを選びましょう。

用途	推奨フォント	理由
修了証・賞状	Noto Serif JP、游明朝	格式高い印象
参加証・認定証	Noto Sans JP、ヒラギノ角ゴ	モダンで読みやすい
英語テンプレート	Times New Roman、Georgia	国際標準的なフォーマル感

日本語フォントの詳しい設定方法は日本語フォントガイドを参照してください。

カラーパレット

テイスト	メインカラー	アクセント	背景
フォーマル（紺）	#1a365d	#c4a35a（金）	#fff
フォーマル（黒）	#0f172a	#c4a35a（金）	#fefcf3
モダン（青）	#2563eb	#7c3aed（紫）	#fff
ナチュラル（緑）	#166534	#d4a574（茶）	#fafaf5

用紙サイズと向き

証明書タイプ	推奨サイズ	向き
修了証・賞状・ディプロマ	A4	横（landscape）
資格証明書・認定証	A4	縦（portrait）
参加証（カード型）	A5	横（landscape）

APIの options パラメータで指定:

{
  "options": {
    "page-size": "A4",
    "orientation": "landscape"
  }
}

CSSの改ページ制御

1枚の証明書が1ページに収まるように制御します。複数証明書を1つのPDFに含める場合:

.certificate {
  page-break-after: always;
}
.certificate:last-child {
  page-break-after: avoid;
}

CSSの改ページ制御について詳しくはHTML→PDF CSSスニペット集を参照してください。

よくある質問

テンプレートのフォントが正しく表示されない場合は？

サーバーサイドでレンダリングする場合、ローカルフォントが利用できないことがあります。Google Fonts等のWebフォントを @import で読み込むか、フォントファイルをBase64エンコードして埋め込むことで解決できます。詳しくは日本語フォントガイドを参照してください。

証明書にQRコードを埋め込むには？

QRコードの画像URLを <img> タグで配置します。QRコード生成にはqrcode.jsなどのライブラリを使うか、外部APIで生成した画像を使用します。テンプレート4の qr-placeholder を <img src="{{qr_url}}" width="25mm" height="25mm"> に置き換えてください。

大量の証明書を効率的に生成するには？

100件以上の証明書を生成する場合は、並列度を制御し、キューシステム（Redis、SQS等）と組み合わせることを推奨します。詳しくはPDF一括生成ガイドと本番環境ガイドを参照してください。

テンプレートをA3やLetterサイズに変更できますか？

はい。@page ルールの size と APIの options.page-size を変更するだけで対応できます。例: size: A3 landscape; / "page-size": "A3"。

まとめ

この記事で紹介した5種類のテンプレートをベースに、自社のブランドや用途に合わせてカスタマイズできます。

テンプレート	用途	向き
修了証	研修・コース修了	横
賞状	表彰・コンテスト	横
ディプロマ	卒業・学位	横
参加証	セミナー・カンファレンス	横
認定証	資格・プロフェッショナル認定	縦

FUNBREW PDFのAPIを使えば、これらのテンプレートをサーバーサイドでレンダリングし、バッチ発行まで自動化できます。まずはPlaygroundでテンプレートを試してみてください。

証明書PDF自動生成ガイド — テンプレート設計からバッチ発行まで
PDF一括生成ガイド — 大量PDF生成のベストプラクティス
PDFテンプレートエンジン活用ガイド — Handlebars・Jinja2でデータバインディング
HTML→PDF CSSスニペット集 — 改ページ・余白・フォント制御
日本語フォントガイド — PDF生成での日本語フォント対策
言語別クイックスタート — curl・Python・Node.js・PHPの実装例

テンプレートの使い方

1. HTMLをコピーする

2. データを差し替える

3. PDF APIでレンダリングする

テンプレート1: 研修修了証

テンプレート2: 賞状・表彰状

テンプレート3: ディプロマ（学位・卒業証書）

テンプレート4: イベント参加証

テンプレート5: 資格・認定証明書

テンプレートのAPI連携

curlでのレンダリング

Node.jsでのバッチ発行

Pythonでのバッチ発行

テンプレートカスタマイズのヒント

フォントの選択

カラーパレット

用紙サイズと向き

CSSの改ページ制御

よくある質問

テンプレートのフォントが正しく表示されない場合は？

証明書にQRコードを埋め込むには？

大量の証明書を効率的に生成するには？

テンプレートをA3やLetterサイズに変更できますか？

まとめ

関連記事