Passe das Layout für PDF-Exporte in Confluence Cloud an
Confluence Cloud Dokumentation
Confluence- und Bereichsadministratoren können die PDF-Exporte für einzelne Bereiche anpassen.
Zu beachten
- PDF-Anpassungen nutzen eine Kombination aus HTML und CSS
- PDF-Anpassungen gelten jeweils nur für einen einzelnen Bereich
- PDF-Anpassungen gelten nur für Bereichsexporte (nicht für Exporte einzelner Seiten über Weitere Aktionen (●●●) > Exportieren > Nach PDF exportieren)
- Um eine bestimmte Anforderung in der exportierten PDF-Datei zu erreichen, änderst du Folgendes:
- Das Layout im PDF-Export, wo HTML verwendet wird, um die Struktur des exportierten Inhalts zu definieren, einschließlich Funktionen wie Titelseite, Kopf- und Fußzeilen.
- Das PDF-Stylesheet, wo CSS verwendet wird, um den Stil der Elemente im exportierten Inhalt zu definieren, wie Seitengröße und -ränder, Schriftart, Farbe und Listennummerierung.
Für weitere Anpassungen, sieh dir die Seite Erweiterte Anpassungen für den PDF-Export an.
Das PDF-Layout anpassen
Confluence-Administratoren können eigenes HTML hinzufügen, um die Titelseite, Kopfzeilen und Fußzeilen im PDF-Export anzupassen.
Ein globales PDF-Layout festlegen:
- Wähle das Zahnrad-Symbol (⚙️) oben rechts aus, um die Confluence-Administration zu öffnen.
- Finde Einstellungen und dann Gestaltung in der Navigation auf der linken Seite.
- Wähle PDF-Export aus.
- Wähle Bearbeiten aus.
- Trage deine Anpassungen in die Felder Titel, Kopfzeile und Fußzeile ein.
- Du kannst HTML und CSS eingeben, das auf der PDF-Titelseite sowie in den Kopf- und Fußzeilen der Seiten dargestellt wird.
- Für ein Kopfzeilenbild verwendest du dessen relative URL in der HTML-Konfiguration, um es auf eine Confluence-Seite hochzuladen.
- Wähle Speichern aus.
Das PDF-Layout auf Bereichsebene festlegen:
- Gehe zum Bereich in Confluence Cloud.
- Wähle neben dem Namen deines Bereichs in der Seitenleiste Weitere Aktionen (●●●) aus, dann Bereichseinstellungen.
- Öffne die Kategorie Design und wähle PDF-Exportformat aus.
- Dafür benötigst du die Bereichsadmin-Berechtigung.
- Füge HTML hinzu, um die Felder Titel, Kopfzeile und/oder Fußzeile anzupassen.
- Du kannst Inline-CSS in das HTML einfügen.
- Wähle Speichern aus.
Das PDF-Stylesheet anpassen
Du kannst das Erscheinungsbild der PDF-Seiten anpassen, indem du das CSS im Feld für das PDF-Stylesheet bearbeitest.
Lade zum Einstieg die Standard-CSS-Regeln für das PDF-Stylesheet herunter: confluencedefaultpdf.css. Jede in dieser Datei definierte Regel kann angepasst und in das Feld für das PDF-Export-Stylesheet eingefügt werden. Deine Anpassungen überschreiben jede Standard-CSS-Regel. Sind keine Anpassungen definiert, gelten die Standard-CSS-Regeln.
Standardmäßig enthält der Export keine Titelseite, Kopf- oder Fußzeilen. Du kannst diese im PDF-Layout festlegen.
Ein globales PDF-Stylesheet festlegen
- Wähle das Zahnrad-Symbol (⚙️) oben rechts aus, um die Confluence-Administration zu öffnen.
- Finde Einstellungen und dann Gestaltung in der Navigation auf der linken Seite.
- Wähle PDF-Export aus.
- Wähle Bearbeiten aus.
- Trage deine Anpassungen in das Feld PDF-Stylesheet ein.
- Füge CSS hinzu, um denselben Inhalt auf jeder Seite darzustellen.
- Wähle Speichern aus.
Ein PDF-Stylesheet auf Bereichsebene festlegen
- Gehe zum Bereich in Confluence Cloud.
- Wähle neben dem Namen deines Bereichs in der Seitenleiste Weitere Aktionen (●●●) aus, dann Bereichseinstellungen.
- Öffne die Kategorie Design und wähle PDF-Exportformat aus.
- Dafür benötigst du die Bereichsadmin-Berechtigung.
- Trage deine Anpassungen in das Feld PDF-Stylesheet ein.
- Füge CSS hinzu, um denselben Inhalt auf jeder Seite darzustellen.
- Wähle Speichern aus.
Beispielanpassungen
Dieser Abschnitt enthält Beispiele für typische Anpassungen, die du hinzufügen kannst. Weitere Informationen findest du auch unter Erweiterte Anpassungen für den PDF-Export.
Seitengröße
Die Standard-Seitengröße richtet sich nach dem Standort deiner Confluence-Instanz. Befindet sich die Instanz zum Beispiel in den USA, ist die Standard-Papiergröße deines PDF-Exports US Letter (8,5 Zoll breit und 11 Zoll lang). Befindet sich die Instanz in Australien, ist die Standard-Papiergröße A4 (210 mm breit und 297 mm lang). Weitere Informationen zu Papiergrößen findest du auf Wikipedia (Englisch).
Um die Seitengröße auf A4 zu ändern, bearbeite das PDF-Stylesheet und füge der CSS@page-Regel die Eigenschaft size hinzu, etwa so:
@media print { @page { size: A4; }}Seitenausrichtung: Querformat oder Hochformat
Um die Seitenausrichtung deines PDF-Dokuments zu ändern, kehre einfach die Reihenfolge der in der @page-Regel deklarierten Werte der Eigenschaft size um. Der erste und zweite Wert dieser Eigenschaft stehen für die Breite bzw. Höhe der Seite.
Um zum Beispiel PDF-Bereichsexporte im A4-Querformat zu erzeugen, könnte deine @page-Regel so aussehen:
@media print { @page { size: A4 landscape; }}Seitenränder
Um alle Ränder auf 15 mm bei einer Papiergröße von A4 zu setzen, bearbeite die CSS @page-Regel im PDF-Stylesheet wie folgt:
@media print { @page { margin: 11mm; }}Um die Ränder unabhängig voneinander festzulegen, bearbeite die @page-Regel wie folgt:
@media print { @page { margin-top: 1.5in; margin-right: 0.5in; margin-bottom: 1in; margin-left: 0.5in; }}Um Ränder für einen Falzbereich zum Binden eines gedruckten Dokuments festzulegen, verwendest du die Pseudoklassen :left und :right wie folgt:
@media print { @page { margin-left: 4cm; margin-right: 3cm; } @page :left { margin-left: 4cm; margin-right: 3cm; } @page :right { margin-left: 3cm; margin-right: 4cm; } @page :first { margin-top: 10cm; /* Top margin on first page 10cm */ }}Beachte die Verwendung der Pseudoklasse :first im Beispiel oben, um für ein Deckblatt oder eine Titelseite abweichende Ränder festzulegen.
Seitenumbrüche
Standardmäßig werden Confluence-Seiten ohne Seitenumbrüche exportiert, sodass kürzere Seiten auf derselben PDF-Seite erscheinen.
Damit jede Confluence-Seite auf einer eigenen Seite in der PDF-Datei erscheint, füge dem PDF-Stylesheet folgende Regel hinzu:
.pagetitle { page-break-before: always;}Titelseite
Du kannst deinem PDF-Dokument eine Titelseite hinzufügen, indem du HTML in das Feld „Titel” des PDF-Layouts einfügst. Das folgende Beispiel erstellt die Titelseite und fügt einen Titel hinzu:
<div style="margin: 0; padding: 0; height: 100%; display: flex; align-items: center; justify-content: center; font-family: Arial, sans-serif; width: 100%;"> <h1 style="font-size: 3em; color: #333;">Title Page</h1></div>Verwende CSS-Regeln im Feld für das PDF-Stylesheet, um das Erscheinungsbild der Titelseite und des Titeltextes zu steuern:
.fsTitlePage { margin-left: auto; margin-top: 50mm; margin-right: auto; page-break-after: always;}
.fsTitle { font-size: 42px; font-weight: bold; margin: 72px 0 4px 0; text-align: center;}Im Beispiel oben enthält die Titelseite ein Bild namens „titlepage.png”, zentriert in der Mitte der Seite. Die „590719” im Attribut src ist die ID der Seite, an die das Bild angehängt ist.
Gehe wie folgt vor, um ein Bild auf deiner Titelseite einzubinden:
- Hänge das Bild an eine Confluence-Seite an.
- Öffne die Liste der Anhänge auf dieser Seite, klicke dann mit der rechten Maustaste auf das Bild und kopiere dessen Adresse.
- Füge den Link in das entsprechende
src=""-Attribut in deinem PDF-Stylesheet ein, wie oben gezeigt. - Bearbeite die Bild-URL so, dass sie relativ ist, indem du den ersten Teil der URL vor
/download/...entfernst.
Inhaltsverzeichnis
Standardmäßig wird nach der Titelseite ein Inhaltsverzeichnis erzeugt, oder am Anfang des PDF-Dokuments, falls im PDF-Layout keine Titelseite festgelegt ist. Um die Standard-CSS-Regeln für das Inhaltsverzeichnis einzusehen, lade die Standard-CSS-Regeln herunter (confluencedefaultpdf.css) und sieh dir die Regeln an, die toc im Namen enthalten.
Um das Erscheinungsbild des Inhaltsverzeichnisses zu ändern, definierst du CSS-Regeln im PDF-Stylesheet.
Das Inhaltsverzeichnis deaktivieren
Um zu verhindern, dass in deinem PDF-Dokument ein Inhaltsverzeichnis erzeugt wird, füge dem PDF-Stylesheet die Regel div.toc-macro hinzu und setze deren Eigenschaft display auf none:
div.toc-macro { display: none;}Das Anwenden dieser Regel deaktiviert die Inhaltsverzeichnis-Funktion in PDF-Exporten. Fehlt das Inhaltsverzeichnis in deinen Exporten, überprüfe dein PDF-Stylesheet auf die Regel div.toc-macro und entferne sie.
Das Füllzeichen im Inhaltsverzeichnis ändern
Das Füllzeichen verbindet eine Überschrift im Inhaltsverzeichnis mit ihrer Seitenzahl. Standardmäßig ist das Füllzeichen der Punkt „.“. Erlaubt sind die Füllzeichen-Werte dotted, solid und space. Du kannst auch eine Zeichenfolge verwenden, zum Beispiel leader(". . . ").
Um das Füllzeichen in eine durchgezogene Linie zu ändern, bearbeite den Wert von leader() in der Eigenschaft content der CSS-Regel wie folgt:
span.toclead:before { content: leader(solid);}Kopf- und Fußzeilen
Du kannst deinen PDF-Seiten Kopf- und Fußzeilen hinzufügen, indem du die Felder Kopfzeile und Fußzeile im PDF-Export verwendest. Standardmäßig gelten Kopf- und Fußzeilen nur für Bereichsexporte, nicht für Exporte einzelner Seiten (mehr dazu findest du jedoch unter Erweiterte Anpassungen für den PDF-Export). Das folgende Beispiel fügt einen einfachen Copyright-Hinweis hinzu.
<div style="width: 100%; text-align: left; margin-left: 0.5in; font-size: 10px; height: 20px; overflow: hidden;"> <span style="font-weight: bold; font-size: 12px;">Your Custom Header Text Here</span></div>Seitennummerierung
Um eine Seitennummerierung hinzuzufügen, musst du angepasstes HTML mit angepasstem CSS im Feld für das PDF-Stylesheet kombinieren.
- HTML in den Layout-Feldern: Verwende im Bereich für die Fußzeile (oder die Kopfzeile) ein leeres Span-Element mit einer eindeutigen ID, zum Beispiel
pageNum, als Platzhalter für die Seitenzahl.
<div style="width: 100%; text-align: center; font-size: 12px; padding: 10px; font-family: Arial, sans-serif;"> <span id="pageNum"></span></div>- PDF-Stylesheet-CSS: Erstelle für das leere Span-Element folgende CSS-Selektor-Regel:
#pageNum:before { content: "Page " counter(page); font-weight: bold; font-size: 12px; color: #333; font-family: Arial, sans-serif;}Analysieren wir die obige CSS-Selektor-Regel genauer:
- Die Regel
#pageNumwählt das HTML-Element mit der angegebenen ID „pageNum” aus, also das Span-Element, das wir für die Kopf- oder Fußzeile erstellt haben. - Der Teil
:beforedes Selektors ist eine Pseudoklasse, mit der Inhalt eingefügt werden kann, bevor das Span-Element verarbeitet wird. counter(page)ist eine Funktion, die die aktuelle Seitenzahl als Inhalt zurückgibt.- Die Eigenschaft
contentteilt dem CSS-Prozessor mit, dass am Span-Tag dynamischer Inhalt (in diesem Fall eine fortlaufende Seitenzahl) eingefügt werden soll.
Lange Wörter umbrechen
Um lange Wörter oder nicht durch Leerzeichen getrennte Wörter umzubrechen, füge dem PDF-Stylesheet einen Selektor mit der Eigenschaft word-wrap und dem Wert break-word hinzu:
div { word-wrap: break-word;}Allgemeine Formatierung
Du kannst das Stylesheet verwenden, um so ziemlich alles andere anzupassen, was das Erscheinungsbild des fertigen Dokuments beeinflusst. Dazu gehören Schriftarten, Tabellen, Zeilenabstände, Makros usw. Die Export-Engine arbeitet direkt mit der von Confluence erzeugten HTML-Ausgabe. Der erste Schritt bei einer Anpassung besteht daher darin, einen Selektor für das von Confluence oder dem jeweiligen Confluence-Makro erzeugte HTML-Element zu finden. Füge anschließend dem PDF-Stylesheet eine CSS-Regel hinzu. Deine Anpassung erscheint dann im PDF-Export.
- Herabstufung von Überschriftenelementen:
h1,h2usw. Da ein Bereich hierarchisch exportiert wird, passt Confluence die Überschriftenelemente an, um für den gesamten Bereichsexport ein einheitliches Erscheinungsbild zu erzeugen. Das bedeutet, dass Überschriften herabgestuft werden. Das wirkt sich auf die Anwendung benutzerdefinierter PDF-Stylesheets aus. Es ist möglich zu berechnen, um wie viel eine Überschrift herabgestuft wird, um die richtige CSS-Formatierung anzuwenden. Eine Überschrift wird um den Wert ihrer Tiefe im Exportbaum herabgestuft. Eine Seite auf der ersten Ebene wird um 1 herabgestuft (alle<h1>-Elemente werden zu<h2>-Elementen usw.). Eine Seite auf der zweiten Ebene wird um 2 herabgestuft, und so weiter. - Der Atlassian-Support für PDF-Anpassungen ist eingeschränkt. Atlassian unterstützt den Mechanismus zum Anpassen des PDF-Layouts mit HTML und CSS und hilft, wenn dieser Mechanismus fehlerhaft ist oder nicht wie in den veröffentlichten Beispielen beschrieben funktioniert. Da benutzerdefiniertes HTML und CSS jedoch praktisch unbegrenzte Möglichkeiten bieten, unterstützt Atlassian keine Probleme, die durch PDF-Anpassungen verursacht werden oder damit zusammenhängen.