Kompatibilitàt:

WebSite X5 Evo und Pro

Kennen Sie diese kleinen Bücher, die man schnell mit dem Daumen durchblättert, sodass die Bilder in schneller Folge eine Bewegung simulieren und lebendig wirken? Es geht um die ursprünglichen Flipbooks. Heute gibt es auch digitale Versionen, nämlich Online-Veröffentlichungen, die auf einer PDF-Datei basieren und durch Video- und Audio-Animationseffekte das Gefühl vermitteln, als würde man ein gedrucktes Buch durchblättern.


Sie können mit einem Flipbook die Produkte Ihres Shops präsentieren, sowie auch die Speisekarte eines Restaurants, ein Fotoalbum, eine Präsentation, ein echtes Buch usw. Diese Lösung ist vielseitig einsetzbar und mit dem Zusatzobjekt Flipbook ganz einfach zu erstellen. Finden Sie einige Beispiele auf der Vorschauseite und setzen Sie es dann auf Ihrer Website ein.



Nehmen wir an, dass Sie eine PDF-Datei von einer Broschüre zu Ihrer Tätigkeit haben, und dass Sie sie gerne mit einem Flipbook auf Ihrer Website präsentieren möchten. Sie können das Flipbook direkt auf einer Seite der Website einbinden oder es einfach verlinken. Sehen wir nun, wie Sie in diesen beiden Fällen vorgehen sollen: 


In beiden Fällen können Sie den grafischen Stil des Objekts und die Kontrollleiste anpassen, mit der man das Flipbook steuert: 

So finden Sie das Flipbook auf der Webseite ein

  • Öffnen Sie die Seite, wo Sie das Flipbook einbinden möchten und fügen Sie das Objekt Flipbook in die gewünschte Zelle auf dem Seitenraster ein.
  • Doppelklicken Sie auf das Objekt, um die Einstellungen-Fenster zu öffnen und bleiben Sie im Bereich Allgemein. Wählen Sie die gewünschte PDF-Datei, die Sie importieren möchten. 
  • Wählen Sie Auf der Seite Einbinden als Anzeigemodus aus.
  • Legen Sie die Größe in Pixel für das Objekt fest.


  • Öffnen Sie die gewünschte Seite und fügen Sie das Objekt Flipbook in die gewünschte Zelle auf dem Seitenraster ein.
#Tipp - Das Flipbook wird oben auf der Seite angezeigt: Die Zelle definiert nur, wo die Schaltfläche oder das Bild angezeigt werden, die man anklicken muss, um das Flipbook anzuzeigen. Wenn es dagegen um einen Link geht, ist die Auswahl der Zelle nicht so wichtig.
  • Doppelklicken Sie auf das Objekt, um die Einstellungen-Fenster zu öffnen und bleiben Sie im Bereich Allgemein. Wählen Sie die gewünschte PDF-Datei, die Sie importieren möchten.
  • Jetzt wählen Sie jetzt Pop-up beim Klick als Anzeigemodus aus.
  • Jetzt stellen Sie den Link ein, den die Besucher anklicken müssen, um das Flipbook anzuzeigen. Öffnen Sie den Bereich Trigger und wählen Sie eine der Optionen aus:
    • Schaltfläche: So wird eine Schaltfläche erstellt, für die Sie Farben, Text, Formatierungen und Ränder definieren können. Der Link wird dann automatisch eingestellt.
    • Bild: Importieren Sie das Bild aus Ihrem PC oder aus der Online-Bibliotheken, dann definieren Sie die Größe in Pixel. Der Link wird dann automatisch eingestellt. Diese Option können Sie verwenden, um die Titelseite des Dokuments oder ein Banner einzurichten, das zur Ansicht einer Broschüre oder Speisekarte einlädt.
    • Link: In diesem Fall erhalten Sie einen Code, um den Link zum Flipbook zu erstellen. Diesen Code können Sie dann kopieren (CTRL+C) und auf einem anderen Objekt derselben Seite einfügen (CTRL+V), damit man das Objekt anklicken kann, um das Flipbook anzuzeigen. Mit dieser Option können Sie zum Beispiel eine Galerie mit den Titelseiten einer Reihe von Büchern erstellen und sicherstellen, dass auf jeder Titelseite ein Link zum entsprechenden Flipbook vorhanden ist.  


So stellen Sie die Kontrollleiste zusammen

Sowohl mit der Einbindung als auch mit dem Link wird das Flipbook mit einem Viewer angezeigt. In diesem Viewer ist eine Kontrollleiste mit den Befehlen vorhanden, mit denen man die Seite durchblättern kann. Sie können den Stil der Kontrollleiste so anpassen:

  • Bleiben Sie im Bereich Allgemein.
  • Unter Liste der Befehle finden Sie die verfügbaren Befehle: Wählen Sie diejenigen aus, die Sie anzeigen lassen möchten.


So passen Sie den grafischen Stil des Flipbooks an

Um einen einheitlichen Stil auf Ihrer Seiten zu haben, können Sie alle grafische Elemente des Flipbook anpassen:

  • Öffnen Sie den Beireich Stil.
  • Sie können damit beginnen, den Hintergrund des Viewers zu definieren, in dem das Dokument geöffnet wird: Sie können ein Hintergrundbild importieren (aus lokal gespeicherten Ressourcen oder aus der Online-Bibliothek) oder eine Farbe wählen (deren Deckkraft Sie einstellen können).
  • Entschieden Sie welchen Bewegungstyp für die Seiten die durchgeblättert werden können: 
    • Buch: Der Effekt simuliert die tatsächlichen Seiten eines Buches, die sich beim Umklappen zusammenfalten;  
    • Wischen: Der Übergang von einer Seite zur anderen erfolgt mit einem einfachen seitlichen Wischen.
  • Die können dann für die Kontrollleiste die Anordnung einstellen, indem Sie das gewünschte Layout auswählen und die Farbe für die verschiedenen Elemente definieren. 
  • Die Positionsanzeiger sind die Pfeilschaltflächen, mit denen Sie die Seiten durchblättern können: Sie können deren Größe, Schräge und Farbe einstellen.
  • Sie können dann diese Optionen auch verwenden, wenn Sie möchten:
    • Ton aktivieren: Nur verfügbar, wenn Sie den Bewegungstyp „Buch“ ausgewählt haben. Das Geräusch umgeblätterter Seiten wird abgespielt.
    • Einzelne Seite: Nur verfügbar, wenn Sie den Bewegungstyp „Wischen“ eingestellt haben. Dadurch wird immer nur eine Seite angezeigt, anstatt zwei nebeneinander.
    • Von rechts nach links blättern: Kehrt die Lesereihenfolge des Dokuments um. Dies ist nützlich für Texte in Sprachen wie Japanisch oder Arabisch.


Mögliche Alternativen

Mit dem Objekt Flipbook scheint es wirklich, dass Sie ein Buch oder ein Dokument aus Papier durchblättern, und Ihnen stehen viele Anpassungsmöglichkeiten zur Verfügung. Es gibt aber zahlreiche Lösungen für die Anzeige einer PDF-Datei auf Ihrer Website.  Ihre Auswahl hängt von Ihren Bedürfnissen ab:


Sind Sie schon neugierig, wie diese Objekt auf Ihrer Website aussieht? Installieren Sie sofort Flipbook


Fehlen Ihnen noch Credits für den Kauf dieses Objekts? Alle Kreditpakete ansehen