Wie bindet man eine PDF-Datei in WordPress ein? (3 einfache Methoden)

Um eine PDF-Datei in WordPress einzubetten, haben Sie drei Möglichkeiten: den integrierten Datei-Block, ein spezielles Plugin oder einen iFrame mit Google Drive. Alle drei funktionieren ohne Programmierung und sind in weniger als fünf Minuten eingerichtet.

Die meisten WordPress-Nutzer laden PDFs als herunterladbare Dateien hoch, ohne zu wissen, dass sie diese auch direkt auf der Seite anzeigen können. Die richtige Methode, PDFs in WordPress einzubinden, hält Besucher länger auf Ihrer Website, verbessert die Interaktion und eignet sich hervorragend für Broschüren, Speisekarten, Berichte und alle Dokumente, die Ihre Leser ansehen sollen, ohne sie herunterzuladen. Hier erfahren Sie genau, wie es geht.

TL;DR

• Sie können auf WordPress ohne ein Plugin eine PDF-Datei mithilfe des integrierten Dateiblocks teilen.

• Für einen professionellen Viewer mit Zoom-, Navigations- und Download-Funktionen verwenden Sie ein PDF-Einbettungs-Plugin.

• Für große oder extern gehostete Dateien verwenden Sie einen iFrame mit Google Drive oder Dropbox.

• Um eine Verlangsamung der Seite zu vermeiden, sollten Sie Ihre PDF-Datei vor dem Hochladen immer auf unter 5 MB komprimieren.

• Testen Sie Ihre Einbettung auf Mobilgeräten, bevor Sie sie veröffentlichen, da die Browserdarstellung je nach Gerät variiert.

Warum sollte man eine PDF-Datei in WordPress einbetten, anstatt einfach darauf zu verlinken?

Durch das Verlinken einer PDF-Datei wird diese in einem neuen Tab geöffnet oder heruntergeladen. Durch das Einbetten bleibt der Besucher hingegen auf Ihrer Seite, innerhalb Ihres Layouts und mit Ihrem Branding sichtbar. Dieser Unterschied ist wichtiger, als die meisten annehmen.

Darum ist Einbetten in den meisten Situationen die bessere Wahl.

• Bessere Benutzererfahrung: Besucher lesen das Dokument, ohne Ihre Website zu verlassen. Keine neuen Tabs, keine heruntergeladenen Dateien, die ihr Gerät belasten.

• Höheres Nutzerengagement: Eingebettete Dokumente sorgen dafür, dass die Nutzer länger auf der Seite bleiben, erhöhen die Verweildauer und reduzieren die Absprungrate.

• Mehr Kontrolle: Sie entscheiden, ob Besucher das Dokument herunterladen, ausdrucken oder nur ansehen können, je nachdem, welches Plugin oder welche Methode Sie verwenden.

• SEO-Vorteil: Der umgebende Seiteninhalt, die Überschriften und der Kontext, die Sie um die Einbettung herum schreiben, sind von Google indexierbar. Der PDF-Inhalt selbst ist für Suchmaschinen schwieriger zu lesen, daher verbessert die Einbettung mit erläuterndem Text die Gesamtrelevanz der Seite.

• Professionelle Präsentation: Ein ansprechend gestalteter, responsiver PDF-Viewer wirkt deutlich professioneller als ein einfacher Download-Link.

Was benötigen Sie vor dem Start?

Bevor Sie eine PDF-Datei in eine Webseite einfügen, sparen Sie mit etwas Vorbereitung Zeit und vermeiden die häufigsten Probleme. Gehen Sie diese kurze Checkliste durch, bevor Sie Ihren Editor öffnen.

• Komprimierte PDF-Datei: Große PDFs verlangsamen das Laden von Seiten. Verwenden Sie Smallpdf oder iLovePDF, um Ihre Datei vor dem Hochladen zu komprimieren. Für Inline-Viewer sollte die Dateigröße unter 5 MB liegen.

• Zugriff auf Ihren WordPress-Editor: Sie benötigen Editor- oder Administratorzugriff auf die Seite oder den Beitrag, auf dem die PDF-Datei erscheinen soll.

• Gehostet auf WordPress: Laden Sie die Datei direkt in Ihre Mediathek hoch und verweisen Sie in Ihrem Block oder Plugin auf die Datei-URL.

• Extern gehostet: Verwenden Sie Google Drive, Dropbox oder eine andere Plattform und binden Sie die Datei mithilfe eines iFrames oder eines Plugin-Shortcodes ein.

• Entscheidung über Download-Berechtigungen: Legen Sie im Voraus fest, ob Besucher die Datei herunterladen dürfen. Dies beeinflusst die Wahl der Methode und des Plugins.

Welche drei Methoden gibt es, um eine PDF-Datei in WordPress einzubetten?

Es gibt drei zuverlässige Möglichkeiten, eine PDF-Datei in WordPress zu laden. Die richtige Methode hängt davon ab, wo Ihre Datei gehostet wird, wie viel Kontrolle Sie über den Viewer benötigen und ob Sie ein Plugin installieren möchten.

Verfahren	Am besten geeignet für	Plugin erforderlich
Dateiblock	Schnelle Einbettung, keine Einrichtung erforderlich	NEIN
PDF-Einbettungs-Plugin	Professioneller Betrachter mit Bedienelementen	Ja
iFrame oder Google Drive	Extern gehostete oder große Dateien	NEIN

Methode 1: Verwenden Sie den WordPress-Dateiblock (kein Plugin erforderlich)

Am schnellsten lassen sich PDFs in WordPress mit dem integrierten Datei-Block im Gutenberg-Editor hochladen und anzeigen. Diese Methode benötigt kein Plugin und funktioniert auf jeder selbstgehosteten WordPress-Website ab Version 5.0.

Der Block „Datei“ zeigt mithilfe des Browsers des Besuchers direkt auf der Seite einen PDF-Viewer an, darunter befindet sich eine Schaltfläche zum Herunterladen.

Wie bettet man eine PDF-Datei mithilfe des Dateiblocks ein?

1. Öffnen Sie die Seite oder den Beitrag, in den Sie die PDF-Datei einbetten möchten.
2. Klicken Sie im Blockeditor auf das Plus-Symbol, suchen Sie nach „Datei“ und wählen Sie diese aus den Ergebnissen aus.
3. Wählen Sie den Block „Datei“ aus und klicken Sie dann auf „Hochladen“, um Ihre PDF-Datei hinzuzufügen, oder wählen Sie eine aus Ihrer Medienbibliothek aus.
4. Nach dem Hochladen aktivieren Sie die Inline-Dateiansicht im Block-Einstellungsfeld auf der rechten Seite.
5. Passen Sie die Höhe des Betrachters mithilfe des Felds „Höhe in Pixeln“ an die Länge Ihres Dokuments an.
6. Klicken Sie auf Aktualisieren oder Veröffentlichen, um die Speicherung zu bestätigen.

Die PDF-Datei wird mithilfe des im Browser integrierten PDF-Viewers direkt im Seiteninhalt angezeigt. Es ist keine zusätzliche Einrichtung erforderlich.

Welche Einschränkungen gibt es beim Dateiblock?

Der integrierte Dateiblock eignet sich gut für einfache Anwendungsfälle, weist aber einige Einschränkungen auf, die man kennen sollte, bevor man sich für diese Methode entscheidet.

• Browserabhängigkeit: Der Viewer ist vom Browser des Besuchers abhängig. Auf einigen mobilen Browsern wird standardmäßig ein Download-Aufruf angezeigt, anstatt die Inhalte direkt im Browser darzustellen.

• Keine Gestaltungsmöglichkeiten: Sie können das Erscheinungsbild des Viewers, die Symbolleiste oder die Navigationsschaltflächen nicht anpassen.

• Es wird immer ein Download-Button angezeigt: Bei dieser Methode gibt es keine Möglichkeit, Downloads zu deaktivieren.

Falls eine dieser Einschränkungen für Ihren Anwendungsfall ein Problem darstellt, löst Methode 2 alle diese Probleme.

Methode 2: Ein PDF-Einbettungs-Plugin verwenden

Ein spezielles PDF-Einbettungs -Plugin bietet Ihnen einen ansprechend gestalteten, responsiven Viewer mit Steuerelementen für Zoom, Seitennavigation, Downloadberechtigungen und Vollbildmodus. Dies ist die beste Option, wenn es auf Präsentation und Kontrolle ankommt.

Welches sind die besten WordPress-Plugins zum Einbetten von PDFs?

Mehrere Plugins eignen sich dafür gut. Dies sind die zuverlässigsten verfügbaren Optionen.

• PDF Embedder: Ein schlankes, gut gepflegtes Plugin zum Einbetten von PDFs mit einem übersichtlichen, responsiven Viewer. Funktioniert über einen Block oder Shortcode. Die Premium-Version bietet zusätzlich Zoomfunktionen, Vollbildmodus und Seitennavigation. Die beste Allround-Lösung für die meisten Websites.

• Beliebige Dokumente einbetten: Unterstützt PDFs, Word-Dokumente, Excel-Dateien und PowerPoint-Präsentationen. Nutzt Google Docs Viewer oder Microsoft Office Online als Rendering-Engine, wodurch die meisten Kompatibilitätsprobleme zwischen verschiedenen Browsern und Mobilgeräten behoben werden.

• Real3D FlipBook: Die beste Option für einen blätterbaren Magazin-Viewer mit animierten Seitenumblättereffekten. Ideal für Broschüren, Kataloge und Lookbooks, bei denen die visuelle Präsentation im Vordergrund steht.

Wie bettet man eine PDF-Datei mit PDF Embedder ein?

1. Gehen Sie zu Plugins⟶ Neu hinzufügen, suchen Sie nach PDF Embedder und installieren Sie es.
2. Aktivieren Sie das Plugin und gehen Sie zu den Einstellungen, um die Standardbreite und -höhe zu konfigurieren.
3. Öffnen Sie die Seite oder den Beitrag, in dem die PDF-Datei erscheinen soll.
4. Fügen Sie einen neuen Block hinzu und wählen Sie PDF Embedder aus, oder verwenden Sie den Shortcode: [pdf-embedder url=”IHRE PDF-URL”]
5. Laden Sie Ihre PDF-Datei in die Medienbibliothek hoch und kopieren Sie die Datei-URL.
6. Fügen Sie die URL in den Block oder Shortcode ein.
7. Überprüfen Sie die Seite in der Vorschau, um sicherzustellen, dass sie im Viewer korrekt angezeigt wird, und veröffentlichen Sie sie anschließend.

Der Viewer wird auf Ihrer Seite gerendert und enthält Navigationspfeile, einen Seitenzähler sowie optionale Zoom-Steuerelemente, abhängig von Ihren Einstellungen.

Methode 3: Einbetten einer PDF-Datei mithilfe eines iFrames oder Google Drive

Wenn Sie eine außerhalb von WordPress gespeicherte PDF-Datei einbetten möchten, beispielsweise eine Datei von Google Drive oder Dropbox, ist ein iFrame die flexibelste Option. Diese Methode eignet sich auch gut, wenn die PDF-Datei zu groß für Ihren eigenen Server ist.

Wie kann ich eine PDF-Datei aus Google Drive einbetten?

1. Laden Sie Ihre PDF-Datei in Google Drive hoch.
2. Klicken Sie mit der rechten Maustaste auf die Datei, wählen Sie „Öffnen mit Google Docs“, navigieren Sie oben zum Menü „Datei“ und wählen Sie „Im Web veröffentlichen“.
3. Wählen Sie „Einbetten“ und kopieren Sie den bereitgestellten iFrame-Code.
4. Fügen Sie in Ihrem WordPress-Editor einen benutzerdefinierten HTML-Block hinzu.
5. Fügen Sie den iFrame-Code in den Block ein.
6. Passen Sie die Breiten- und Höhenwerte im Code an Ihr Layout an. Ein guter Ausgangspunkt ist Breite=100% und Höhe=600.
7. Veröffentliche die Seite.

Die PDF-Datei wird in einem direkt in Ihre Seite eingebetteten Google Docs-Viewer angezeigt. Besucher sehen das vollständige Dokument mit Navigationssteuerelementen, und Google übernimmt die Darstellung.

Wie kann ich eine PDF-Datei aus Dropbox einbetten?

1. Laden Sie die PDF-Datei in Dropbox hoch und öffnen Sie die Datei.
2. Klicken Sie auf „Teilen“ und generieren Sie einen direkten Link.
3. Ändern Sie den Abfrageparameter der URL von dl=0 auf raw=1, um einen direkten Dateilink zu erhalten.
4. Verwenden Sie diese URL im PDF Embedder Shortcode oder fügen Sie sie in das src-Attribut des iframe in einem benutzerdefinierten HTML-Block ein.

Wann sollte man die iFrame-Methode verwenden?

Sie sind sich nicht sicher, welche Methode für Ihre Situation am besten geeignet ist? Die richtige Wahl hängt von drei Faktoren ab: dem Speicherort Ihrer Datei, dem gewünschten Kontrollbedarf über den Viewer und der Installation eines Plugins. Nutzen Sie diese Informationen als Entscheidungshilfe.

• Extern gehostete Dateien: Die PDF-Datei befindet sich auf Google Drive, Dropbox oder einer anderen Plattform, und Sie möchten sie nicht auf Ihrem Server duplizieren.

• Große Dateigrößen: Die Datei ist zu groß für Ihre Mediathek oder würde die Speichergrenzen Ihres Hostings überschreiten.

• Browserübergreifende Kompatibilität: Google muss das Rendering übernehmen, ohne dass ein Plugin installiert werden muss.

• Automatische Dokumentenaktualisierung: Aktualisierungen der Google Drive-Datei werden automatisch in der eingebetteten Version übernommen, ohne dass Änderungen an der WordPress-Seite.

Wie wählt man die richtige Methode aus?

Die Einbettung ist nur die halbe Miete. Die Art und Weise, wie Sie sie einrichten, beeinflusst direkt die Seitenladezeit, die mobile Nutzererfahrung und die Verständlichkeit des umgebenden Inhalts für Suchmaschinen.

Diese praktischen Tipps machen wirklich einen Unterschied.

• Verwenden Sie den Dateiblock: Wenn Sie eine schnelle Einbettung benötigen, eine kleine PDF-Datei haben und Ihnen der Standard-Browser-Viewer mit sichtbarer Download-Schaltfläche nichts ausmacht.

• Verwenden Sie ein PDF-Einbettungs-Plugin: Wenn Sie einen professionellen Viewer benötigen, Downloads deaktivieren möchten oder Zoom- und Vollbildsteuerung für ein besseres Leseerlebnis benötigen.

• Verwenden Sie iFrame oder Google Drive: Wenn die PDF-Datei extern gehostet wird, die Datei groß ist oder Sie möchten, dass Google die browserübergreifende Darstellung ohne Plugin übernimmt.

Tipps zum Einbetten von PDFs in WordPress

Selbst bei korrekter Vorgehensweise treten immer wieder einige Probleme auf. Die meisten lassen sich schnell beheben, sobald man die Ursache kennt. Hier erfahren Sie, worauf Sie achten sollten und wie Sie jedes Problem schnell lösen können.

• Vor dem Hochladen komprimieren: Große PDFs verlängern die Ladezeit der Seite. Komprimieren Sie die Datei vor dem Hochladen auf WordPress mit Smallpdf oder iLovePDF auf unter 5 MB.

• Wählen Sie eine Höhe, die zu Ihrem Inhalt passt: Für die meisten kurzen Dokumente eignet sich eine Höhe von 500–700 Pixeln. Bei längeren Berichten bieten 800 Pixel ausreichend Platz für komfortables Lesen.

• Testen Sie auf Mobilgeräten vor der Veröffentlichung: PDF-Viewer auf Mobilgeräten können sich unvorhersehbar verhalten. Testen Sie Ihre Einbettung auf einem Smartphone und fügen Sie gegebenenfalls einen Download-Link neben dem Viewer hinzu, falls die mobile Darstellung unbefriedigend ist.

• Ergänzenden Text um den eingebetteten Inhalt herum verfassen: Suchmaschinen können PDF-Inhalte nicht zuverlässig lesen. Um die Suchmaschinenoptimierung und Barrierefreiheit zu verbessern, fügen Sie daher eine kurze Zusammenfassung des Dokumentinhalts in der Nähe des eingebetteten Inhalts hinzu.

• Downloads bei Bedarf deaktivieren: Falls die PDF-Datei geschützte oder sensible Inhalte enthält, verwenden Sie PDF Embedder Premium oder ein ähnliches Plugin, um die Download-Schaltfläche zu deaktivieren.

Welche häufigen Probleme treten beim Einbetten von PDFs in WordPress auf?

Selbst bei Anwendung der richtigen Methode treten regelmäßig einige Probleme auf. Hier erfahren Sie, wie Sie diese schnell beheben können.

• PDF wird nicht inline angezeigt: Stellen Sie sicher, dass die Inline-Dateiansicht in den Dateiblockeinstellungen aktiviert ist. Wenn Sie ein Plugin verwenden, überprüfen Sie, ob die Datei-URL korrekt ist und die PDF-Datei öffentlich zugänglich ist.

• Leeres weißes Feld auf Mobilgeräten: Dies bedeutet in der Regel, dass der Browser die PDF-Datei nicht direkt im Browser anzeigt. Wechseln Sie zu „Beliebiges Dokument einbetten“ oder verwenden Sie die Google Drive-iFrame-Methode für eine bessere Kompatibilität mit Mobilgeräten.

• PDF lädt sehr langsam: Die Datei ist zu groß. Komprimieren Sie sie mit Smallpdf oder iLovePDF, bevor Sie sie erneut hochladen. Dateien über 5 MB verlangsamen die Seite spürbar.

• Der Download-Button verschwindet nicht: Der kostenlose Dateiblock zeigt immer einen Download-Button an. Sie benötigen PDF Embedder Premium oder ein ähnliches kostenpflichtiges Plugin, um diesen zu entfernen.

• iFrame zeigt Anmeldebildschirm an: Ihre Google Drive-Datei ist nicht öffentlich. Gehen Sie zu Drive, klicken Sie mit der rechten Maustaste auf die Datei, wählen Sie „Teilen“ und legen Sie den Zugriff auf „Jeder mit dem Link“ fest, bevor Sie den Einbettungscode kopieren.

Abschluss

Das Einbetten von PDFs in WordPress ist unkompliziert, sobald Sie die passende Methode für Ihre Bedürfnisse gefunden haben. Nutzen Sie den Datei-Block für schnelle und einfache Einbettungen, ein Plugin für professionelle Darstellung und Downloadkontrolle sowie einen iFrame für große oder extern gehostete Dateien.

Egal für welche Methode Sie sich entscheiden, komprimieren Sie Ihre Datei vorher, testen Sie sie vor der Veröffentlichung auf Mobilgeräten und fügen Sie erläuternden Text um den Einbettungstext herum hinzu, um die Suchmaschinenoptimierung zu verbessern. Allein diese drei Schritte sorgen dafür, dass Ihr eingebettetes PDF auf den meisten Konkurrenzseiten besser abschneidet.

Häufig gestellte Fragen