• Englisch
  • Docs
  • Wissensdatenbank
  • F.A.Q
  • Forum
  • Medien
  • Kurse
  • Marktplatz
  • Login
  • Try for free
  • Englisch
  • Docs
  • Wissensdatenbank
  • F.A.Q
  • Forum
  • Medien
  • Kurse
  • Marktplatz
  • Login
  • Try for free
home/Wissensdatenbank/Plugins/Erstellen Sie eine PDF-Vorlage über das Plugin

Erstellen Sie eine PDF-Vorlage über das Plugin

Written by Daniel
Juli 24, 2024

Voraussetzungen

  • Installiertes und konfiguriertes PDF-Plugin auf Ihrer Simplifier-Instanz (eine Installationsanleitung finden Sie in unserer Dokumentation). Wenn das PDF-Plugin aktiv ist, ist es in der Plugin-Listenübersicht verfügbar:
  • Eine Benutzerrolle mit Berechtigungen zum Verwalten und Generieren von Vorlagen , die dem Benutzer zugewiesen ist, der mit dem PDF-Plugin arbeitet.
    • Vorlagen verwalten berechtigt zum Erstellen/Bearbeiten und Löschen neuer PDF-Vorlagen.
    • Vorlagen generieren gibt die Berechtigung, das Plugin für die PDF-Generierung zu verwenden .
      Diese Berechtigung muss erteilt werden, um eine PDF-Datei innerhalb einer Anwendung zu erstellen.

Schritt 1 – Erstellen einer neuen Vorlage

Um eine neue Vorlage zu erstellen, gehen Sie einfach folgendermaßen vor:

  1. Rufen Sie die Benutzeroberfläche des PDF-Plugins auf, indem Sie im Hauptmenü auf den Eintrag “Plugins” klicken und dann in der Plugin-Listenübersicht auf den Eintrag “pdfPlugin” doppelklicken (siehe Screenshot oben)
  2. Drücken Sie die ‘+’-Taste
  3. Ändern des Namens der Vorlage
  4. Retten

Daraufhin wird Ihre Vorlage in der Vorlagenliste angezeigt. Zu diesem Zeitpunkt verfügt Ihre Vorlage über einige Standardinhalte.

Bitte beachten Sie, dass die Vorlage manuell gespeichert werden muss.

Schritt 2 – Inhalte erstellen

Wenn nicht erwartet wird , dass Ihre Vorlage dynamische Daten anzeigt, die von einer Anwendung gesendet werden, können Sie Schritt 2.1 überspringen.

2.1 Hinzufügen von MockUp-Daten zur JSON-Vorschau

Da das PDF-Plugin zum Rendern von Daten aus Anwendungen konzipiert ist, fügen Sie einige Dummy-Daten ein, die den Daten ähneln, die Sie zum Generieren dieser Vorlage verwenden werden.

Beispiel:

{
  "data": [
    {
      "articleNumber": 124578,
      "price": "10,95 €",
      "title": "DummyArticle1",
      "available": true
    },
    {
      "articleNumber": 789456,
      "price": "21,50 €",
      "title": "DummyArticle2",
      "available": true
    },
    {
      "articleNumber": 613376,
      "price": "2,95 €",
      "title": "DummyArticle3",
      "available": false
    }
  ]
}

2.2 HTML-Inhalt definieren

Eine PDF-Vorlage wird mit HTML-Code erstellt, um zu definieren, was angezeigt werden soll und wie es gelayoutet wird. Auf Werte aus den JSON-Daten kann über den Lenker zugegriffen werden.

2.2.1 Körper

Der Hauptteil der Vorlage sollte sich im Hauptteil der Vorlage befinden. Sie können HTML-Code verwenden, um die Struktur zu definieren und sich für das Styling auf CSS-Klassen zu beziehen (siehe Schritt 2.3).

Beispiel:

<h2> List of articles</h2>

<span>This is a list of articles.</span><br>
<span>The text is static content meaning it's rendered everytime the template is used to create a PDF</span>

<p>The following items are dynamic content meaning they're only rendered if the data is send to the PDF plugin when create a PDF</p>

<table>
    <!--This part of the table is static-->
    <tr class="tableHeader">
       <td>Article number</td>
       <td>Title</td>
       <td>Price</td>
    </tr>

    <!--This part of the table is dynamic-->
    <!--for every item in our JSON one row will be rendered-->
    {{#data}}

       <!--only if available == true of entry-->
       {{#available}}
          <tr>
             <!--the value of every item is used and rendered-->
             <td>{{articleNumber}}</td>
             <td>{{title}}</td>
             <td>{{price}}</td>
          </tr>
       {{/available}}
    {{/data}}
</table>

2.2.2 Kopf- / Fußzeile

Wenn auf jeder Seite einer PDF-Datei eine Kopf- oder Fußzeile gerendert werden soll, können Sie den Inhalt in diesen beiden Registerkarten definieren. Wie im Hauptteil können Sie HTML und CSS verwenden, um den Inhalt zu definieren.

Derzeit gibt es eine Einschränkung: <! DOCTYPE html> muss vor jedem Inhalt eingefügt werden!

Beispiel:

<!DOCTYPE html> 
<hr> 
<span style="color: grey">My Company Name </span>

Wenn Sie Ihre Kopf-/Fußzeile dynamisch gestalten möchten, d.h. unterschiedliche Inhalte basierend auf der aktuellen PDF-Seite anzeigen möchten, können Sie HTML-Skripte verwenden, um die aktuelle Seite zu extrahieren und die Elemente innerhalb der Kopf-/Fußzeile ein-/auszublenden. In diesem Artikel zeigen wir Ihnen, wie Sie dies erreichen können: https://community.simplifier.io/knowledge/pdf-templates-make-the-header-footer-content-dynamic/

2.3 Styling Ihrer Vorlage

Mit CSS können Sie das Aussehen und den Stil Ihrer Vorlage definieren. Sie können auch Inline-Style-Tags in Ihrem HTML-Code verwenden (wie im obigen Beispiel zu sehen).

Beispiel:

table{
    width: 100%;
}

.tableHeader{
    background-color: #dedede;
}

Die Bibliothek, die zum Rendern der Vorlage verwendet wird, unterstützt keine CSS3-Funktionen!
In der Vorschau und beim Rendern wird nicht das gleiche Ergebnis angezeigt. Testen Sie Ihre PDF-Datei immer.

Schritt 3 – Konfigurationen für das PDF

Das serverseitige Business Objekt ‘SF_PDF‘ verfügt über zwei Funktionen: ‘generate‘ und ‘generateWithConfig‘. Wenn Sie einfach nur Ihre Daten in einer PDF-Datei anzeigen möchten, reicht es aus, die Funktion “Generieren” zu verwenden. Wenn Sie jedoch einige Konfigurationen hinzufügen möchten, wie z. B. die Seitengröße oder die Seitenausrichtung, verwenden Sie ‘generateWithConfig’. ‘GenerateWithConfig’ verfügt über einen zusätzlichen Parameter: ‘configJSON’. In diesem Parameter können Sie Ihre Konfigurationen im JSON-Format festlegen.

Beispiel:

var oConfig = {
    "orientation": "Landscape",
    "page-size": "A4",
    "margin-top": "1in",
    "margin-bottom": "1in",
    "margin-left": "1in",
    "margin-right": "1in",
    "footer-center": "[page] / [toPage]"
};

Häufig gestellte Fragen

F: Wie kann ich verhindern, dass meine Tabelle in der Mitte einer Zeile geteilt wird, wenn sie auf mehreren Seiten gerendert wird?

A: Um zu verhindern, dass eine Tabelle auseinandergerissen wird, können Sie das folgende CSS verwenden.

table, tr, td, th, tbody, thead, tfoot{
    page-break-inside: avoid !important;
}

F: Wie kann ich einen Seitenumbruch nach einem bestimmten Element erzwingen?

A: Das Erzwingen eines Seitenumbruchs nach einem bestimmten Element erfolgt ebenfalls mithilfe von CSS. Kopieren Sie das folgende CSS, fügen Sie es in Ihre Vorlage ein und fügen Sie die Klasse zum gewünschten HTML-Element hinzu

.break-after{
    page-break-after: always;
}

F: Ich möchte die Anzahl der Seiten in der Fußzeile haben. Wie kann ich das erreichen?

A: Dies kann mit der Funktionalität von WKHTMLTOPDF erfolgen. Werfen Sie einen Blick auf die verlinkte Dokumentationsdatei und suchen Sie nach “Fuß- und Kopfzeilen”. Es gibt ein Beispiel, das Sie einfach kopieren und einfügen können

Einschränkungen

PDF-Plugin-Vorlagen können nicht Teil eines Simplifier-Transports sein und müssen daher manuell transportiert werden.

Tags:BENUTZEROBERFLÄCHETextAnRUHEPAUSESkriptSeiteSchabloneHTMLpdfKopfballFußzeiledynamisch

Was this article helpful?

Yes  No
Related Articles
  • Feinabstimmung und Ausführung benutzerdefinierter AI-Modelle in Simplifier
  • Verwendung der Simplifier Teams App
  • Wie man wertvolle Hilfen und Vorschläge in Benutzereingaben integriert
  • So integrieren Sie Simplifier in CI/CD-Pipelines
  • So verwenden Sie Google reCAPTCHA v3 Essentials
  • Erstellen eines ChatBot-Clients für ChatGPT
Leave A Comment Antworten abbrechen

Du musst angemeldet sein, um einen Kommentar abzugeben.

Plugins
  • Erstellen Sie eine PDF-Vorlage über das Plugin
  • Plugin-Entwicklung mit NodeJS
  • PDF-Vorlagen: Gestalten Sie den Inhalt der Kopf-/Fußzeile dynamisch
  • So verwenden Sie das Simplifier Content Repository Plugin
  • Generieren eines PDFs mit Simplifier per Plugin
  • Verwenden Sie das ContentRepository-Plug-In, um Dateien von Ihrem Windows-Freigabevolume zu verarbeiten
Knowledgebase Categories
  • Erste Schritte 4
  • Mobiler Client 2
  • Layout & Design 4
  • Widgets 8
  • Integration 10
  • Datenbank Handling 1
  • Anleitungen 26
  • Best Practices 3
  • Cloud Services 6
  • Plugins 6

  Generieren eines PDFs mit Simplifier per Plugin

Arbeiten mit Drag & Drop  

GetApp Bewertung

Benutzerbewertungen

Capterra

Benutzerbewertungen

Für AWS-Kunden

Für SAP-Kunden

  • Contact | Imprint | Privacy | © 2025 Simplifier AG. All Rights Reserved.

  • Englisch
  • Deutsch

Link einfügen/ändern

Gib die Ziel-URL ein

Oder verlinke auf bestehende Inhalte

    Es wurde kein Suchbegriff angegeben. Es werden die aktuellen Inhalte angezeigt. Verwende zur Auswahl eines Elements die Suche oder die Hoch-/Runter-Pfeiltasten.