Eine benutzerdefiniert kodierte Vorlage in HubSpot erstellen

Entwickler können Blog-, Website-Seiten, Landing-Page- und E-Mail-Vorlagen mithilfe von HTML von Grund auf neu erstellen. Sie können auch ein Layout einer Drag-&-Drop-Vorlage in HTML kopieren, dann anpassen es als codierte Vorlage.

Erfahren Sie mehr über die Arbeit mit benutzerdefinierten Designs in unserer Entwicklerdokumentation. 

Bitte beachten Sie: ein Marketing Hub Professional oder Enterprise Account ist erforderlich, um benutzerdefinierte kodierte E-Mail-Vorlagen zu erstellen.

Erstellen Sie eine neue HTML- und HubL-Datei

• Gehen Sie in Ihrem HubSpot-Account zu Content > Design-Manager.
• Klicken Sie in der linken Seitenleiste auf das Dropdown-Menü Datei und > Neue Datei. 
• Klicken Sie im Dialogfeld auf das Dropdown-Menü Was möchten Sie heute erstellen? und wählen Sie HTML & HubL, dann 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. 
  • Klicken Sie auf das Dropdown-Menü Vorlagentyp und wählen Sie den Typ der Vorlage, die Sie kodieren (Seite, Blog Post/Listing, E-Mail oder Systemseite).
  • Geben Sie in das Feld Dateiname einen Dateinamenein. 
  • Um den Speicherort der Datei zu aktualisieren, klicken Sie im Abschnitt Dateispeicherort auf Ändern und wählen Sie einen Ordner. 
• Klicken Sie auf Erstellen.
• Geben Sie im Code-Editor den HTML-Code für Ihre Vorlage ein.
• Um anzuzeigen, wie Ihr HubL gerendert wird, klicken Sie auf den Schalter Show output. Auf der rechten Seite wird ein Fenster mit der gerenderten Vorschau geöffnet.

• Um eine Vorschau des Aussehens Ihrer Vorlage zu erhalten, klicken Sie auf das Dropdown-Menü Vorschau oben rechts und wählen Sie Live-Vorschau mit Anzeigeoptionen. 
• Wenn Sie mit der Bearbeitung fertig sind, klicken Sie oben rechts auf Änderungen veröffentlichen . 
• Bei Codefehlern wird eine Fehlermeldung angezeigt. Weitere Informationen zu diesen Fehlern finden Sie in der Fehlerkonsole unterhalb des Code-Editors. 

Erforderliche HubL-Tags hinzufügen

Für benutzerdefinierte Vorlagen sind bestimmte HubL-Variablen erforderlich, damit sie funktionieren. Wenn eine dieser erforderlichen Variablen fehlt, erscheint eine Fehlermeldung, wenn Sie versuchen, die Vorlage zu veröffentlichen. 

Seiten- und Blogvorlagen benötigen die folgenden Tags:

• {{standard_footer_includes}}
• {{standard_header_includes}}

• {{unsubscribe_link}} oder (mindestens eine Angabe) {{unsubscribe_link_all}}
• {{unsubscribe_anchor}}
• {{site_settings.company_name}}
• {{site_settings.company_street_address_1}}
• {{site_settings.company_city}}{{site_settings.company_state}}
• {{site_settings.company_zip}}

Kopieren einer Vorlage in HTML

Neben der Möglichkeit, eine Vorlage von Grund auf neu zu erstellen, können Sie auch Drag-&-Drop-Vorlagen für Blogs, Webseiten und Landingpages in HTML kopieren.

So erstellen Sie eine Code-Version einer vorhandenen Vorlage:

• Gehen Sie in Ihrem HubSpot-Account zu Content > Design-Manager.
• Öffnen Sie in der linken Seitenleiste die Vorlage, die Sie kopieren möchten. 
• Klicken Sie auf das Dropdown-Menü Aktionen und wählen Sie In HTML kopieren. Die HTML-Datei wird im gleichen Ordner wie die Originaldatei erstellt.