Eine benutzerdefiniert kodierte Vorlage in HubSpot erstellen
Zuletzt aktualisiert am: Januar 19, 2023
Entwickler können Blog-, Website-, Landing-Page- und E-Mail-Vorlagen von Grund auf mit HTML erstellen. Sie können auch ein Drag-&-Drop-Vorlagenlayout zu HTMLklonen und es dann als Code-Vorlage anpassen.
Bitte beachten: Um benutzerdefinierte E-Mail-Vorlagen zu erstellen, ist ein Marketing Hub Professional - oder Enterprise -Konto erforderlich.
Eine neue HTML- & HubL-Datei erstellen
- Gehen Sie in Ihrem HubSpot-Account zu Marketing > Dateien und Vorlagen > Design-Manager.
- Erstellen Sie in der linken Seitenleiste eine neue Datei, indem Sie auf „Datei“ > „Neue Datei“ klicken. Sie müssen möglicherweise auf da folderOrdner-Symbol klicken, um den Finder zu erweitern.
- Klicken Sie im Dialogfeld auf das Dropdown-Menü „Was möchten Sie erstellen?“ und wählen Sie „HTML und HUBL“ aus.

- Klicken Sie auf „Weiter“.
- Geben Sie die Details Ihrer neuen Datei ein:
- Wählen Sie „Vorlage“ oder „Teilvorlage“ aus. Eine Teilvorlage ist eine Vorlage, die in anderen Vorlagen verwendet werden kann.
- Wählen Sie im Dropdown-Menü den Typ der Vorlage aus, die Sie erstellen (Seite, Blog oder E-Mail).
- Geben Sie Ihren Datei einen Namen.
- Um den Speicherort der Datei zu aktualisieren, klicken Sie im Abschnitt „Dateispeicherort“ auf „Ändern“ und wählen Sie den Ordner aus, dem die Datei hinzugefügt werden soll.
- Klicken Sie auf „Erstellen“.
- Schreiben Sie als Nächstes den HTML-Code für Ihre Seite oder E-Mail-Vorlage.
- Um in einer Vorschau anzuzeigen, wie Ihr HubL dargestellt wird, klicken Sie auf den Schalter „ Ausgabe anzeigen“, um ihn zu aktivieren. Auf der rechten Seite wird ein Bereich mit der gerenderten Vorschau geöffnet.
- Klicken Sie oben rechts auf „Vorschau“, um in einer Vorschau anzuzeigen, wie Ihre Vorlage im Content-Editor aussieht und funktioniert. Diese Vorschau wird mit dem Editor synchronisiert und bei der Arbeit automatisch aktualisiert.
- Klicken Sie oben rechts auf „Änderungen veröffentlichen“.
Weitere Ressourcen zu benutzerdefinierten Designs finden Sie in der Dokumentation von HubSpot-Designer. Es gibt zusätzliche Dokumentation zu Code-Moduloptionen wie Filter-Tags und Symbole.
Erforderliche HubL-Tags hinzufügen
Bei einem etwaigen Veröffentlichungsversuch der Datei erhalten Sie eine Fehlermeldung, falls Ihrem Code erforderliche HubL-Tags fehlen.
Website-, Landing-Page- und Blog-Vorlagen erfordern die folgenden Tags:
{{standard_footer_includes}}
{{standard_header_includes}}
- Fügen Sie dieses Token hinzu, mit den der CAN-SPAM-Abschnitt zum Abmelden eingefügt wird:
{{unsubscribe_section}}
. Fügen Sie dann diese Token einzeln hinzu:{{site_settings.company_street_address_1}}
{{site_settings.company_city}}
{{site_settings.company_state}}
{{site_settings.company_zip}}
- Bei dieser Methode ist es nicht möglich, die Sprache und den Stil von Text und Links zu formatieren.

- Verwenden Sie diese Token einzeln:
{{site_settings.company_name}}
{{unsubscribe_link}}
oder{{unsubscribe_link_all}}
(mindestens einen beinhalten){{unsubscribe_anchor}}
{{site_settings.company_name}}
{{site_settings.company_street_address_1}}
{{site_settings.company_city}}{{site_settings.company_state}}
{{site_settings.company_zip}}
- Mithilfe der Token können Sie die Flexibilität, um die Token und links und links in den gewünschten Stil und Sprache hinzuzufügen.
Zu HTML klonen
Neben dem Erstellen einer komplett neuen Vorlage können Sie auch eine der HubSpot-Vorlagen zu HTML klonen. Das Klonen einer Vorlage zu HTML ermöglicht Ihnen Zugriff auf den HTML-Content einer Vorlage.
So erstellen Sie eine Code-Version einer vorhandenen Vorlage:
- Gehen Sie in Ihrem HubSpot-Account zu Marketing > Dateien und Vorlagen > Design-Manager.
- Klicken Sie im Finder auf „Aktionen“ > „Zu HTML klonen“. Die HTML-Datei wird im gleichen Ordner wie die Originaldatei erstellt. Der Dateiname stimmt mit dem Namen der ursprünglichen Vorlage überein, an die kopieren angehängt ist.

Verwandte Artikel
-
Benutzerdefinierte Schriftarten in HubSpot
Die für Content in HubSpot verfügbaren Schriftarten hängen vom Content und der Schriftart ab. Bestimmte...
Wissensdatenbank -
Google Tag Manager-Code zu HubSpot-Content hinzufügen
Sie können Google Tag Manager mit HubSpot integrieren, um Ihre auf HubSpot gehosteten Landing-Pages,...
Wissensdatenbank -
Smart-Content-Regeln erstellen und verwalten
Smart-Content-Module zeigen unterschiedliche Versionen Ihres Contents basierend auf der Besucherkategorie an....
Wissensdatenbank