Mit dem integrierten Rich-Text-Modul von HubSpot kannst du deine gehostete Dokumentenbibliothek auf jeder HubSpot-Seite platzieren. Die folgenden Schritte decken den gesamten Prozess ab.
Bevor du beginnst: Das funktioniert mit jedem HubSpot-Tarif, auch mit dem kostenlosen. Du brauchst kein kostenpflichtiges Upgrade und kein eigenes Modul. HubSpot fügt die Dokumentenbibliothek mit einer schmalen festen Breite ein. Deshalb gibt es später im Artikel einen zusätzlichen Schritt, um sie breiter zu machen. Der HubSpot-Editor zeigt außerdem nicht immer das fertige Ergebnis an. Prüfe daher die veröffentlichte Seite.
Einbettungscode kopieren
Öffne in deinem gehosteten Document Library Pro-Dashboard Publish Library und kopiere den Einbettungscode für deine Dokumentenbibliothek. Wenn du mehr als eine Dokumentenbibliothek erstellt hast, öffne den Libraries Bildschirm und kopiere den Code für die bestimmte Dokumentenbibliothek, die du zu HubSpot hinzufügen möchtest.
Verwende deinen eigenen Einbettungscode, nicht dieses Beispiel:
<iframe src="https://your-library.documentlibrary.app/?dlp_embed=1" title="Document library" style="display:block;width:100%;border:0;height:600px;" loading="lazy"></iframe> <script src="https://your-library.documentlibrary.app/?dlp_embed_resize=1" async></script>
Kostenlose und Starter-Tarife von HubSpot
Mit den kostenlosen und Starter-Tarifen von HubSpot kannst du keine eigenen Module erstellen. Deshalb verwende das integrierte Rich-Text Modul. Es gibt zwei Möglichkeiten, und beide funktionieren gleich.
Methode 1: Einbettung einfügen
- Öffne die HubSpot-Seite, auf der du die Dokumentenbibliothek anzeigen möchtest.
- Zieh ein Rich-Text Modul auf die Seite oder klicke auf ein Rich-Text Modul, das bereits vorhanden ist.
- Klicken Einfügen in der Symbolleiste.
- Wähle Einbetten.
- Füge deinen Document Library Pro-Einbettungscode ein.
- Klicken Einfügen.
Im kostenlosen Tarif gibt es kein separates Einbetten Modul in der Modulliste. Rich-Text ist der Weg.
Methode 2: In den Quellcode einfügen
- Öffne die HubSpot-Seite, auf der du die Dokumentenbibliothek anzeigen möchtest.
- Zieh ein Rich-Text Modul auf die Seite oder klicke auf ein Rich-Text Modul, das bereits vorhanden ist.
- Klicken Erweitert.
- Wähle Quellcode.
- Füge deinen Document Library Pro-Einbettungscode ein.
- Klicken Änderungen speichern.
Diese Methode passt, wenn du mit HTML vertraut bist. Hier gehst du später auch hin, wenn du die Breite der Dokumentenbibliothek ändern musst.
HubSpot Professional- und Enterprise-Tarife
Beide Methoden oben funktionieren auch mit HubSpot Professional- und Enterprise-Tarifen, und sie sind der schnellste Weg. Diese Tarife schalten außerdem den Design Manager frei, sodass ein Entwickler den Einbettungscode in ein eigenes Modul packen kann, wenn dein Team ihn auf vielen Seiten wiederverwenden möchte. Das ist optional und erfordert jemanden, der mit HubSpot-Templates vertraut ist.
Die Dokumentenbibliothek auf die richtige Breite bringen
Wenn du die Dokumentenbibliothek einfügst, schätzt HubSpot, wie breit sie sein sollte. HubSpot wählt etwas Schmales, normalerweise 317 Pixel. Dadurch wirkt die Dokumentenbibliothek in eine dünne Spalte gequetscht.
HubSpot hat eine Volle Breite Schaltfläche, die das normalerweise beheben würde. Für die Dokumentenbibliothek funktioniert sie nicht, weil die Dokumentenbibliothek ein kleines Script enthält. HubSpot graut die Schaltfläche aus.
Dieselbe ausgegraute Schaltfläche sperrt auch die Felder für Breite und Höhe. Du kannst dort ebenfalls keine Breite eingeben.
Der einzige Weg, die Breite festzulegen, ist daher der Quellcode:
- Klicke auf das Rich-Text Modul, das deine Dokumentenbibliothek enthält.
- Klicken Erweitert.
- Wähle Quellcode.
- Suche max-width: 317px.
- Ändere 317 in die gewünschte Breite in Pixeln. 1100 ist für die meisten Seiten ein sinnvoller Ausgangspunkt.
- Klicken Änderungen speichern.
Die Dokumentenbibliothek wird auf kleineren Bildschirmen und Smartphones weiterhin verkleinert. Die Zahl, die du eingibst, ist eine maximale Breite, keine feste Breite.
Veröffentlichen und Seite prüfen
Klicken Veröffentlichen, oder Aktualisieren wenn die Seite bereits live ist.
Die Dokumentenbibliothek passt ihre Größe an ihre Inhalte an. Das bedeutet, dass die HubSpot-Seite wächst und schrumpft, wenn Besucher zwischen Dokumentseiten wechseln.
Der HubSpot-Editor zeigt nicht immer das fertige Ergebnis an. Prüfe die veröffentlichte Seite, nachdem du die Änderung gespeichert hast.
Wenn die Dokumentenbibliothek nicht erscheint
Stelle zuerst sicher, dass du beide Zeilen des Einbettungscodes eingefügt hast. Die zweite Zeile ermöglicht es der Dokumentenbibliothek, ihre Größe selbst anzupassen.
Prüfe als Nächstes die veröffentlichte Seite, statt dich auf die Editor-Vorschau zu verlassen. Auf der Live-Seite bestätigst du, dass die Dokumentenbibliothek korrekt angezeigt wird.