Tutorials

So fügen Sie Seitenzahlen, Datum und Titel zu Ihrem PDF hinzu

So fügen Sie Seitenzahlen, Datum und Titel zu Ihrem PDF hinzu

Wenn Sie ein Kochrezept speichern, reicht ein einfacher Screenshot völlig aus.

Aber wenn Sie eine Webseite als rechtliches Beweismittel, für die akademische Forschung oder für Geschäftsunterlagen speichern, ist ein einfaches Bild nicht genug. Sie benötigen Kontext. Sie müssen genau wissen, wann die Seite gespeichert wurde, woher sie stammt, und Sie benötigen Seitenzahlen für eine einfache Referenzierung.

Unser Tool verfügt über eine integrierte, professionelle "Kopf- & Fußzeilen"-Engine. Diese ermöglicht es Ihnen, diese Informationen automatisch auf jede Seite Ihres PDFs einzufügen.

Hier erfahren Sie, wie Sie sie nutzen, inklusive einiger Vorlagen zum Kopieren und Einfügen, die Sie sofort verwenden können.

Wie es funktioniert

Im Abschnitt "Erweiterte Einstellungen" (Advanced Settings) unseres Tools finden Sie zwei Textfelder:

  1. Header HTML (Erscheint ganz oben auf jeder Seite)
  2. Footer HTML (Erscheint ganz unten auf jeder Seite)

header & footer templates

Sie können hier Standard-HTML schreiben, aber die wahre Magie entsteht durch die Verwendung unserer speziellen CSS-Klassen. Wenn Sie diese spezifischen Klassennamen verwenden, füllt unser Konverter sie automatisch mit den korrekten Daten:

  • <span class='date'></span> → Fügt das aktuelle Druckdatum ein.
  • <span class='title'></span> → Fügt den Titel der Webseite ein.
  • <span class='url'></span> → Fügt die Quell-URL ein.
  • <span class='pageNumber'></span> → Fügt die aktuelle Seitenzahl ein.
  • <span class='totalPages'></span> → Fügt die Gesamtseitenzahl ein.

3 Vorlagen zum Kopieren und Einfügen

Wir haben diese mit robustem Raw-CSS (style="...") geschrieben, damit sie perfekt in der PDF-Engine funktionieren, ohne externe Stylesheets zu benötigen.

1. Die "Einfache Seitenzahl" (Fußzeile)

Das ist der Klassiker. Er platziert eine kleine, zentrierte Seitenzahl am Ende jeder Seite.

Fügen Sie dies in "Footer HTML" ein:

<div style="font-size: 10px; text-align: center; width: 100%; padding-top: 5px;">
  Seite <span class="pageNumber"></span> von <span class="totalPages"></span>
</div>

2. Die "Archiv"-Fußzeile (Recht/Forschung)

Perfekt für die Beweissicherung. Sie listet links die Quell-URL und rechts das Speicherdatum auf.

Fügen Sie dies in "Footer HTML" ein:

<div style="font-size: 8px; width: 100%; border-top: 1px solid #ccc; padding-top: 5px; overflow: hidden;">
  <span style="float: left; max-width: 70%;">Quelle: <span class="url"></span></span>
  <span style="float: right;">Gespeichert: <span class="date"></span></span>
</div>

3. Der "Professioneller Bericht"-Header

Lässt Ihren Web-Capture wie ein offizielles Dokument aussehen. Der Titel steht fett gedruckt links und das Datum rechts.

Fügen Sie dies in "Header HTML" ein:

<div style="font-size: 10px; width: 100%; margin-bottom: 10px; overflow: hidden;">
  <span style="float: left; font-weight: bold; max-width: 75%;" class="title"></span>
  <span style="float: right;" class="date"></span>
</div>

Wichtige Tipps

  1. ⚠️ Sie MÜSSEN Ränder festlegen: Kopf- und Fußzeilen werden innerhalb der Seitenränder gedruckt. Wenn Ihre Ränder auf "0" gesetzt sind, ist Ihre Kopfzeile unsichtbar! Sie müssen den oberen und unteren Rand auf mindestens 0.4in (oder 10mm) setzen, damit diese Vorlagen angezeigt werden.
  2. Schriftgröße: Die PDF-Engine behandelt Schriftgrößen anders als ein Bildschirm. Wir empfehlen 8px bis 10px. Alles, was kleiner ist, könnte verschwinden.

Bereit für den nächsten Schritt? Das Beherrschen von Kopfzeilen ist nur ein Schritt. Für weitere Tipps zur Erstellung professioneller Dokumente schauen Sie sich unseren Ultimativen Leitfaden zur Erstellung des perfekten Webseiten-PDFs an.

Ähnliche Artikel