Wie gestalte ich ein dynamisches PDF-Dokument?


Dieser Abschnitt bietet eine kurze Einführung in häufig verwendete Funktionen bei der Erstellung von PDF-Dokumenten:

Beachten Sie, dass dieser Abschnitt nicht die umfangreiche Funktionspalette der zugrundeliegenden mPDF-Bibliothek abdeckt. Für weitere, in diesem Artikel nicht behandelte Gestaltungsmöglichkeiten, siehe die offizielle https://mpdf.github.io/.

Wenn Sie die offizielle mPDF-Dokumentation durchgehen, beachten Sie bitte, dass Sie bei der Einrichtung einer PDF-Vorlage in Cloudrexx auf die Verwendung von https://mpdf.github.io/reference/html-control-tags/overview.html (sowie die speziellen CSS-Eigenschaften) von mPDF beschränkt sind.

https://mpdf.github.io/reference/mpdf-functions/overview.html stehen nicht zur Verfügung, mit Ausnahme, wenn Sie die im Kontext der Entwicklung Ihrer eigenen verwenden.

Kopf- und Fußzeilen

Kopf- und Fußzeilen können wie folgt integriert werden:

  1. Zuerst müssen die Kopf- und Fußzeilen definiert werden (unter Verwendung von <htmlpageheader> und <htmlpagefooter>).

  2. Anschließend können die definierten Kopf- und Fußzeilen entweder mit CSS (@page {header: ... / footer: ...}) oder HTML (<sethtmlpageheader> und <sethtmlpagefooter>) in das PDF-Dokument eingebunden werden.

Definition

Kopf- und Fußzeilen werden mit den speziellen HTML-Tags <htmlpageheader> und <htmlpagefooter> definiert. Jeder Kopf-/Fußzeile wird durch ihr name-Attribut identifiziert. Das Layout und der Inhalt einer Kopf-/Fußzeile werden durch den Inhalt des <htmlpageheader>- / <htmlpagefooter>-Tags bestimmt. Sie können so viele Kopf-/Fußzeilen definieren, wie Sie benötigen. Das bedeutet, dass Sie eine andere Kopf-/Fußzeile für die erste Seite oder unterschiedliche Kopf-/Fußzeilen für gerade und ungerade Seiten definieren können (siehe Doppelseitige Dokumente). Weiters können Kopf-/Fußzeilen auf jeder Seite geändert werden. Zudem kann auch fürs Inhaltsverzeichnis (siehe ) eine benutzerdefinierte Kopf-/Fußzeile definiert werden.

 

<htmlpageheader name="NAME"> CONTENT </htmlpageheader>
<htmlpagefooter name="NAME"> CONTENT </htmlpagefooter>

Verwendung wie folgt:

  • Ersetzen Sie NAME durch eine Textzeichenfolge, die zur Identifizierung der Kopf-/Fußzeile verwendet wird

  • Ersetzen Sie CONTENT durch den HTML-Inhalt, der als Kopf-/Fußzeile verwendet werden soll

Benennen Sie keine Kopf- oder Fußzeile mit dem Anfang html_. Dieses Präfix ist reserviert, um eine HTML-Kopf-/Fußzeile zu identifizieren, wenn deren Name in einer Referenz angegeben wird.

Beispiel

Die folgende Kopfzeile wird die aktuelle Seitennummer (aus {PAGENO} entnommen) anzeigen und wird unter dem Namen myHeader identifiziert.

Beachten Sie, dass der folgende Code noch keine Kopfzeile ausgibt. Es handelt sich nur um eine Kopfzeilendefinition, die später mit HTML (<sethtmlpageheader>) oder CSS (@page {header: myHeader}) eingefügt werden kann.

<htmlpageheader name="myHeader"> <div>{PAGENO}</div> </htmlpageheader>

Integration

Definierte Kopf-/Fußzeilen (unter Verwendung von <htmlpageheader> / <htmlpagefooter>) können entweder mit HTML oder CSS auf einer Seite integriert werden. Bitte beziehen Sie sich auf die offizielle Dokumentation von und für fortgeschrittene Anwendungen.

HTML

Die speziellen HTML-Tags <sethtmlpageheader> und <sethtmlpagefooter> können verwendet werden, um definierte Kopf-/Fußzeilen auf einer Seite zu integrieren, indem sie über das name-Attribut verwiesen werden:

Verwendung wie folgt:

  • Ersetzen Sie NAME durch die zu integrierende Kopf-/Fußzeile

  • Ersetzen Sie PAGE durch eines der Wörter ODD, EVEN oder ALL, um sie nur auf ungeraden oder geraden Seiten, oder auf allen Seiten zu verwenden (siehe Doppelseitige Dokumente)

  • Ersetzen Sie VALUE entweder durch ON oder OFF, um die Kopf-/Fußzeile zu aktivieren oder zu deaktivieren

  • Ersetzen Sie SHOW-THIS-PAGE durch 1, um die Kopf-/Fußzeile auch auf der aktuellen Seite anzuzeigen (und nicht erst nach dem nächsten Seitenwechsel)

Für eine vollständige Übersicht zu den Einsatzmöglichkeiten, siehe die offizielle Dokumentation von und .

Beispiel

Verwenden Sie die definierte Kopfzeile myHeader auf jeder Seite unseres PDF-Dokuments:

Das Attribut value="on" aktiviert die Kopfzeile auf allen Seiten nach dem nächsten Seitenwechsel. Das Attribut show-this-page="1" zwingt das System, die Kopfzeile auch auf der aktuellen Seite einzufügen (was die erste Seite des zu generierenden PDF-Dokuments sein könnte).

CSS

Die Eigenschaften header und footer können verwendet werden, um die Integration der definierten Kopf- und Fußzeilen im Kontext einer @page-Regel zu konfigurieren.

Dies geschieht, indem der Wert von header / footer auf den Namen einer zuvor definierten Kopf-/Fußzeile (unter Verwendung von <htmlpageheader> / <htmlpagefooter>) gesetzt wird, vorangestellt von _html.

Setzen Sie den Wert auf _blank (oder einen Namen, der nicht definiert wurde), um Kopf-/Fußzeilen auszuschalten.

Beispiel

Verwenden Sie die definierte Kopfzeile myHeader auf jeder Seite unseres PDF-Dokuments:

Beachten Sie, dass der Name der Kopfzeile mit _html vorangestellt werden muss. Für weitere Informationen zur Verwendung siehe die offizielle Dokumentation der -Regel.

Seitennummerierung

Die folgenden Platzhalter im Zusammenhang mit der Seitennummerierung können innerhalb von Kopf- und Fußzeilen verwendet werden:

Platzhalter

Beschreibung

Platzhalter

Beschreibung

Gesamtanzahl der Seiten

Gesamtanzahl der Seiten

Anzahl der Seiten der aktuellen Gruppe, falls sie mit

zurückgesetzt wurde.

Für weitere Informationen siehe die offizielle Dokumentation auf Englisch:

Seitenränder

Seitenränder können mit CSS mit der margin-Eigenschaft im Kontext einer @page-Regel eingestellt werden.

Zusätzlich werden bei Verwendung von Kopf- und Fußzeilen die Eigenschaften margin-header und margin-footer verwendet, um den Abstand zwischen dem oberen Rand einer Seite und dem Beginn einer Kopfzeile bzw. dem unteren Rand einer Seite und dem Ende einer Fußzeile festzulegen.

Beispiele

Einen Rand von 1cm einstellen::

Individuelle Ränder einstellen:

Referenzen

Für ein ganzheitliches Verständnis zu Seitenränder, siehe die offizielle Dokumentation auf Englisch:

Seitenumbrüche

Seitenumbrüche können mit den speziellen HTML-Tags <pagebreak> und <formfeed> oder durch Verwendung der CSS-Eigenschaften page-break-before und page-break-after hinzugefügt werden.

Referenzen

Für ein ganzheitliches Verständnis zu Seitenumbrüche, siehe die offizielle Dokumentation auf Englisch:

Seitengröße & Ausrichtung

Die anfängliche Seitengröße kann mit der size-Eigenschaft im Kontext einer @page-Regel festgelegt werden.

Beispiele

Seitengröße auf A4 Hochformat einstellen:

Seitengröße auf A4 Querformat einstellen:

Seitengröße zurücksetzen

Die Seitengröße kann innerhalb des Dokuments entweder wieder mit der size-Eigenschaft im Kontext einer @page-Regel oder mit einem der speziellen HTML-Tags, die Seitenumbrüche behandeln (<pagebreak> / <tocpagebreak>), zurückgesetzt werden.

Referenzen

Für ein ganzheitliches Verständnis zu Seitengrößen, siehe die offizielle Dokumentation auf Englisch:

Doppelseitige Dokumente

Doppelseitige Dokumente können erstellt werden. Dies ermöglicht individuelles Layout (Kopf-/Fußzeilen/Ränder) für ungerade und gerade Seiten.

Standardmäßig wird das generierte PDF-Dokument als einseitiges Dokument erstellt. Um ein doppelseitiges Dokument zu generieren, registrieren Sie einfach die :left- und :right-Selektoren für die @page-Regel:

Die erste Seite im generierten PDF-Dokument gilt als ungerade Seite und erscheint als rechte Seite in einem LTR-Dokument (oder als linke Seite in einem RTL-Dokument).

Ränder

Bei doppelseitigen Dokumenten werden die linken und rechten Ränder auf geraden Seiten gespiegelt. Das bedeutet, dass der linke Rand (margin-left) auf einer rechten (ungeraden) Seite dem rechten Rand auf einer linken Seite entspricht und umgekehrt für den rechten Rand (margin-right).

Kopf- und Fußzeilen

Verschiedene Kopf- und Fußzeilen können für ungerade (odd) und gerade (even) Seiten definiert werden.

In CSS wird dies mit den Eigenschaften odd-header-name, even-header-name, odd-footer-name und even-footer-name im Kontext einer @page-Regel erreicht.

In HTML wird dies mit dem PAGE-Attribut der Tags <sethtmlpageheader> und <sethtmlpagefooter> gemacht.

Schriftarten

Die Standard-Schriftart, die bei der Erstellung eines PDF-Dokuments verwendet wird, ist (DejaVuSerifCondensed). Neben dieser sind mehrere Variationen verfügbar (DejaVuSans / DejaVuSansCondensed / DejaVuSerif / DejaVuSansMono), sowie eine weitere generische Schriftart, die (FreeSans / FreeSerif / FreeMono). Darüber hinaus stehen auch mehrere nicht-lateinische Schriftarten zur Verfügung. Die vollständige Liste der verfügbaren Schriftarten finden Sie in der .

Eigene Schriftarten werden ebenfalls unterstützt und können wie folgt eingebunden werden:

  1. Platzieren Sie Ihre benutzerdefinierten TrueType[1]-Schriftartdateien im Verzeichnis /media/Pdf/ttfonts/ (via FTP).

  2. Die Schriftart muss wie folgt benannt werden, um als solche erkannt zu werden:

    • MyFont-Regular.ttf

    • MyFont-Bold.ttf

    • MyFont-Italic.ttf

    • MyFont-BoldItalic.ttf

  3. Binden Sie Ihre benutzerdefinierte Schriftart wie folgt ein:
    Inline CSS:

    CSS:

[1]Kashida and OTF are not supported yet.

Inhaltsverzeichnis

Ein automatisch generiertes Inhaltsverzeichnis kann mit dem speziellen HTML-Tag <tocpagebreak> eingefügt werden. Das Inhaltsverzeichnis unterstützt benutzerdefinierte Kopf- und Fußzeilen mit den Attributen toc-odd-header-name, toc-even-header-name, toc-odd-footer-name und toc-even-footer-name. Darüber hinaus unterstützt es eine benutzerdefinierte Seitengröße und -ausrichtung durch Verwendung der Attribute toc-sheet-size und toc-orientation.

Einträge für das Inhaltsverzeichnis können mit dem speziellen HTML-Tag <tocentry> hinzugefügt werden.

Referenzen

Für ein ganzheitliches Verständnis, siehe die offizielle Dokumentation auf Englisch:

Feindruck

Registrier- und/oder Schnittmarken können mit der marks-Eigenschaft im Kontext einer CSS @page-Regel hinzugefügt werden. Wenn Sie Marken verwenden, nutzen Sie die Eigenschaft size, um die Größe der Seitenbox zu definieren, und die Eigenschaft sheet-size, um die Größe des Blattes festzulegen.

Beispiel

Registrier- und Schnittmarken zu einem A4-Querformatdokument hinzufügen, das auf A3-Querformatblättern gedruckt werden soll:

Referenzen

Für ein ganzheitliches Verständnis, siehe die offizielle Dokumentation auf Englisch:

 

© 2024 Cloudrexx AG | Schweizer Cloud CMS | Datenschutzerklärung