Webseiten erstellen mit CHEETAH
Die wichtigsten Gestaltungselemente im Überblick (16)
Einbetten von pdf-Dateien
Es gibt verschiedene Methoden, wie sich pdf-Dokumente in eine Webseite einbetten lassen. Auf jeden Fall muss eine solche Datei natürlich an einem Ort gespeichert sein, von wo sie von der Webseite aus auch erreichbar ist. Hier bieten sich Online-Plattformen wie "Yumpu" oder diverse Cloudspeicher wie "Onedrive" oder „Backup-Sync“ von Google an. In diesem Beispiel hier soll explizit "Yumpu" verwendet werden, welches mit geringen Einschränkungen kostenlos genutzt werden darf und zugleich auch Einbettungscode für die Dokumentenanzeige auf der Webseite über einen speziellen Wizard zur Verfügung stellt.
LINK: Hier können Sie sich kostenlos bei YUMPU anmelden und dann dort Ihre pdf-Dokumente hochladen
Nachdem Sie Ihre pdf-Datei auf die Plattform hochgeladen und die entsprechenden Metadaten in die dafür vorgesehene Maske eingetragen haben, können Sie über die Funktion "Embed" den Einbettungscode im Dialog erstellen:
Ein Klick auf die im Screenshot gekennzeichnete Schaltfläche eröffnet Ihnen den Zugang zu einem speziellen Wizard ("Einbettungsoptionen festlegen"), in dem Sie diverse Einstellungen bezüglich des später auf Ihrer Webseite sichtbaren pdf - Betrachters vornehmen können. Das betrifft u. a. den Stil, die Größe und die Seitenzahl der Startseite sowie das Zuschalten diverse Bedienelemente (einige Funktionen sind jedoch nur in der kostenpflichtigen Variante zugänglich). Mit jeder Einstellung wird dabei simultan der im oberen Teil des Wizards angezeigte Einbettungscode modifiziert. Am Ende müssen Sie nur noch diesen Einbettungscode in die Zwischenablage übernehmen und anschließend dem Inline / HTML - Element auf Ihrer Webseite zuweisen:
Beachten Sie, dass Sie die Größe des Einbettungsbereichs möglichst gleich der Größe des im Einbettungscode angegebenen Embed-Fensters wählen (hier 940x846 Pixel), welches Sie dann anschließend noch ein klein wenig vergrößern, bis die Rollbalken verschwinden. Das Ergebnis könnte dann beispielsweise so aussehen:
In der mobilen Ansicht ist es aber meist besser, die pdf-Datei direkt per iFrame einzubinden. Dazu brauchen Sie in dem hier darunter aufgelisteten Code (welcher den „Google-Viewer“ explizit verwendet) nur den Zugriffspfad zur pdf-Datei (rot dargestellt) zu Ihrer pdf-Datei auszutauschen:
< iFrame style="width: 260px; height: 420px;" src= "https://docs.google.com/gview? url= {URL zum PDF} &embedded=true" height="240" width="320" frameborder="0"> < /iFrame >
Hinweis: Die beiden Varianten müssen Sie natürlich wechselseitig verbergen, sodass die erste Variante nur in der Desktop-Ansicht und die zweite Variante nur in der Smartphone-Ansicht angezeigt wird.
Einbetten von mit dem Digital Magazine Editor erstellten Magazinen
Im PREMIUM-Plan von Builderall ist der "Builderall Unlimited Magazine Builder" enthalten, mit dem man mit wenig Aufwand hochwertige pdf - Magazine erstellen kann. Diese Magazine können sowohl als pdf - Dateien gespeichert (und damit natürlich auch ausgedruckt) als auch in Webseiten eingebettet werden, wobei der Einbettungscode direkt im Editor erzeugt wird. Auch dazu ein kleines Beispiel: