从普通PDF到品牌化PDF：在n8n中添加HTML页眉和页脚！（无需合并）

如果你正在使用 n8n 为了实现自动化，添加 HTML页眉和页脚 为您的 PDF 文件添加自定义页眉或页脚非常简单，只需四个节点，无需编写代码。本指南将向您展示如何设置一个 n8n 工作流程，该流程从 Dropbox 下载 PDF 文件，使用 PDF4me 添加自定义页眉或页脚，然后将添加品牌标识的文件上传回 Dropbox。您可以直接将 HTML 代码粘贴到…… 向 PDF 添加 HTML 页眉/页脚 节点，无需单独的头文件。

你需要什么​

• n8n自托管或 n8n 云从 n8n 节点面板添加 PDF4me 节点。
• PDF4me API密钥： 获取您的 PDF4me API 密钥 （免费开始）。第一次？请关注 将 PDF4me 连接到 n8n。
• Dropbox我们使用 Dropbox 进行下载和上传。您可以使用 Google 云端硬盘， OneDrive或者任何提供二进制文件输入/输出的节点。替换成正确的节点，流程保持不变。

流程概览​

您的 n8n 工作流在四个节点上运行：

1. 扳机： 点击“执行工作流”时 （手动）用于测试，或者当出现新文件时自动触发（例如 Dropbox、webhook）。
2. 下载文件 （Dropbox）：从指定路径获取 PDF 文件。输出结果存储在二进制字段中（例如 . data）。
3. 向 PDF 添加 HTML 页眉/页脚 (PDF4me)：读取 PDF 二进制文件，粘贴您的 HTML 代码，并将其应用为页眉或页脚。将修改后的 PDF 输出到新的二进制字段（例如，<filename>.pdf）。 document）。
4. 上传文件 （Dropbox）：将修改后的 PDF 文件保存到您选择的文件夹中。

无需合并步骤，“添加 HTML 页眉/页脚”节点会直接输出新的 PDF 文件。文件内容相同，只是添加了品牌标识；如果需要，可以更改文件名。

步骤 1：触发 + 下载文件​

添加触发器和 Dropbox 下载文件 将 PDF 文件加载到工作流中的节点。

1. 添加触发器： 点击“执行工作流”时 用于测试，例如： Dropbox 文件创建时触发。
2. 添加下载文件 （Dropbox）

• 用于连接的凭证您的 Dropbox 帐户。
• 资源文件 | 手术： 下载。
• 文件路径：PDF 文件的完整路径，例如： /Blog Data/sample_3_page.pdf。
• 将输出文件放入字段： data （或者其他名称，您将在下一个节点中引用它）。

运行节点。输出结果将包括 1 件 PDF 文件中包含该文件。 data 二进制字段。

步骤 2：向 PDF 添加 HTML 页眉/页脚​

添加 PDF4me 节点和选择 编辑 → 向 PDF 添加 HTML 页眉/页脚粘贴您的 HTML 代码，设置位置（页眉或页脚）和边距。

1. 添加 PDF4me 节点 → 编辑 → 向 PDF 添加 HTML 页眉/页脚。
2. 用于连接的凭证您的 PDF4me 帐户。
3. 输入数据类型二进制数据。
4. 输入二进制字段： data （与下载节点相同） 将输出文件放入字段）。
5. HTML 内容 （必填）粘贴您的页眉或页脚 HTML 代码。例如：

<div style="width:100%; font-family: Segoe UI, Arial, sans-serif; color:#333; padding:12px 18px 8px 18px; box-sizing:border-box;">
 <table style="width:100%; border-collapse:collapse;">
 <tr>
 <td>Your Company Name</td>
 <td style="text-align:right;">Document Title | Page {{page}} of {{total}}</td>
 </tr>
 </table>
</div>

6. 地点： 标题 或者 页脚。
7. 页： all 或者一个类似这样的范围 1-3 （第 1 至 3 页）
8. 跳过第一页关闭可应用于所有页面；开启可跳过第一页。
9. 边距（Px）n8n 使用 像素。 例子： 左边距 5、 右边距 5、 边距顶部 10、 边际底部 10.
10. 输出文件名例如 document_with_html_header_footer.pdf。
11. 文档名称例如 document.pdf （来源参考）
12. 二进制数据输出名称： document （上传节点将读取的字段）。

运行该节点。输出结果包含修改后的 PDF 文件。 document 二进制字段（文件大小增加，例如 2.54 kB → 70.3 kB）。

步骤 3：上传文件​

将修改后的PDF文件保存回Dropbox。

1. 添加上传文件 （Dropbox）

• 用于连接的凭证同一个 Dropbox 帐户。
• 资源文件 | 手术上传。
• 文件路径：包含文件名在内的完整路径，例如： /Blog Data/Header_Added_Output.pdf。
• 二进制文件： 在。
• 输入二进制字段： document （来自“添加 HTML 页眉/页脚”节点）。请勿使用 data这是原始的PDF文件。

运行工作流程。文件 Header_Added_Output.pdf （或您选择的名称）将显示在 Dropbox 中，并应用页眉或页脚。

HTML 代码片段示例：复制并用于 n8n​

这些 PDF友好 代码片段在以下情况下有效： HTML 内容 字段。展开下方任意代码块即可复制粘贴。

标题​

<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>

<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: 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 {{page}} of {{total}}</div>

粘贴 HTML 代码前：快速检查清单​

• 内联 CSS： 使用 style="..." 元素上。不应用外部样式表。
• 表格或简单方块： 使用 <table> 或者带有明确说明的 div 元素。 width 为了布局稳定。
• 单位n8n 的边距设置位于 像素（Px）在 HTML 中，使用 px 或者 %。
• 先测试将您的代码片段粘贴到 向 PDF 添加 HTML 页眉/页脚 在将其连接到 n8n 之前进行测试。

提示：在 API 测试器中尝试一下

将上面的任意代码片段粘贴到 API 测试器中 向 PDF 添加 HTML 页眉/页脚测试人员会提供一个示例 PDF 文件和您的 API 密钥。每个代码块都可直接复制。 :::

应用场景：n8n、Make、Power Automate 和 API 的对比​

1. n8n使用上述流程：下载 → 向 PDF 添加 HTML 页眉/页脚 → 上传。边距 像素。
2. 制作： 在 Make 中添加 HTML 页眉页脚边距 毫米。
3. 动力自动化： 在 Power Automate 中添加 HTML 页眉/页脚使用来自 Dropbox 的单独头部文件。
4. API： 称呼 POST /api/v2/AddHtmlHeaderFooter 和 文档内容， 文档名称， html内容， 和 地点。

相同的HTML代码在任何地方都能运行。

后续步骤​

• 运行工作流程按照以上三个步骤操作，将代码片段粘贴到 HTML 内容并执行。
• 尝试使用 API使用 向 PDF 添加 HTML 页眉/页脚 测试工具，用于预览您的 HTML 代码。
• 阅读n8n文档： 向 PDF 添加 HTML 页眉页脚 (n8n) 完整参数请见此处。
• 完整 API 参考： 向 PDF 添加 HTML 页眉/页脚（PDF4me API）。