Eine benutzerdefiniert kodierte Vorlage in HubSpot erstellen
Zuletzt aktualisiert am: Juni 28, 2023
Mit einem der folgenden Abonnements verfügbar (außer in den angegebenen Fällen):
|
Entwickler können Blog-, Website-Seiten, Landingpage- und E-Mail-Vorlagen mithilfe von HTML von Grund auf neu erstellen. Sie können auch ein Drag-&-Drop-Vorlagenlayout zu HTMLklonen und es dann als Code-Vorlage anpassen.
Bitte beachten:Es ist ein Marketing Hub Professional- oder Enterprise-Account erforderlich, um E-Mail-Vorlagen auf Basis von benutzerdefiniertem Code zu erstellen.
Eine neue HTML- & HUBL-Datei erstellen
- Gehen Sie in Ihrem HubSpot-Account zum Abschnitt Marketing, klicken Sie dann auf Dateien und Vorlagen und abschließend auf Design-Manager.
- Erstellen Sie in der linken Seitenleiste eine neue Datei, indem Sie auf „Datei“ > „Neue Datei“ klicken. Sie müssen möglicherweise auf das 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-, Landingpage- und Blog-Vorlagen erfordern die folgenden Tags:
{{standard_footer_includes}}
{{standard_header_includes}}
- Fügen Sie dieses Token hinzu, mit dem 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 einfügen){{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 zum Abschnitt Marketing, klicken Sie dann auf Dateien und Vorlagen und abschließend auf 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.
