Aller au contenu principal

Du PDF brut au PDF personnalisé : ajoutez des en-têtes et des pieds de page HTML avec n8n ! (Aucune fusion nécessaire)

· 9 minutes de lecture
SEO and Content Writer

Si vous utilisez n8n pour l'automatisation, en ajoutant En-têtes et pieds de page HTML Intégrer des éléments à vos PDF est simple : quatre nœuds, aucune ligne de code. Ce guide vous montre comment configurer un flux de travail n8n qui télécharge un PDF depuis Dropbox, ajoute votre en-tête ou pied de page personnalisé à l’aide de PDF4me, puis réimporte le fichier personnalisé. Vous collez directement le code HTML dans le Ajouter un en-tête et un pied de page HTML au PDF Node, aucun fichier d'en-tête séparé n'est nécessaire.

Ce dont vous avez besoin

  • n8n: Auto-hébergé ou n8n CloudAjoutez le nœud PDF4me depuis le panneau de nœuds n8n.
  • Clé API PDF4me: Obtenez votre clé API PDF4me (Inscription gratuite). Première visite ? Suivez-nous Connectez PDF4me à n8n.
  • DropboxNous utilisons Dropbox pour le téléchargement et l'envoi. Vous pouvez l'utiliser. Google Drive, OneDriveou tout nœud permettant l'entrée/sortie de fichiers binaires. En remplaçant les nœuds par les bons, le flux reste inchangé.

Aperçu du flux

Votre flux de travail n8n s'exécute sur quatre nœuds :

  1. Déclenchement: Lorsque vous cliquez sur « Exécuter le flux de travail » (manuel) pour les tests, ou un déclencheur automatisé (par exemple Dropbox, webhook) lorsqu'un nouveau fichier apparaît.
  2. Télécharger un fichier (Dropbox) : Récupère le PDF à partir d’un chemin. La sortie est placée dans un champ binaire (par exemple, . data).
  3. Ajouter un en-tête et un pied de page HTML au PDF (PDF4me) : Prend le fichier binaire PDF, y colle votre code HTML et l’applique comme en-tête ou pied de page. Envoie le PDF modifié dans un nouveau champ binaire (par exemple, `<html>`). document).
  4. Téléverser un fichier (Dropbox) : Enregistre le PDF modifié dans un dossier portant le nom de votre choix.

Aucune étape de fusion : le nœud « Ajouter un en-tête/pied de page HTML » génère directement le nouveau PDF. Même fichier, personnalisé ; vous pouvez changer le nom si vous le souhaitez.

Flux de travail n8n : Lorsque vous cliquez sur Exécuter le flux de travail → Télécharger un fichier → Ajouter un en-tête et un pied de page HTML au PDF → Téléverser un fichier

Étape 1 : Déclencher + Télécharger un fichier

Ajoutez un déclencheur et le Dropbox Télécharger un fichier nœud permettant de charger le PDF dans le flux de travail.

  1. Ajouter un déclencheur: Lorsque vous cliquez sur « Exécuter le flux de travail » pour des tests, ou par exemple Dropbox Déclencher lors de la création d'un fichier.
  2. Ajouter Télécharger un fichier (Dropbox)
  • Identifiant pour se connecter avecVotre compte Dropbox.
  • Ressource: Fichier | Opération: Télécharger.
  • Chemin du fichier: Chemin complet vers votre PDF, par exemple : /Blog Data/sample_3_page.pdf.
  • Placez le fichier de sortie dans le champ: data (ou un autre nom, vous y ferez référence dans le nœud suivant).
n8n Téléchargez le fichier : Chemin d'accès /Blog Data/sample_3_page.pdf, placez le fichier de sortie dans le champ data

Exécutez le nœud. La sortie inclura 1 article avec le PDF dans le data champ binaire.


Étape 2 : Ajouter un en-tête et un pied de page HTML au PDF

Ajoutez le PDF4me nœud et sélectionner ModifierAjouter un en-tête et un pied de page HTML à un PDFCollez votre code HTML, définissez son emplacement (en-tête ou pied de page) et ses marges.

  1. Ajouter un nœud PDF4meModifierAjouter un en-tête et un pied de page HTML à un PDF.
  2. Identifiant pour se connecter avecVotre compte PDF4me.
  3. Type de données d'entrée: Données binaires.
  4. Champ binaire d'entrée: data (identique à celui du nœud de téléchargement) Placez le fichier de sortie dans le champ).
  5. Contenu HTML (obligatoire) : Collez votre code HTML d’en-tête ou de pied de page. Exemple :
<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>
  1. Emplacement: En-tête ou Pied de page.
  2. Pages: all ou une gamme comme 1-3 (pages 1 à 3).
  3. Passer la première pageDésactivé pour appliquer à toutes les pages ; activé pour ignorer la première page.
  4. Marges (Px): n8n utilise pixels. Exemple: Marge gauche 5, Marge droite 5, Marge supérieure 10, Marge inférieure 10.
  5. Nom du fichier de sortiepar exemple document_with_html_header_footer.pdf.
  6. Nom du documentpar exemple document.pdf (référence de la source).
  7. Nom de la sortie de données binaires: document (le champ que le nœud Upload lira).
n8n Ajouter un en-tête et un pied de page HTML à un PDF : Données de champ binaire, contenu HTML, en-tête d'emplacement, pages 1 à 3, marges en pixels

Exécutez le nœud. La sortie inclut le PDF modifié dans le document champ binaire (la taille du fichier augmente, par exemple 2,54 ko → 70,3 ko).


Étape 3 : Téléverser un fichier

Enregistrez le PDF modifié dans Dropbox.

  1. Ajouter un fichier à télécharger (Dropbox)
  • Identifiant pour se connecter avecMême compte Dropbox.
  • Ressource: Fichier | Opération: Télécharger.
  • Chemin du fichier: Chemin complet incluant le nom du fichier, par exemple : /Blog Data/Header_Added_Output.pdf.
  • Fichier binaire: Sur.
  • Champ binaire d'entrée: document (à partir du nœud Ajouter un en-tête/pied de page HTML). Ne pas utiliser data, voici le PDF original.
n8n Téléverser un fichier : Chemin du fichier /Blog Data/Header_Added_Output.pdf, Champ binaire d'entrée document

Exécutez le flux de travail. Le fichier Header_Added_Output.pdf (ou le nom que vous avez choisi) apparaîtra dans Dropbox avec l'en-tête ou le pied de page appliqué.


Exemples d'extraits HTML : Copier et utiliser dans n8n

Ces Compatible avec les PDF les extraits fonctionnent dans le Contenu HTML Champ. Développez n'importe quel bloc ci-dessous pour copier et coller.

En-têtes

Tableau à deux colonnes (Auteur, Date, Révision)Right column aligned; replace with your text or n8n expressions.
<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>
Ligne simple centrée
<div style="text-align: center; font-family: Arial, sans-serif; font-size: 12px; color: #333333;">Document Title - Confidential</div>

Pieds de page

Juridique / confidentiel
<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>
Numéro de page uniquementUse {{page}} and {{total}}; PDF4me replaces them per page.
<div style="text-align: center; font-family: Arial, sans-serif; font-size: 10px;">Page {{page}} of {{total}}</div>

Avant de coller du code HTML : une liste de vérification rapide

  • CSS en ligne: Utiliser style="..." sur les éléments. Les feuilles de style externes ne sont pas appliquées.
  • Table ou blocs simples: Utiliser <table> ou des divs avec des éléments explicites width pour une disposition stable.
  • Unités: Les paramètres de marge de n8n sont dans pixels (Px)Dans le code HTML, utilisez px ou %.
  • Tester d'abordCollez votre extrait de code dans le Ajouter un en-tête et un pied de page HTML à un PDF tester avant de le câbler à n8n.
Essayez-le dans le testeur d'API

Collez n'importe quel extrait de code ci-dessus dans le Ajouter un en-tête et un pied de page HTML à un PDFTesteur avec un exemple de PDF et votre clé API. Chaque bloc de code est prêt à être copié.


Où l'utiliser : n8n vs Make vs Power Automate vs API

  1. n8nUtilisez la procédure ci-dessus : Télécharger → Ajouter un en-tête et un pied de page HTML au PDF → Téléverser. Marges dans pixels.
  2. Faire: Ajouter un en-tête et un pied de page HTML dans Make. Marges dans millimètres.
  3. Power Automate: Ajouter un en-tête et un pied de page HTML dans Power AutomateUtilise un fichier d'en-tête distinct de celui de Dropbox.
  4. API: Appel POST /api/v2/AddHtmlHeaderFooter avec docContent, Nom du document, htmlContenu, et emplacement.

Le même code HTML fonctionne partout.


Prochaines étapes