Ein PDF Dokument direkt auf deiner Seite anzeigen

aus der Kategorie "Deine Homepage"
Schwierigkeitsgrad: Etwas mehr als Anfänger

Hin und wieder taucht die Frage im Support und auch im Forum auf “wie kann ich denn ein .pdf Dokument direkt auf meiner Seite anzeigen?”.

Die einfachste Möglichkeit, sowohl für dich als Seitenbetreiber, als auch für deinen Webseitenbesucher, ist es wohl, die Datei direkt als Download anzubieten.

<a href="http://die-URL-Adresse-zu-deiner-PDF-Datei" target="_blank">DOWNLOAD</a>

Aber oft ist es ja doch auch so, dass man vielleicht erst einmal sehen möchte, was man sich denn da überhaupt auf seinen Rechner herunterlädt.

Der Google-Viewer für deine .pdf Dokumente

Das Stichwort lautet hier “Google-Viewer”. Mit diesem kannst du deine hochgeladenen .pdf Dokumente direkt auf deiner Seite einbinden und die Besucher deiner Seite können die Dokumente direkt und ohne zusätzliche Browser Plugins betrachten.

Und so funktioniert es:

Als Premium Paket Plus Kunde hast du jederzeit die Möglichkeit Dateien innerhalb deines Accounts hochzuladen. Dazu gehst du nach erfolgreichem Login auf den Menüpunkt Dateien. Hier kannst du deine Dateien, wie beispielsweise ein .pdf Dokument, einfach per Drag and Drop hochladen.

Sofern du (noch) kein Premium Kunde bist, suchst du dir einfach einen der kostenlosen Dateihoster aus und lädst dort deine Datei / dein .pdf Dokument hoch.

Alles was du nun noch brauchst ist die URL, unter der dein .pdf zu erreichen ist. Dazu klickst du einfach auf den Dateinamen und kopierst dir später einfach per Copy & Paste ( mit der Maus in die Browserzeile oben klicken, dann die Tastenkombination STRG + A, um alles auszuwählen, mit STRG + C kopiert man das ausgewählte und mit STRG + V fügt man das Kopierte an beliebiger Stelle wieder ein ) die Adresszeile aus deinem Browserfenster, welches sich neu geöffnet hat und dein .pdf Dokument anzeigt.

Jetzt öffnest du eine deiner Seiten, im besten Fall die Seite, auf der schlussendlich dein .pdf angezeigt werden soll und klickst in deinem Editor links oben auf “Quellcode”.

Danach kopierst du folgenden Code Schnipsel an die Stelle, an der dein .pdf Dokument angezeigt werden soll.

<iframe style="width: 500px; height: 800px;" src="http://docs.google.com/gview?url=http://die-URL-Adresse-zu-deiner-PDF-Datei&embedded=true" height="240" width="320" frameborder="0"></iframe>

Diese Stelle hier http://die-URL-Adresse-zu-deiner-PDF-Datei tauscht du mit der URL aus, unter der dein .pdf Dokument zu erreichen ist, die Angaben width:500px und height:800px kannst du dir, je nachdem wie du es passend auf deiner Webseite anzeigen möchtest, beliebig in der Breite ( width ) und in der Höhe ( height ) anpassen und auf deine Bedürfnisse zurechtbiegen.

Jetzt noch die Seite abspeichern und schon wird das .pdf Dokument auf deiner Seite angezeigt.

Parallel dazu solltest du den Besuchern deiner Webseite aber noch die Möglichkeit anbieten, das Dokument über einen Link herunterzuladen. Dies kannst du mit diesem HTML Code ermöglichen:

<a href="http://die-URL-Adresse-zu-deiner-PDF-Datei" target="_blank">DOWNLOAD</a>

wobei hier natürlich wieder entsprechend die URL Adresse deines Dokumentes eingetragen werden muss und der Text DOWNLAOD kann natürlich auch deinen eigenen Bedürfnissen angepasst werden.

Wer sich ein wenig mit HTML auskennt, der kann sich hier auch einen schicken Download Button erstellen.



Zurück zur Übersicht