Einbettungscode

Technik & Infrastruktur

Ein HTML-Snippet (in der Regel ein iFrame-Tag), das ein Flipbook auf einer externen Website anzeigt.

Definition

Ein Embed-Code ist ein HTML-Snippet — typischerweise ein [iFrame](/glossary/iframe)-Tag —, das du in den Quellcode einer Webseite einfügst, um externen Inhalt inline auf dieser Seite anzuzeigen. Für digitales Publizieren laden Embed-Codes einen [Flipbook](/glossary/flipbook)- oder Dokumenten-Viewer direkt in die Hostseite, sodass Leser mit der Publikation interagieren können, ohne die Seite zu verlassen. Der Inhalt wird von den Servern der Publishing-Plattform bereitgestellt, was bedeutet, dass kein Datei-Hosting auf der Zielseite erforderlich ist. Wenn die Quellpublikation aktualisiert wird, spiegelt jede eingebettete Instanz die Änderung automatisch wider.

Warum Es Wichtig Ist

Embed-Codes verbinden deine Publikationen mit deiner Web-Präsenz. Ohne sie wäre die einzige Möglichkeit, ein Flipbook zu teilen, ein direkter Link, der Leser zwingt, deine Website zu verlassen. Das Einbetten hält Besucher auf deiner Domain, verbessert Verhaltensmetriken wie die Verweildauer und schafft ein nahtloses Leseerlebnis. Es zentralisiert auch die Content-Verwaltung: Aktualisiere das PDF einmal, und jeder Embed auf jeder Website zeigt die neueste Version. Dies ist besonders wertvoll für Kataloge, Preislisten und Speisekarten, die sich häufig ändern.

So Funktioniert Es in FlipLink

FlipLink generiert einen sofort nutzbaren Embed-Code für jedes veröffentlichte Flipbook oder Dokument. Über das Panel [Teilen und Verteilen](/features/sharing-and-distribution) kopiere das [iFrame](/glossary/iframe)-Snippet und füge es in jede Website, jeden Blog oder jedes CMS ein, das HTML akzeptiert. Der Embed ist standardmäßig [responsive](/glossary/responsive-embed) und passt sich der Containerbreite auf Desktop- und Mobilgeräten an. FlipLink bietet auch eine [klickbare Bild-Einbettung](/features/clickable-image-embed), die ein statisches Vorschaubild mit Link zum vollständigen Flipbook anzeigt — nützlich für E-Mail-Newsletter oder Plattformen, die iFrames einschränken. Mit [Domain-Whitelisting](/glossary/domain-whitelisting) kannst du steuern, wo dein Inhalt angezeigt wird, indem die Einbettung auf genehmigte Domains beschränkt wird.

Technische Details

Ein Embed-Code besteht aus einigen Schlüsselelementen: - **Das iFrame-Tag**: Das Kernelement, das ein Fenster zum externen Inhalt erstellt. Es enthält ein `src`-Attribut, das auf die Publikations-URL verweist, sowie `width`- und `height`-Attribute für die Dimensionierung. - **Responsiver Wrapper**: Ein umschließendes `div` mit prozentbasierter Größenangabe stellt sicher, dass sich der iFrame an das Seitenlayout anpasst. FlipLinks Embed-Code enthält diesen Wrapper standardmäßig, sodass du kein eigenes CSS schreiben musst. - **Allow-Attribute**: Moderne Browser erfordern explizite `allow`-Attribute für Funktionen wie Vollbild. FlipLinks Embed-Code enthält diese, damit alle interaktiven Funktionen sofort einsatzbereit sind. - **Fallback-Inhalt**: Ein Textlink innerhalb des iFrame-Tags dient als Fallback für die seltenen Browser oder E-Mail-Clients, die keine iFrames unterstützen. Der Embed wird asynchron geladen, d. h. er blockiert nicht das Rendern der Hostseite. Die Auswirkung auf die Seitenleistung ist minimal, da der Flipbook-Viewer erst initialisiert wird, wenn der iFrame im [Viewport](/glossary/viewport) sichtbar wird.

Häufig Gestellte Fragen

**Was ist ein Embed-Code?** Ein Embed-Code ist ein HTML-Snippet, das du in deine Website einfügst, um auf einer anderen Plattform gehostete Inhalte anzuzeigen. Für Flipbooks erstellt er typischerweise einen iFrame, der den interaktiven Publikations-Viewer direkt auf deiner Seite lädt. **Kann ich ein Flipbook auf jeder Website einbetten?** Ja, sofern die Website benutzerdefiniertes HTML erlaubt. Dies umfasst WordPress, Shopify, Squarespace, Wix (über HTML-Embed-Blöcke) und jede individuell erstellte Website. Einige E-Mail-Clients unterstützen keine iFrames — für diese verwende FlipLinks klickbare Bild-Einbettung. **Aktualisiert sich der Embed-Code automatisch, wenn ich die Publikation ändere?** Ja. Da der Embed-Code auf die Publikations-URL auf FlipLinks Servern verweist, werden alle Änderungen — PDF ersetzen, Einstellungen ändern oder CTA-Buttons aktualisieren — sofort in jeder eingebetteten Instanz übernommen, ohne den Embed-Code auf deiner Seite anzupassen.

Einrichtungs-Checkliste

1. Veröffentliche dein Flipbook oder Dokument in FlipLink 2. Öffne das Teilen-Panel und kopiere den Embed-Code 3. Füge in deinem CMS oder Seiteneditor einen benutzerdefinierten HTML-Block hinzu 4. Füge den Embed-Code in den HTML-Block ein 5. Zeige eine Vorschau der Seite an, um zu bestätigen, dass das Flipbook auf Desktop und Mobilgeräten korrekt dargestellt wird 6. Wenn du einschränken möchtest, wo das Flipbook eingebettet werden kann, konfiguriere das [Domain-Whitelisting](/glossary/domain-whitelisting) in den Publikationseinstellungen 7. Teste die interaktiven Funktionen (Seitenumblättern, CTA-Buttons, [Lead Capture](/glossary/lead-capture)) in der eingebetteten Version, um sicherzustellen, dass sie wie erwartet funktionieren

Verwandte Begriffe

In anderen Sprachen verfügbar

Bereit, deine
PDFs zu verwandeln?

Schließe dich Tausenden von Unternehmen an, die FlipLink nutzen, um ansprechende, interaktive Inhalte aus ihren PDFs zu erstellen. Starte kostenlos — keine Kreditkarte erforderlich.