Power Automate の HTML ヘッダーとフッターを使用して、すべての PDF ページにロゴとメタデータを挿入しましょう！

追加する 会社ロゴ、 ドキュメントメタデータ （著者、日付、改訂）または 顧客固有のフッター Power Automate を使用して PDF を作成する方法。コードは不要です。このガイドでは、 完全な5ステップの流れ （トリガー → PDFを取得 → ヘッダーファイルを取得 → PDFにHTMLヘッダーフッターを追加 → ファイルを作成） 各ステップのスクリーンショット、 それから サンプルHTMLスニペット ブランディング、ページ番号、顧客ごとのフッターなどにコピーして使用できます。 ユースケース レポートヘッダーや再利用可能なテンプレートなど。

Power AutomateでHTMLヘッダー/フッターを追加する：5つのステップ​

Power Automate での全体の流れは以下のとおりです。 トリガー → パスを使用してPDFファイルを取得する (Dropbox) → パスを使用してヘッダーファイルの内容を取得します (Dropbox) → PDFにHTMLヘッダー/フッターを追加する (PDF4me) → ファイルを作成する （Dropbox）。以下の手順名とパラメータはすべて、スクリーンショットのUIと一致しています。

前後： 入力PDFはシンプルな文書（例：「サンプルPDF文書 1ページ目…」）です。処理フローの実行後、同じPDFに、ヘッダーファイルから取得した文書の種類、ID、タイトル、作成者、日付、改訂履歴を含むHTMLヘッダーが追加されます。

入力PDF

出力PDF

ステップ1：フローをトリガーする​

追加 フローを手動でトリガーする （テスト用）または別のトリガー（例：フォルダ内にファイルが作成されたとき）。設定するパラメータはありません。

ステップ2：指定されたパス（Dropbox）を使用してPDFファイルを取得する​

この手順では、ヘッダーまたはフッターを追加したいPDFファイルを読み込みます。

1. アクションを追加 → Dropbox → ファイルの内容を取得する （またはパスでファイルを取得するアクション。スクリーンショットでは、 パスを使用してPDFファイルを取得する)
2. パラメータ（スクリーンショットから事実確認済み）：

• ファイルパス （必須）：Dropbox 内の PDF への完全なパス、例: /pdf4metest/add html header footer to pdf/sample_3_page.pdf必要に応じて、フォルダアイコンを使用して参照してください。
• 開ける 詳細パラメータ → セット コンテンツタイプを推測する に はい。

3. 一番下： Dropboxに接続しました。 使用 接続参照を変更する アカウントを切り替える必要がある場合。

ステップ3：パス（Dropbox）を使用してヘッダーファイルの内容を取得する​

この手順では、ヘッダー (またはフッター) の HTML を読み込みます。PDF に適した HTML をファイル (例: Header.htmlDropboxに保存して、こちらでお読みください。

1. アクションを追加 → Dropbox → ファイルの内容を取得する （または パスを使用してヘッダーファイルの内容を取得します （スクリーンショット参照）。
2. パラメータ（スクリーンショットから事実確認済み）：

• ファイルパス (必須): HTML ファイルへのパス、例: /pdf4metest/add html header footer to pdf/Header.html。
• 詳細パラメータ → コンテンツタイプを推測する: はい。

3. Dropboxに接続しました。 一番下。

ステップ4：PDFにHTMLヘッダー/フッターを追加する（PDF4me）​

これが核心となるステップです。PDFとHTMLを受け取り、ヘッダー（またはフッター）が適用された新しいPDFを出力します。

1. アクションを追加 → PDF4me → PDFにHTMLヘッダー/フッターを追加する。
2. パラメータ（スクリーンショットから事実確認済み）：

• ファイルの内容 （必須）：出力先を選択してください パスを使用してPDFファイルを取得する （ステップ2で得られたPDFバイナリファイル）
• ファイル名例： Test.pdf （または、ソースとなるPDFファイルの名前）
• HTMLコンテンツ （必須）：出力先を選択してください パスを使用してヘッダーファイルの内容を取得します （ステップ3のHTML）
• 位置: ヘッダ （または フッター フッターを追加する場合）。
• ページ: 全て つまり、ヘッダー/フッターはすべてのページに適用されます。
• 最初のページをスキップする: いいえ 最初のページにもヘッダーを表示したい場合は、次のように設定してください。 はい スキップする。
• 上余白 (px)例： 15 （ピクセル）。 左余白、 右余白、 そして マージンボトム 必要に応じて空にするか設定してください。

3. 一番下： PDF4meに接続しました。 使用 PDF4me APIキー 接続を作成する際。

ステップ5：ファイルを作成する（Dropbox）​

「HTMLヘッダー/フッターの追加」ステップで生成されたPDFファイルをDropbox（または別のフォルダ）に保存してください。

1. アクションを追加 → Dropbox → ファイルを作成する。
2. パラメータ（スクリーンショットから事実確認済み）：

• フォルダパス （必須）：例 /pdf4metest/add html header footer to pdf。
• ファイル名 （必須）：例 Test_Output.pdf。
• ファイルの内容 （必須）：選択してください 出力 から PDFにHTMLヘッダー/フッターを追加する （修正されたPDFファイル）。Get PDFの出力ファイル（元のファイル）は使用しないでください。新しいファイルはPDF4meアクションで生成されたファイルです。

3. Dropboxに接続しました。 一番下。

フローを実行します。新しいファイル (例: Test_Output.pdf）HTML ヘッダーまたはフッターが適用されているフォルダー内。アクションの詳細については、以下を参照してください。 Power AutomateでPDFにHTMLヘッダー/フッターを追加する。

サンプルHTMLスニペット：コピー＆テスト​

これらを使用してください PDF対応 の断片 HTMLヘッダー/フッターAPIテスターを追加 またはPower Automate。 以下のコードスニペットを展開して、コードを表示およびコピーしてください。必要な時までリストを短く保ちます。

ヘッダー​

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 11px;">
 <tr>
 <td style="width: 50%; vertical-align: top;"></td>
 <td style="width: 50%; text-align: right; vertical-align: top;">
 Author: Per Nordqvist<br/>
 Date: 2025-11-12<br/>
 Revision: 4.24
 </td>
 </tr>
</table>

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 11px;">
 <tr>
 <td style="width: 50%; vertical-align: top;">Document title</td>
 <td style="width: 50%; text-align: right;">
 Author: Your Name | Date: 2025-11-12 | Page 1 of 5
 </td>
 </tr>
</table>

<div style="text-align: center; font-family: Arial, sans-serif; font-size: 12px; color: #333333;">Document Title - Confidential</div>

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 11px;">
 <tr>
 <td style="width: 25%; vertical-align: middle;">[Logo]</td>
 <td style="width: 50%; text-align: center; vertical-align: middle;">Project Report 2025</td>
 <td style="width: 25%; text-align: right; vertical-align: middle;">2025-11-12 | v1.0</td>
 </tr>
</table>

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 12px; border-bottom: 1px solid #cccccc;">
 <tr>
 <td style="padding: 4px 0;">Technical Specification</td>
 <td style="text-align: right; padding: 4px 0;">Revision 4.24</td>
 </tr>
</table>

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif;">
 <tr>
 <td style="font-size: 14px; font-weight: bold;">Quarterly Report Q4 2025</td>
 </tr>
 <tr>
 <td style="font-size: 10px; color: #666666;">Prepared by Finance Team</td>
 </tr>
</table>

<div style="text-align: right; font-family: Arial, sans-serif; font-size: 10px;">Author: Jane Doe<br/>Date: 2025-11-12<br/>Doc ref: DR-2025-001</div>

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 11px;">
 <tr>
 <td style="width: 70%; vertical-align: top;">Contract Agreement</td>
 <td style="width: 30%; text-align: right; vertical-align: top;">Revision 4.24 | 2025-11-12</td>
 </tr>
</table>

<div style="text-align: center; font-family: Arial; font-size: 12px; color: #FF0000;">Document Header PDF4me</div>

フッター​

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 9px; color: #666666;">
 <tr>
 <td style="text-align: center; padding: 4px 0;">Confidential. For internal use only. All rights reserved.</td>
 </tr>
</table>

<div style="text-align: center; font-family: Arial, sans-serif; font-size: 10px;">Page 1 of 5</div>

<div style="font-family: Arial, sans-serif; font-size: 8px; color: #888888; text-align: center;">This document is provided as-is. No warranty.</div>

HTMLを送信する前に：チェックリスト​

:::ヒント 開発環境でテストしてください 上記のコードスニペットを貼り付けて htmlコンテンツ の分野 PDFにHTMLヘッダー/フッターを追加する テスター、API キーとサンプル PDF を追加して、 ヘッダ または フッター各コードブロックは、コピーする単一の選択範囲です。 :::

会社ロゴ、顧客固有のフッター、および追加情報​

同じ Add HTML Header Footer API を使用して、 会社ロゴ ヘッダーでは、 顧客ごとに異なるフッター情報、 そして 追加フィールド (請求書番号、プロジェクトコード、アカウントID) データから HTML を構築して渡すことで htmlコンテンツ。

ヘッダーまたはフッターに会社ロゴを入れる​

API は以下をサポートします 埋め込み画像 HTML で使用します。 <img> タグ 公開URL または Base64データURI ロゴはヘッダーまたはフッターに表示されます。レイアウトがPDF形式に対応できるよう、画像は小さく、表の中に配置してください。

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 11px;">
 <tr>
 <td style="width: 80px; vertical-align: middle; padding-right: 12px;">
 <img src="https://your-domain.com/logo.png" alt="Logo" style="max-width: 72px; max-height: 36px; display: block;" />
 </td>
 <td style="vertical-align: middle;">
 <strong>Your Company Name</strong><br/>
 <span style="font-size: 9px; color: #666666;">Tagline or document type</span>
 </td>
 </tr>
</table>

顧客ごとのフッター情報​

PDFを生成する場合 複数の顧客追加できます それぞれ異なるフッター情報 顧客データまたはドキュメントデータから HTML 文字列を構築します。Power Automate では、「各項目に適用」の変数 (顧客名、アカウント ID、ドキュメント参照など) を使用します。コードでは、[HTML ヘッダー フッターの追加] を呼び出す前に、リストまたは API レスポンスから文字列を構築します。

<table style="width: 100%; border-collapse: collapse; font-family: Arial, sans-serif; font-size: 9px; color: #666666;">
 <tr>
 <td style="text-align: center; padding: 4px 0;">
 Prepared for: Customer Name | Account: ACC-12345 | Doc ref: INV-2025-001
 </td>
 </tr>
</table>

追加情報​

含めることができます 追加情報 ヘッダーまたはフッターに、請求書番号、PO番号、プロジェクトコード、部門、改訂、またはカスタムテキストを表示します。同じアプローチを使用します。フロー、リスト、またはデータベースからこれらの値を含む単一のHTML文字列を作成し、それを渡します。 htmlコンテンツPDFとの互換性を保つため、構造はシンプルに保ちます（テーブルまたはインラインスタイルを使用したdiv要素）。上記の例のように、ロゴや顧客固有の行と組み合わせます。

使用場所：Power Automate vs API​

ヘッダーとフッターを追加する方法は2つあります。

1. パワーオートマタ: 使用する PDFにHTMLヘッダー/フッターを追加する アクション。PDF を ファイルの内容HTML は HTMLコンテンツ、そして選択する ヘッダ、 フッター、 または 両方。 セット ページ （例えば。 all必要に応じてマージンも調整します。
2. API： 電話 POST /api/v2/AddHtmlHeaderFooter と ドキュメントコンテンツ (Base64 PDF) ドキュメント名、 htmlコンテンツ （プレーンなHTML） 位置 （ヘッダー、フッター、または両方）。オプション： ページ、 skipFirstPage、およびマージンパラメータ。

どちらの場所でも同じHTMLを使用してください。この記事に掲載されているコードスニペットはどちらの場所でも機能します。

高度なユースケース​

ここに 高度なユースケース HTMLのヘッダーとフッターの場合：

次のステップ​

• APIを試してみてくださいHTMLとサンプルPDFを貼り付けてください PDFにHTMLヘッダー/フッターを追加する テスターを実行して出力を比較する。
• Power Automateで配線する： フォローする Power AutomateでPDFにHTMLヘッダー/フッターを追加する そして、同じHTMLスニペットを使用します。
• APIの全文を読む: PDFにHTMLヘッダー/フッターを追加する（PDF4me API） すべてのパラメータ（余白、ページ、非同期）について。