Hinzufügen eines Inhaltsverzeichnisses
Ein Inhaltsverzeichnis (TOC) ist wie eine Straßenkarte, die den Lesern hilft, sich durch die Inhalte des PDF-Dokuments zu navigieren. Es erscheint normalerweise am Anfang und listet die Hauptabschnitte oder Kapitel der PDF-Datei auf, zusammen mit den Seitenzahlen, auf denen jeder Abschnitt beginnt. Auf diese Weise können die Leser bestimmte Teile des Dokuments schnell finden und anspringen, was den Zugriff auf die benötigten Informationen erleichtert.
IronPDF bietet eine Funktion zur Erstellung eines Inhaltsverzeichnisses mit Hyperlinks zu den Elementen 'h1', 'h2', 'h3', 'h4', 'h5' und 'h6'. Die Standardformatierung dieses Inhaltsverzeichnisses steht nicht im Widerspruch zu anderen Formatierungen im HTML-Inhalt.
Erste Schritte mit IronPDF
Beginnen Sie noch heute mit der Verwendung von IronPDF in Ihrem Projekt mit einer kostenlosen Testversion.
Hinzufügen eines Inhaltsverzeichnisses
- Laden Sie die C#-Bibliothek zum Hinzufügen eines Inhaltsverzeichnisses herunter
- Bereiten Sie das in PDF zu konvertierende HTML vor
- Setzen Sie die Eigenschaft TableOfContents, um das Inhaltsverzeichnis zu aktivieren
- Anpassen des Inhaltsverzeichnisses, indem Sie wählen, ob Seitenzahlen angezeigt werden sollen oder nicht
- Optimieren Sie die Platzierung des Inhaltsverzeichnisses im Ausgabe-PDF
Beispiel für das Hinzufügen eines Inhaltsverzeichnisses
Verwenden Sie die TableOfContents-Eigenschaft, um die Erstellung eines Inhaltsverzeichnisses im ausgegebenen PDF-Dokument zu ermöglichen. Diese Eigenschaft kann einem von drei TableOfContentsTypes zugewiesen werden, die wie folgt beschrieben sind:
- Keine: Kein Inhaltsverzeichnis erstellen
- Basic: Erstellen eines Inhaltsverzeichnisses ohne Seitenzahlen
WithPageNumbers: Erstellen eines Inhaltsverzeichnisses MIT Seitenzahlen
Um diese Funktion besser zu verstehen, können Sie die nachstehende HTML-Beispieldatei herunterladen:
- Laden Sie die Beispiel-HTML-Datei herunter
Code
:path=/static-assets/pdf/content-code-examples/how-to/table-of-contents.csusing IronPdf;
using System.IO;
// Instantiate Renderer
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Configure render options
renderer.RenderingOptions = new ChromePdfRenderOptions
{
// Enable table of content feature
TableOfContents = TableOfContentsTypes.WithPageNumbers,
};
PdfDocument pdf = renderer.RenderHtmlFileAsPdf("tableOfContent.html");
pdf.SaveAs("tableOfContents.pdf");Imports IronPdf
Imports System.IO
' Instantiate Renderer
Private renderer As New ChromePdfRenderer()
' Configure render options
renderer.RenderingOptions = New ChromePdfRenderOptions With {.TableOfContents = TableOfContentsTypes.WithPageNumbers}
Dim pdf As PdfDocument = renderer.RenderHtmlFileAsPdf("tableOfContent.html")
pdf.SaveAs("tableOfContents.pdf")Ausgabe PDF
Das Inhaltsverzeichnis wird mit Hyperlinks zu jedem der Elemente 'h1', 'h2', 'h3', 'h4', 'h5' und 'h6' erstellt.
Bitte beachten Sie
Merge-Methode auf dem Dokument wird die Hyperlinks des Inhaltsverzeichnisses unterbrechen.Platzierung des Inhaltsverzeichnisses in der PDF-Datei
Stellen Sie sicher, dass ein HTML-Dokument über korrekte Header-Tags (h1 bis h6) verfügt.
- Optional fügen Sie ein div ein, wo das Inhaltsverzeichnis erscheinen soll. Wenn das unten stehende Div nicht angegeben wird, fügt IronPDF das Inhaltsverzeichnis am Anfang ein.
<div id="ironpdf-toc"></div> <div id="ironpdf-toc"></div>- In den Darstellungsoptionen können Sie wählen, ob das Inhaltsverzeichnis mit oder ohne Seitenzahlen dargestellt werden soll.
Gestaltung des Inhaltsverzeichnisses
Das Inhaltsverzeichnis kann mit CSS gestaltet werden, indem die verschiedenen CSS-Selektoren verwendet werden, die den Stil des Inhaltsverzeichnisses definieren.
Zusätzlich erfolgt die Stiländerung über die CustomCssUrl-Eigenschaft. Laden wir zunächst eine CSS-Datei herunter, die das Original-Styling für das unten stehende Inhaltsverzeichnis enthält.
Laden Sie die benutzerdefinierte CSS-Datei herunter
[{w:(Derzeit wird nicht empfohlen, die Eigenschaften page-break-before und page-break-after beim Styling des Inhaltsverzeichnisses zu überschreiben, da dadurch die Seitenzahlenberechnungen fehlerhaft werden. Die aktuelle Implementierung erwartet, dass das Inhaltsverzeichnis auf separaten Seiten vom übrigen Dokumentinhalt ist.
:path=/static-assets/pdf/content-code-examples/how-to/table-of-contents-overwrite-styling.csusing IronPdf;
using System.IO;
// Instantiate Renderer
ChromePdfRenderer renderer = new ChromePdfRenderer();
// Configure render options
renderer.RenderingOptions = new ChromePdfRenderOptions
{
// Enable table of content feature
TableOfContents = TableOfContentsTypes.WithPageNumbers,
CustomCssUrl = "./custom.css"
};
// Read HTML text from file
string html = File.ReadAllText("tableOfContent.html");
PdfDocument pdf = renderer.RenderHtmlAsPdf(html);
pdf.SaveAs("tableOfContents.pdf");Imports IronPdf
Imports System.IO
' Instantiate Renderer
Private renderer As New ChromePdfRenderer()
' Configure render options
renderer.RenderingOptions = New ChromePdfRenderOptions With {
.TableOfContents = TableOfContentsTypes.WithPageNumbers,
.CustomCssUrl = "./custom.css"
}
' Read HTML text from file
Dim html As String = File.ReadAllText("tableOfContent.html")
Dim pdf As PdfDocument = renderer.RenderHtmlAsPdf(html)
pdf.SaveAs("tableOfContents.pdf")Stil-Überschriften
Verwenden Sie den Selektor 'ironpdf-toc ul li.h1', um dem H1-Header im Inhaltsverzeichnis eine andere Formatierung zuzuweisen. Ersetzen Sie 'h1' durch 'h2' bis 'h6', um das Styling für die jeweiligen Überschriften zu ändern.
#ironpdf-toc ul li.h1 {
font-style: italic;
font-weight: bold;
}
Schriftfamilie
Mit den beiden Selektoren '#ironpdf-toc li .title' und '#ironpdf-toc li .page' ist es möglich, die Schriftfamilie des Inhaltsverzeichnisses zu überschreiben. Verwenden wir die Schriftart 'kursive' für den Titel und nutzen das @font-face-Attribut, um die benutzerdefinierte 'Lemon'-Schriftart, entworfen von Eduardo Tunni, zu verwenden.
#ironpdf-toc li .title {
order: 1;
font-family: cursive;
}
@font-face {
font-family: 'lemon';
src: url('Lemon-Regular.ttf')
}
#ironpdf-toc li .page {
order: 3;
font-family: 'lemon', sans-serif;
}
Vertiefung
Die Einrückung kann mit dem Selektor ':root' gesteuert werden. Dieser Wert bestimmt die Einzugsgröße für jede Überschriftsebene (h1, h2, ...) im Inhaltsverzeichnis. Sie kann je nach Bedarf erhöht werden, oder es kann keine Einrückung mit einem Wert von 0 geben.
:root {
--indent-length: 25px;
}
Dot Line
Entfernen Sie die gestrichelten Linien zwischen Überschrift und Seitenzahl. Im Original-Styling lautet der zweite Parameter "currentcolor 1px". Ändern Sie sie in "transparent 1px", um die Punkte zu entfernen. Es ist wichtig, auch andere Attribute anzugeben, da bei diesem Selektor die neue Gestaltung die alte Gestaltung vollständig überschreibt, anstatt sie nur zu ergänzen.
#ironpdf-toc li::after {
background-image: radial-gradient(circle, transparent 1px, transparent 1.5px);
background-position: bottom;
background-size: 1ex 4.5px;
background-repeat: space no-repeat;
content: "";
flex-grow: 1;
height: 1em;
order: 2;
}
