Website erstellen

Tutorial Blätterbare PDF-Datei in die Website einbauen

Robert Brandl

Von Robert

Um Tooltester kostenlos anbieten zu können, verwenden wir Affiliate Links. Falls Sie darüber eines der besprochenen Produkte kaufen, erhalten wir unter Umständen eine Provision. Der Preis den Sie zahlen, verändert sich dadurch nicht.

Es gibt unterschiedliche Wege PDF-Dateien auf Webseiten anzubieten:

  • als Download-Datei,
  • oder als eingebettete Datei in der man Blättern kann.

Um ein blätterbares Dokument in Ihre Website einzubauen, gibt es verschiedene Anbieter, die sich dazu gut eignen: Issuu und Yumpu (dt. Anbieter). Vor allem für Präsentationen eignet sich auch noch Slideshare.

Da uns vor allem die Art der Präsentation von Issuu sehr gut gefallen hat, finden Sie hier eine kleine Schritt-für-Schritt Anleitung:

Bitte beachten: inzwischen bietet Issuu leider kein kostenloses Einbetten von Dokumenten auf Websites an. Wir empfehlen ab sofort Yumpu als Alternative. Ganz unten haben wir Yumpu benutzt, um ein PDF in diesen Artikel einzubetten.

1. Zuerst besucht man issuu.com, um sich mit einem Klick auf „Create account“ zu registrieren.

issuu homepage

2. Als nächstes klickt man auf den Upload-Button um seine Pdf-Datei hochzuladen.

issuu upload

3. Man wählt durch Klick „Browse“ seine Datei aus und ergänzt die entsprechenden Informationen darunter. Als letztes bestätigt man das Ganze mit „Upload File“.

issue-pdf-upload

4. Nun sieht man das Dokument, welches man zuvor hochgeladen hat. In der oberen Leiste klickt man auf „Embed“.

issuu library

5. Hier geht man nun auf den Reiter HTML. Dort kann man noch Dinge wie die Größe oder Layout etc. auswählen. Als letztes kopiert man den unter dem Feld „Get the embed code“ vorhandenen Code.

issuu embed

6. Diesen Code fügt man nun als HTML-Widget in seine Website ein. Hier gezeigt am Beispiel von Weebly.

weebly issuu

7. Und so sieht das auf unserer Website aus! Viel Spaß beim Schmökern:

.embed-container { position: relative; padding-bottom:56.25%; height:0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

 

Robert Brandl

Gründer und Geschäftsführer

Servus, ich bin der Gründer von Tooltester! Ursprünglich aus München startete ich mein Berufsleben als Projektmanager in einer digitalen Marketingagentur in Frankfurt, wo ich immer derjenige war, der neue Web-Tools testete. Glücklicherweise konnte ich dieses Hobby im Jahre 2010 in meinen Beruf verwandeln. Ich freue mich von Ihnen zu hören. Sie finden mich auch auf LinkedIn.

Mehr über uns

Hinter den Kulissen dieses Artikels.

Dieser Artikel wurde von unserem Expert:innenteam geschrieben und folgt einem genauen Verfahren..

So arbeiten wir

Kommentare

homepage erstellen

Der Homepage-Kurs für Einsteiger

Wenn Sie sich erst mal mehr Grundlagen anlesen möchten, dann sollten Sie in unserer „Homepage-Anleitung für absolute Beginner“ schmökern. Hier zeigen wir Ihnen Schritt-für-Schritt die einzelnen Schritte beim Aufbau einer eigenen Homepage. Das Beste: das alles kostet Sie keinen Cent.