Design-Manager | Häufig gestellte Fragen

Finden Sie schnell Antworten und allgemeine Informationen über den Design-Manager in der HubSpot-Software. Dieser Artikel enthält außerdem Links zu weiteren Ressourcen für Designer, die in dem CMS arbeiten.

Wo kann ich bei HubSpot mehr über Designs erfahren?

Weitere Informationen zum Design in HubSpot erhalten Sie im Zertifizierungskurs „Wachstumsorientiertes Design“ der HubSpot Academy und in der CMS-Dokumentation von HubSpot. 

Die Design-Zertifizierung ist eine kostenlose Zertifizierung, die Videoschulungen und ein Designpraktikum enthält. 

Die CMS-Dokumentation von HubSpot umfasst:

• HubSpot CMS-Referenzdokumentation
• HubL-Referenzdokumentation
• HubSpot Boilerplate CSS
• Tutorials
• Beispiele zur Inspiration
• Designer-Blog

Gibt es eine HubSpot-Ressource, auf die ich zur Fehlerbehebung bei Designs mit benutzerdefiniertem Code oder HubL zurückgreifen kann?

Die beste Anlaufstelle für den Kontakt mit der HubSpot-Designer-Community ist das HubSpot-Designforum. Dieses Forum wird von HubSpot-Designern und HubSpot-Benutzern mit Designkenntnissen beobachtet.

Bei Fragen zur HubSpot-API-Entwicklung finden Sie Unterstützung im Entwicklerforum. 

Wie erhalte ich FTP-Zugang zu der HubSpot-Software?

Am 27. Mai 2020 wurde FTP eingestellt und durch CMS-CLI ersetzt. Erfahren Sie mehr über diese Bekanntgabe.

Kann ich eine globale Gruppe für eine einzelne Vorlage bearbeiten?

Globale Module können zwar zurück in lokale Module konvertiert werden, doch für globale Gruppen ist dies nicht möglich. Um eine globale Gruppe für eine einzelne Vorlage zu bearbeiten, klonen Sie die globale Gruppe und fügen Sie die geklonte Gruppe Ihrer Vorlage hinzu.

Welche Version von Bootstrap verwendet der HubSpot-Vorlagendesigner?

Der HubSpot-Layout-Editor verwendet ein 12-Spalten-Rastersystem auf der Basis von Bootstrap 2.x, damit Vorlagendesigner schnell responsive  Webseiten  in der HubSpot-Content-Plattform erstellen können.

Kann ich mein eigenes responsives Raster mit HubSpot-Vorlagen verwenden?

Alle HubSpot-Drag-&-Drop-Layouts enthalten automatisch die Datei layout.css, um Module responsiv zu machen. Wenn Sie ein anderes oder ein benutzerdefiniertes responsives Raster wie z. B. Bootstrap 3 benutzen möchten, müssen Sie entweder das CSS in layout.css überschreiben oder codierte Vorlagen verwenden, denen layout.css nicht angehängt ist.

Wie kann ich meinen Blog-Beitrag und mein Listing-Layout neu strukturieren?

Mit den Modulen für Blog-Inhalte können Sie das Mark-up des Beitrags sowie des Listing-Layouts bearbeiten und festlegen, wo die verschiedenen Elemente eines Beitrags dargestellt werden. 

Kann ich eine frühere Version einer Vorlage wiederherstellen?

Alle Vorlagenlayouts, codierten Dateien und Seiten weisen einen Versionsverlauf auf, durch den jede beliebige Version einer Vorlage oder eines Content-Elements wiederhergestellt werden kann. Klicken Sie für Vorlagen und codierte Dateien auf Aktionen > Bearbeitungen anzeigen, um auf den Versionsverlauf zuzugreifen. 

Design-Manager V2

Was ist der Unterschied zwischen „widget“ und „module“ in Verweisen auf Modulfelder?

Im Modul-Framework V1 wurde mit {{ widget.field }} auf Modulfelder verweisen. Im Modul-Framework V2 wird mit {{ module.field }} auf Modulfelder verweisen.

Jedoch funktioniert auch {{ widget.field }} weiterhin im Framework V2 wie erwartet. Es ist nicht notwendig, Ihre benutzerdefinierten Module auf Verweise mittels „module“ zu aktualisieren.

Wie kann ich JS- und CSS-Dateien ohne „get_public_template_url“ anhängen?

Statt „get_public_template_url“ zum Aufrufen von JavaScript- und CSS-Dateien zu verwenden, können diese Dateien nun direkt  im Abschnitt Verlinkte Dateien in der Seitenleiste des Modul-Editors angehängt werden. CSS- und JS-Dateien werden automatisch auf Seiten geladen, die dieses Modul verwenden.

Wie kann ich meiner Vorlage Module vom Typ „Benutzerdefinierter HTML-Code“ oder „Benutzerdefinierte HubL“ hinzufügen?

HTML- und HubL-Module wurden entfernt. Mit diesen Modulen konnten Entwickler rasch HTML- und HubL-Snippets in Vorlagen aufnehmen. Sie konnten es jedoch schwierig machen, die Vorlagen zu verstehen und zu bearbeiten. Damit die Vorlagen berechenbarer und einfacher zu pflegen sind, wurden diese Module entfernt, und der gesamte Code muss nun im Kontext von benutzerdefinierten Modulen vorgehalten werden.

Wenn Sie auf einer Website HTML-Code auf einzelnen Seiten hinzufügen möchten, können Sie das Modul „HTML“ im HubSpot Marketplace herunterladen.

Wie kann ich JS-Plugins mit meinem benutzerdefinierten Modul verwenden?

Wenn Sie einen Drittanbieter-Skript verwenden, verlinken Sie die Skript-Datei im Abschnitt Verlinkte Dateien des Modul-Editors. Dann können Sie das Plugin im Abschnitt „JS“ des Code-Editors auslösen. Wenn Sie Parameter an das Plugin übergeben müssen, können Sie Datenattribute im Abschnitt „HTML + HUBL“ im Editor verwenden, um diese Werte zu speichern.

Bei einem Upgrade werde ich gefragt, wo ich dieses Modul verwenden möchte. Was ist der Unterschied zwischen diesen Optionen?

Wenn Sie ein benutzerdefiniertes Modul in einer E-Mail verwenden, werden die Abschnitte „CSS“ und „JS“ nicht im Editor angezeigt, da Stylesheets und JavaScript in den meisten E-Mail-Clients nicht unterstützt werden. Bei E-Mail-Modulen können Sie die gewünschten Stile in <style>-Tags einfügen.

Wenn Sie ein Modul auf Ihren Seiten oder in Ihren Blog-Beiträgen verwenden, werden die Abschnitte „CSS“ und „JS“ wie erwartet angezeigt.

Gibt es Änderungen daran, wie der Code für Module im Design-Manager V2 verfasst werden muss?

Module wurden im alten Design-Manager in <span>-Tags eingeschlossen, im Design-Manager V2 werden sie hingegen in <div>-Tags eingeschlossen. Diese Änderung wirkt sich nur auf Ihr Modul aus, wenn Sie in einem Stylesheet auf „span“ des Moduls verweisen. Die folgende Deklaration ist beispielsweise im neuen Design-Manager unwirksam:

span #hs_cos_wrapper_widget_5038393204 { Color: blue; }

Sie können das <span>-Tag durch ein <div>-Tag ersetzen. Es wird jedoch nicht empfohlen, beim Verfassen Ihres CSS auf HubSpot-Standard-Wrapper zurückzugreifen. Es ist besser, benutzerdefinierte CSS-Klassen wie „mein-benutzerdefiniertes-modul“ zu verwenden.

Beim Upgrade des Moduls wird ein Fehler zu „verschachtelten Modulen“ ausgegeben. Wie kann ich dies lösen und das Modul veröffentlichen?

Erfahren Sie mehr darüber, wie Sie Fehler zu verschachtelten Modulen identifizieren und beheben. Für verschachtelte Module, die in einer Reihe von Vorlagen verwendet werden, ist es am besten, das Modul zuerst zu klonen, um zu vermeiden, das Content auf einzelnen Seiten verloren geht. Beheben Sie anschließend die Fehler im geklonten Modul, und verwenden Sie ab dann diesen Klon in Ihren Vorlagen.

Wie kann ich meinem Modul eine globale Gruppe hinzufügen?

Statt im benutzerdefinierten Modul die Zeichenfolge „{% include %}“ zu verwenden, um eine globale Gruppe hinzuzufügen, können Sie Ihrem Modul ein Menüfeld hinzufügen oder den globalen Content des Moduls bearbeiten.

Kann ich meine benutzerdefinierten Module aus V1 im neuen Design-Manager verwenden?

Ja, Sie können alle älteren Module im Modul-Editor bearbeiten. Es werden Validierungswarnungen und Vorschläge für Code angezeigt, der im Modul-Framework V2 nicht unterstützt wird. Sie können die Bearbeitung jedoch fortsetzen und diese Module weiterhin in der HubSpot-Software verwenden.

Sie können zwar alle bestehenden benutzerdefinierten Module behalten, jedoch keine neuen Module unter VErwendung des alten Frameworks erstellen. Wenn Sie ein älteres Modul klonen, wird das geklonte Modul im neuen Modul-Framework erstellt.