Eine Website mit HubSpot CMS und Content Hub erstellen

Das HubSpot Content Hub vereint das CMS (Content-Management-System) und das CRM (Customer-Relationship-Management) in einem System bzw. Plattform. Und das macht es so interessant für Unternehmen.

Mit dem intuitiven HubSpot CMS erstellen Sie Ihre Webseiten und Landing Pages relativ schnell, ohne Kenntnisse von Code. Und die Verwaltung Ihrer Webseiten ist so was von einfach, voll ausgestattet mit etlichen Such- und Filterfunktionen. Sie können sogar Ihre eigene Ansicht erstellen, speichern und noch einiges mehr. Bei der Optimierung Ihrer Webseiten werden Sie von dem integrierten SEO-Tool unterstützt und Sie können Ihren Content auf den Webseiten sowie Landing Pages auf Wunsch auch personalisieren.

Was will man mehr?

Bevor ich Ihnen die einzelnen Schritte nenne, wie Sie eine Webseite erstellen, möchte ich Ihnen gerne, die Tools auflisten, die Sie in der Benutzernavigation auf der linken Seite unter Content finden.

Diese Tools finden Sie im Content Hub

In der Benutzernavigation finden Sie unter Content folgende Auswahl, da müssen Sie später hin, um eine Webseite zu erstellen:

• Website-Seiten
• Landingpages
• Blog
• Podcasts
• Fallstudien
• Content-Einbettungen
• Wissensdatenbank
• Kundenportal
• HubDB, damit kann man ganz tolle, dynamische Webseiten erstellen, jetzt lesen
• Content-Aufbereitung
• SEO, hier gibt es 5 Tipps zu dem HubSpot SEO-Tool
• Zugriffsberechtigungen
• Design-Manager

Je nachdem welche Content Hub Lizenz Sie erwerben, stehen Ihnen nicht alle Funktionen zur Verfügung.

Wenn Sie eine Webseite erstellen, werden Sie natürlich auch ein paar Bilder, Videos oder Dokumente verwenden. Der Datei-Manager ist der Bibliothek (Navigation) zugeordnet. Am besten legen Sie sich ein paar Ordner an, das macht es übersichtlicher. Es gibt im Datei-Manager auch eine Suchfunktion, deshalb verwenden Sie bitte Dateinamen.

Über die einzelnen Features und Vorteile des HubSpot CMS habe ich einen Artikel geschrieben, gerne können Sie ihn hier lesen.

Für die Kontaktseite und Landing pages werden Sie sicherlich ein Formular haben möchten, das Sie unter Marketing ⇒ Formulare erstellen können.

So, und jetzt geht es los.

Wie erstelle ich eine Webseite in HubSpot?

Ich gehe mal davon aus, dass Sie einen Account bei HubSpot haben, wenn nicht müssen Sie sich erstmal bei HubSpot registrieren. Dieser Account kann auch kostenlos genutzt werden, um zu testen, wie es funktioniert, eine Webseite in HubSpot zu erstellen.

Wenn Sie es direkt professional angehen möchten, müssen Sie Ihre Domain noch verknüpfen. Um die Domain zu verknüpfen gehen Sie zu den Einstellungen ⇒ Tools / Content ⇒ Domains & URLs. Für die Verknüpfung der Domain benötigen Sie den Zugriff auf Ihre DNS-Einträge. Viele Hoster unterstützen das Anmelden und die direkte Verknüpfung der Domain oder Subdomain mit HubSpot, dann müssen Sie sich beim Vorgang nur bei Ihren Anbieter anmelden. Ansonsten müssen Sie die Verknüpfung manuell vornehmen.

Ein Theme (Design-Vorlage) auswählen

Zum ausprobieren können Sie ein kostenloses Theme von HubSpot nehmen, ansonsten haben Sie 2 weitere, flexible (Drag & Drop) Möglichkeiten. Sie nehmen eine Theme von Marketplace oder Sie lassen sich ein Custom Theme coden. Ein Theme von Marketplace kann auch ohne weiteres an Ihre Wünsche angepasst werden, dies setzt nur ein Child Theme voraus.

Wenn Sie sich entschieden haben, können Sie die Designeinstellungen, wie Schriftart, Farben und so, wie folgt vornehmen, Sie können es auch ruhig später machen. Wenn Sie beim Seiten Editor sind, klicken Sie oben auf Bearbeiten ⇒ Design. Oder Sie gehen zu den Einstellungen ⇒ Tools / Content ⇒ Design & Module.

Wenn Sie eine kostenlose Designvorlage von HubSpot verwenden, müssen Sie erst ein Child Theme erstellen, um Zugriff für die Designeinstellungen über die Einstellungen ⇒ Tools / Content ⇒ Design & Module zu haben.

Mein Tipp, erstellen Sie immer ein Child Theme, es gibt immer irgendwelche Anpassungswünsche am Aussehen oder den Funktionen bei den vorhandenen Theme-Modulen.

Um ein Child Theme zu erstellen gehen Sie zu Content ⇒ Design-Manager. Bei @hubspot finden Sie die kostenlosen Themes von HubSpot, bei @marketplace sind die Designvorlagen, die Sie runtergeladen haben. Ein Child Theme zu erstellen funktioniert bei @hubspot indem Sie mit der Maus darüber gehen und die rechte Taste klicken, dann erscheint an dritter Stelle ⇒ Untergeordnetes Design erstellen.

Bei @marketplace müssen Sie zuerst den Theme-Ordner öffnen und im zweiten Schritt die Vorgehensweise, wie zuvor beschrieben machen.

Und bitte tun Sie sich selbst einen gefallen: Ein Theme mit vielen weiteren Modulen von verschiedenen Anbieter zu kombinieren, geht auf Dauer nicht gut. Ihre Änderungen am Theme, die Änderungen der Module vom anderen Anbieter, da trifft unterschiedlicher Code aufeinander. Das kann sich gegenseitig behindern, besonders bei zukünftigen Updates.

Die Webseite erstellen

Dafür gehen Sie zu Content ⇒ Website-Seiten. Oben rechts ist ein Button ⇒ Erstellen, klicken Sie darauf. Es erscheint ein Fenster mit zwei Feldern, für die Domain und den Namen bzw. Titel der Webseite. Danach suchen Sie sich eine bzw. die entsprechende Designvorlage aus.

Bei den Themes sind der Header und Footer Globale Module, diese geben das gleiche Erscheinungsbild auf allen Webseiten wieder. Das Logo zieht sich HubSpot automatisch aus Ihrem Branding, das können Sie unter Einstellungen ⇒ Account-Verwaltung / Account-Einstellungen finden bzw. einfügen.

Für Ihre Website werden Sie für den Header ein Menü brauchen, diese können Sie unter Einstellungen ⇒ Tools / Content ⇒ Navigationsmenüs erstellen. Beim Footer gibt es je nach Theme zwei unterschiedliche Varianten für die Menüs: Entweder Sie müssen, wie beim Header vorgehen, und ein Menü erstellen oder Sie können es direkt im Footer machen.

Nun können Sie loslegen und Ihren Content einpflegen, die Module können Sie verschieben, löschen und neue hinzufügen. Zum Schluss oder vorher, wie Sie möchten, müssen Sie noch beim Seiten-Editor unter Einstellungen ein paar Eingaben tätigen. Bei der URL (diese wird erstmal automatisch vom Titel gezogen) achten Sie bitte darauf, die Umlaute anzupassen, diese werden nicht automatisch in die richtige Schreibweise für URLs umgesetzt.

Bei der Metabeschreibung sollten 155 Zeichen nicht überschritten werden, da diese nicht angezeigt werden und ein halber Satz ist so eine Sache... Dann gibt es da noch die Möglichkeit das Feature-Bild und die Sprache einzustellen. Beim Feature-Bild hat sich eine Größe von 1200px mal 675px bewährt, bitte denken Sie daran unbedingt einen Alt-Text für das Bild einzugeben.

Wenn Sie das alles gemacht haben können Sie Live gehen, dafür klicken Sie oben rechts auf Veröffentlichen.

Herzlichen Glückwunsch.

Sie brauchen Unterstützung, hier geht es zu unseren CMS Service.

Sie wünschen direkt eine Beratung, dann buchen Sie ein Online Meeting mit François.

Bildquelle: AdobeStock © Stock 4 You 883189005