So betten Sie PDF-Dateien in WordPress ein

Veröffentlicht: 2022-05-17

WordPress ist eine moderne, flexible Plattform zur Veröffentlichung Ihrer Website. Eine der Möglichkeiten, wie Sie dies sehen können, ist die Herangehensweise an die Medien. Sie können fast alle Typen über die Medienbibliothek auf Ihre Website hochladen, aber bei einigen Dateien benötigen Sie zusätzliche Unterstützung. Wenn Sie lernen möchten, wie Sie PDF-Dateien in WordPress einbetten, benötigen Sie ein paar Schritte mehr als eine einfache Bild- oder Videoeinbettung.

Da WordPress nur generische Einbettungsfunktionen bietet, sollten Sie für die meisten Anwendungsfälle entweder einen Server zum Hosten Ihrer Dateien verwenden oder ein Plugin installieren. Die gute Nachricht ist, dass beide Lösungen geeignet und vor allem einfach zu implementieren sind.

In diesem Artikel zeigen wir Ihnen, wie Sie PDF-Dateien in WordPress einbetten, indem Sie sowohl Google Drive, WordPress-Blöcke als auch ein Plugin verwenden. Zunächst lohnt es sich jedoch, darüber zu sprechen, warum Sie PDFs einbetten möchten, und auf den Unterschied zwischen einem einfachen Upload und einer Einbettung hinzuweisen.

Warum Sie eine PDF-Datei in WordPress einbetten möchten

Möglicherweise wissen Sie bereits, warum Sie eine PDF-Datei in WordPress einbetten möchten, obwohl Sie möglicherweise nicht verstehen, welche Vorteile Sie daraus ziehen. Es gibt viele, und hier sind nur einige:

  • Ein PDF eignet sich hervorragend als Muster für Ihr vollständiges Produkt oder Ihre Dienstleistung. Wenn Sie beispielsweise Grafikdesigner oder Autor sind, können Sie PDF-Dateien zum Herunterladen bereitstellen.
  • Einige PDFs eignen sich je nach Inhalt gut als wiederverwendbare Elemente. Ein Anmeldeformular ist ein gutes Beispiel oder ein Dokument mit den Allgemeinen Geschäftsbedingungen.
  • Wenn Sie Whitepaper oder Berichte in Auftrag geben, müssen Sie diese nicht in WordPress eingeben. Stattdessen können Sie die Datei zum Herunterladen oder Anzeigen anbieten.

Der letzte Punkt weist auf einen allgemeinen Anwendungsfall für PDFs hin. Beispielsweise möchten Sie aufgrund der zeitaufwändigen Art der Konvertierung möglicherweise kein wertvolles PDF als Beitrag auf Ihrer Website neu erstellen. Sie könnten die Datei jedoch einbetten und alle dynamischen und interaktiven Elemente eines nativen Inhalts beibehalten.

Der Unterschied zwischen dem Einbetten und Hochladen Ihrer PDF-Datei

Für manche mag es offensichtlich erscheinen, aber es gibt einen Unterschied zwischen dem Einbetten Ihrer PDF-Datei und dem Hochladen. Ja, Sie können jede Datei in WordPress hochladen (mit Ausnahme von SVGs zum jetzigen Zeitpunkt), aber das bedeutet nicht, dass Sie sie anzeigen können.

Dazu benötigen Sie eine Möglichkeit für WordPress, mit der Datei zu „sprechen“, um sie anzuzeigen. Hier kommt ein dedizierter PDF-Viewer ins Spiel. Früher war WordPress nicht das Beste, wenn es um eingebettete Dateien ging. Mit dem Aufkommen des Block-Editors erhalten Sie jedoch einen konsistenteren Workflow, der eher mit anderen Medientypen in WordPress übereinstimmt – dazu später mehr.

So betten Sie PDF-Dateien in WordPress ein (3 Möglichkeiten)

Es gibt drei Möglichkeiten, wie wir PDF-Dateien in WordPress einbetten können. Jeder wird für unterschiedliche Anwendungen und Arbeitsabläufe geeignet sein. Welche Sie wählen, ist daher eine persönliche Entscheidung:

  1. Wenn Sie Google Drive zum Hosten Ihrer Dateien verwenden, möchten Sie möglicherweise den Einbettungscode in das HTML von WordPress einfügen.
  2. Der WordPress Block Editor hat eine Möglichkeit, PDFs anzuzeigen, und das könnte alles sein, was Sie brauchen, um sie auf dem Frontend anzuzeigen.
  3. Mit einem Plugin wie PDF Embedder können Sie Ihre PDFs anzeigen und den Lesern ein umfassendes Erlebnis bieten.

Die von uns angebotenen Lösungen stehen in keiner Reihenfolge, und keine ist „richtiger“ als die andere. Schauen Sie sich daher jeden an und wählen Sie einen aus, der Ihren Gesamtzielen entspricht.

1. Einbetten einer Datei mit Google Drive

Viele Websitebesitzer verwenden Google-Produkte, und diejenigen, die in das Ökosystem investiert haben, werden verstehen, wie wichtig Google Drive ist.

Das Google Drive-Logo.

Wenn Sie Ihre PDF-Dateien in der Cloud hosten und sie nicht verschieben möchten, können Sie sie relativ einfach in Ihre WordPress-Website einbetten. Gehen Sie zunächst zu Ihrer ausgewählten Datei in Google Drive und klicken Sie im Menü „ Weitere Aktionen “ auf die Option „ Teilen “:

Die Share-Option in Google Drive.

Sie können gerne wählen, welche Mischung von Einstellungen zu Ihrem gewünschten Erlebnis passt. Wenn Sie hier fertig sind, gehen Sie zurück zum Menü Weitere Aktionen und öffnen Sie die Datei in einem neuen Fenster:

Die Option In neuem Fenster öffnen in Google Drive.

Sie werden feststellen, dass sich die Optionen in diesem Menü ändern. Wenn Sie das Menü Weitere Aktionen öffnen, wird jetzt ein Element einbetten… Link angezeigt:

Die Option „Element einbetten…“ in Google Drive.

Wenn Sie darauf klicken, wird ein Dialogfeld geöffnet, das HTML-Code enthält. Sie sollten dies kopieren und dann zu WordPress zurückkehren:

Das Dialogfeld „Element einbetten“ von Google Drive.

An dieser Stelle können Sie zu WordPress zurückkehren und die Seite öffnen, von der Sie das PDF einbetten möchten. Öffnen Sie dieses Mal im Menü Weitere Aktionen des Block-Editors den Code-Editor :

Die Code-Editor-Option in WordPress.

Ihre Aufgabe hier ist es, den richtigen Ort für Ihren Einbettungscode zu finden und ihn einzufügen:

Hinzufügen von HTML-Code zum WordPress-Code-Editor.

Sobald Sie auf den Link Exit-Code-Editor klicken, sehen Sie die Einbettung auf der Seite:

Ein in eine WordPress-Seite eingebettetes Google Drive.

Obwohl dies schnell zu implementieren ist, ist es eine funktionale Möglichkeit, Ihre PDF-Datei anzuzeigen, da es sich um einen Iframe handelt und Sie nicht viele Optionen erhalten. Für einen flexibleren Ansatz lesen Sie weiter!

2. Hinzufügen einer anzeigbaren PDF-Datei zu Ihrer Website mithilfe von WordPress-Blöcken

Im Gegensatz zum alten Classic-Editor ermöglicht der Block-Editor das konsistente Arbeiten mit verschiedenen Medientypen. Dies ist nicht offensichtlicher als wenn Sie PDF-Dateien in WordPress einbetten.

Sie können den Dateiblock verwenden, um alle Arten von Dateien einzubetten, aber in diesem Fall können wir ihn zum Einbetten einer PDF-Datei verwenden. Wenn Sie zu Ihrem gewünschten Beitrag oder Ihrer gewünschten Seite navigieren, können Sie nach dem Dateiblock suchen, und (ähnlich wie bei Bildern) werden Sie einen Datei-Uploader-Dialog bemerken:

Der Dateiblock-Uploader-Dialog.

Wenn Sie Ihre Datei hier hinzufügen, wird sie in einem gut aussehenden Viewer als Inline-Element angezeigt:

Eine Einbettung mit dem Dateiblock.

Sie sehen auch einen vollständigen URL-Pfad für Ihre Datei und eine Download -Schaltfläche. Sie können dies in den dedizierten Blockeinstellungen in der Seitenleiste des Editors ändern:

Die Dateiblock-Einstellungen in der WordPress-Seitenleiste.

Unserer Meinung nach ist es eine bessere Lösung als eine Google Drive-Einbettung, bietet aber immer noch nur ein leichtes Erlebnis, das Sie durch die Verwendung eines Plugins verbessern können. Lassen Sie uns diese Option als nächstes besprechen.

3. Verwenden von Plugins zum Einbetten von PDF-Dateien in WordPress

Wenn Sie regelmäßig PDF-Dateien in WordPress einbetten oder ein erstklassiges Leseerlebnis bieten möchten, ist ein Plugin der richtige Weg. Es gibt ein paar zur Auswahl, und in Wirklichkeit wird jede der Optionen eine gute Lösung sein.

Wir mögen PDF Embedder jedoch, weil es viele Installationen, viele positive Bewertungen (und daher andere Benutzer das Plugin genießen) und regelmäßige Updates hat.

Das PDF Embedder-Plugin.

Sobald Sie das Plugin installiert und aktiviert haben, gehen Sie in WordPress zur Seite Einstellungen > PDF Embedder :

Der Link zu den PDF Embedder-Einstellungen in WordPress.

Es gibt hier nicht zu viele, weil der Betrachter sofort großartig aussieht. Sie können jedoch Elemente wie die minimalen und maximalen Abmessungen, einige Symbolleisten-spezifische Einstellungen und andere ändern:

Die Seite mit den PDF Embedder-Einstellungen.

Um Ihr PDF einzubetten, fügen Sie einfach einen PDF Embedder-Block zu Ihrem Inhalt hinzu und wählen Sie Ihre Datei aus dem Uploader aus:

Der PDF-Embedder-Block mit der Option zum Öffnen der Medienbibliothek.

Beachten Sie, dass Sie hier auch die Blockeinstellungen überprüfen und bei Bedarf anpassen können. Wenn Sie die globalen Einstellungen nicht zuvor berührt haben, möchten Sie vielleicht einige Anpassungen vornehmen, um sie besser an Ihren Inhalt anzupassen:

Die PDF Embedder-Seitenleiste.

Dadurch erhalten Sie jedoch einen wohl besseren Viewer als die Einbettung von Google Drive oder die native WordPress-Option. Darüber hinaus können Sie auf eine Premium-Version von PDF Embedder upgraden, um mehr Funktionen, einen besseren Support und vieles mehr zu erhalten.

So betten Sie PDFs in WordPress ein, die lesbar und optimiert sind

So wie Sie Ihre Bilder und Videos optimieren würden, sollten Sie auch Ihre PDF-Dateien optimieren. Hier sind ein paar schnelle Tipps, die Ihnen helfen sollen, kleine Dateien bereitzustellen, die großartig aussehen und den Reichtum bewahren:

  • Ihre Typografie ist wichtig – genauso wichtig wie die Schriftarten Ihrer Website. Wir empfehlen Ihnen, sich insgesamt an zwei Schriftarten zu halten und diese in einer für alle Augen geeigneten Größe einzustellen.
  • Sie können PDFs genauso optimieren wie Bilder. Manchmal kann eine PDF-Datei Megabyte groß sein, also sollten Sie sie so klein wie möglich machen. ShortPixel hat einen hervorragenden PDF-Kompressor, der zu seiner beeindruckenden Bildoptimierung passt.
  • Apropos, wenn Sie Bilder in Ihr PDF einfügen, stellen Sie sicher, dass sie auch das richtige Maß an Optimierung haben.

Behandeln Sie Ihre PDF im Großen und Ganzen wie einen Beitrag oder eine Seite auf Ihrer Website: Optimieren Sie sie für Suche und Geschwindigkeit und machen Sie sich keine Gedanken über Interaktivität. Die Datei wird gut gerendert und bietet die gleiche Dynamik wie ein nativer Inhalt.

Abschließend

Egal, welche Medien Sie auf Ihre WordPress-Website werfen, Sie werden damit arbeiten können (SVGs standhalten). Wenn es um PDFs geht, hat WordPress eine fantastische native Erfahrung, die alles sein könnte, was Sie brauchen. Wenn Sie jedoch eine umfassendere Erfahrung beim Einbetten von PDF-Dateien in WordPress wünschen, gibt es andere Überlegungen, die Sie anstellen können.

Wenn Sie Ihre Dateien beispielsweise in Google Drive hosten, können Sie den eingebetteten HTML-Code in Ihren Inhalt „fest codieren“. Dies bietet einen netten Viewer, ist aber nicht flexibel und kann mit defekten Links und fehlenden Medien enden, wenn Sie die Datei zu einem späteren Zeitpunkt entfernen. Stattdessen bietet Ihnen ein Plugin alle Funktionen, die Sie benötigen. PDF Embedder ist hervorragend, aber es gibt auch andere Lösungen. Die Aufgabe hier ist es, das beste für Ihre Bedürfnisse und Ihren Arbeitsablauf auszuwählen.

Müssen Sie PDF-Dateien in WordPress einbetten, und wenn ja, welchen Ansatz werden Sie wählen? Lassen Sie es uns im Kommentarbereich unten wissen!