Gewusst wie: So erstellen und bearbeiten Sie Website-Seiten

Zuletzt aktualisiert am: May 18, 2016

Anforderungen

Produkt: HubSpot Marketing
Abonnement: Basic, Pro, & Enterprise
Add-ons: Website

Mit dem Editor für Website-Inhalte erstellen und bearbeiten Sie die Inhalte für Ihre eigentlichen Website-Seiten.

Gehen Sie folgendermaßen vor, um Website-Seiten für Ihre auf HubSpot gehostete Website zu erstellen.

Die Seiten Ihrer Website aufrufen

Navigieren Sie im HubSpot-Dashboard zu Content > Website (Inhalte > Website).

HubSpot Help article screenshot

Auf Create a New Website Page (Neue Website-Seite erstellen) klicken

Klicken Sie auf die Schaltfläche Create a New Website Page (Neue Website-Seite erstellen).

HubSpot Help article screenshot

Vorlage für die Seite auswählen

Als Nächstes sollten Sie eine Vorlage auswählen, die Sie als Grundgerüst für Ihre Seite verwenden möchten. Sie können die vorhandenen Vorlagen in Ihrem Account durchsuchen, eine Premium-Vorlage auf dem HubSpot-Marketplace erwerben oder ein neues Vorlagenlayout erstellen, indem Sie ein Modell in ein Vorlagenlayout umwandeln. Eine Anleitung zur Umwandlung eines Modells in ein Vorlagenlayout finden Sie hier.

Nachdem Sie die gewünschte Vorlage ausgewählt haben, müssen Sie auf die betreffende Vorlage klicken und die neue Website-Seite benennen. Klicken Sie dann auf Create (Erstellen).

HubSpot Help article screenshot

Inhalte zu der Website-Seite hinzufügen

Nachdem Sie die Seite erstellt haben, gelangen Sie zum Bildschirm Edit (Bearbeiten). Hier können Sie Ihre Inhalte hinzufügen oder bearbeiten. 

Zum Bearbeiten der Inhalte in den Modulen auf Ihrer Seite bewegen Sie den Mauszeiger über das jeweilige Modul, bis Sie eine durchsichtige graue Schattierung und ein Bleistift-Symbol über dem Modul sehen. Klicken Sie in das Modul, um es zu bearbeiten. In dem nachfolgenden Beispiel sehen Sie die Bewegungen zum Bearbeiten des Logo-Moduls, des Header-Moduls und eines Rich-Text-Moduls auf dieser Website-Seite.

HubSpot Help article screenshot

Sie können auch auf der linken Seite auf das Bleistift-Symbol klicken, um die Module auf Ihrer Seite zu bearbeiten. Wenn Sie auf dieses Symbol klicken, werden alle bearbeitbaren Module auf Ihrer Seite angezeigt. Wenn Sie auf ein einzelnes Modul klicken, wird ein Pop-up-Fenster zur Bearbeitung des Moduls im Editor angezeigt.

HubSpot Help article screenshot

Module zum Layout hinzufügen (flexible Spalten)

Wenn Ihre Vorlage flexible Spalten verwendet, sehen Sie ein Plus-Symbol auf der linken Seite. Von hier aus gelangen Sie zu einem Abschnitt, in dem Sie einen Modul-Typ auswählen können, um diesen per Drag-and-Drop in Ihr Seitenlayout einzufügen.

HINWEIS: Sie sehen das Plus-Symbol auf der linken Seite NUR, WENN Ihr Vorlage flexible Spalten enthält; anderenfalls wird es nicht angezeigt.

HubSpot Help article screenshot

Seiten-Einstellungen bearbeiten

Klicken Sie zum Bearbeiten der Einstellungen für Ihre Seite auf die Registerkarte Settings (Einstellungen) oben im Editor für Website-Seiten.
HubSpot Help article screenshot

Am oberen Rand des Bildschirms Settings (Einstellungen) sehen Sie einen Abschnitt mit der Bezeichnung Basic Info (Allgemeine Info). Hier können Sie die allgemeinen Seiteninformationen für Suchmaschinen und Browser einfügen. In diesem Abschnitt sollten Sie Folgendes hinzufügen:

1. Page Name (Name der Seite): Dies ist der interne Name für Ihre Website-Seite. Beim ersten Erstellen der Seite müssten Sie diese bereits benannt haben, aber Sie können den Namen hier bearbeiten. Diese Seite kann hilfreich für Sie sein, um Ihre Inhalte zu organisieren. Sie können sie beliebig nutzen, denn die Besucher Ihrer Website werden diesen Namen niemals zu sehen bekommen.
2. Page Title (Seitentitel): Dies ist der Ausdruck, der in der oberen Leiste Ihres Webbrowsers angezeigt wird, wenn die Seite geladen wird.
3. Page URL (Seiten-URL): Dies ist die URL für Ihre Website. Bei Bedarf können Sie die Domain in der Drop-down-Liste ändern.
4. Meta Description (Meta-Beschreibung): Dies ist der Inhalt, der in den Suchergebnissen unterhalb des Seitentitels angezeigt wird.
5. Campaign (Kampagne): In dieser Drop-down-Liste können Sie eine HubSpot-Kampagne auswählen, um Ihre Website-Seite mit dieser Kampagne zu verknüpfen. Sie können auch auf die Schaltfläche Add New (Neu hinzufügen) klicken, um eine neue Kampagne zu erstellen.
HubSpot Help article screenshot


Unter dem Abschnitt Basic Info (Allgemeine Info) befindet sich der Abschnitt Advanced Options (Erweiterte Optionen). Dieser umfasst weitere Einstellungen für die Seite, die Einstellungen für Stile und Vorlagen.

Sie können auf die Links Edit Head HTML (HTML-Kopfbereich bearbeiten) oder Edit Footer HTML (HTML-Fußbereich bearbeiten) klicken, um den HTML-Kopfbereich oder -Fußbereich zu bearbeiten. Dort können Sie unbearbeitete HTML-Snippets, Einbindungscodes oder Tracking-JavaScripts zwischen die - oder

-Tags auf Ihrer Seite einfügen. Fügen Sie den Code in das Pop-up-Fenster ein, und klicken Sie auf Save (Speichern). 
-Tags auf Ihrer Seite einfügen. Fügen Sie den Code in das Pop-up-Fenster ein, und klicken Sie auf Save (Speichern). 
-Tags auf Ihrer Seite einfügen. Fügen Sie den Code in das Pop-up-Fenster ein, und klicken Sie auf Save (Speichern).

 

HubSpot Help article screenshot

Hier können Sie Ihre Seite auch mit einem Passwortschutz versehen. Diese Option ist hilfreich, wenn Sie folgende Möglichkeiten nutzen möchten:

  • Erstellen einer Seite auf Ihrer Website allein für Ihre Mitarbeiter. Speicherung von Verkaufs- und Marketingmaterialien hier, wo nur Ihre Teammitglieder Zugriff darauf haben.
  • Erstellen einer „ausschließlich für Kunden“ vorgesehenen Seite auf Ihrer Website, Veröffentlichung von Vorlagen und kundenspezifischen Materialien an dieser Stelle.
  • Einrichten einer Seite für Händler und Partner, damit diese hier erweiterte Materialien vor der Markteinführung eines Produkts beziehen können.

So aktivieren Sie ein Passwort für diese Seite: Aktivieren Sie das Kontrollkästchen neben „Password protect this page“ (Diese Seite mit einem Passwortschutz versehen), und geben Sie Ihr Passwort in das eingeblendete Textfeld ein.

HubSpot Help article screenshot

Sie können auch angeben, ob die Seite zu einem bestimmten Termin ablaufen soll oder nicht. Dies kann hilfreich sein, wenn Sie eine Website-Seite zu einem begrenzten Angebot oder Produkt erstellen möchten, das Sie empfehlen möchten. Aktivieren Sie das Kontrollkästchen neben „Set page expiration and date“ (Seitenablauf und Termin festlegen), um diese Funktion zu aktivieren. Wählen Sie dann ein Ablaufdatum, eine Ablaufuhrzeit, und geben Sie an, wohin Sie diese Seite umleiten möchten, nachdem sie abgelaufen ist.

HubSpot Help article screenshot

Daraufhin wird der Abschnitt Style Settings (Stil-Einstellungen) angezeigt, in dem Sie folgende Bearbeitungen vornehmen können:

  • Primary CSS File (Primäre CSS-Datei): Hier können Sie die gewählte Einstellung für die primäre CSS-Datei überprüfen und diese über das Drop-down-Menü aktivieren, deaktivieren oder die Standardeinstellung verwenden.
  • Domain Stylesheets (Domain-Stylesheets): Hier können Sie überprüfen, welche CSS-Datei Sie für Ihre gesamte Domain verwenden, und diese über das Drop-down-Menü aktivieren, deaktivieren oder die Standardeinstellung verwenden.
  • Template Stylesheets (Vorlagen-Stylesheets): Hier können Sie überprüfen, welche CSS-Datei Sie an die von dieser Seite verwendete Vorlage angefügt haben, und Sie können diese über das Drop-down-Menü aktivieren, deaktivieren oder die Standardeinstellung verwenden.
  • Page-specific Stylesheets (Seitenspezifische Stylesheets): Hier können Sie überprüfen, welche CSS-Dateien nur auf diese Seite angewendet werden. Klicken Sie auf + Add stylesheet (+ Stylesheet hinzufügen), wenn Sie eine CSS-Datei auf diese spezifische Seite anwenden möchten.
HubSpot Help article screenshot

Im Abschnitt Template Settings (Vorlagen-Einstellungen) können Sie mit Swap template (Vorlage tauschen) die Vorlage tauschen, falls Sie eine andere Vorlage verwenden möchten als die aktuell verwendete Vorlage, oder Sie können mit Edit template (Vorlage bearbeiten) das Layout Ihrer Vorlage aufrufen und bearbeiten. Auf der rechten Seite dieses Abschnitts sehen Sie den Namen und eine Vorschau der Vorlage, die Ihre Seite aktuell verwendet.

HubSpot Help article screenshot

Suchmaschinen-Optimierung (SEO)

Klicken Sie auf das Balkendiagramm-Symbol auf der linken Seite, um zum Abschnitt SEO Optimization (SEO) zu navigieren. Von hier aus können Sie speziell für diese Seite Keywords in das Textfeld eingeben und Keywords auswählen. Darunter sehen Sie alle ausstehenden Aufgaben. Hierbei handelt es sich um Elemente, die Sie auf Ihrer Seite verändern können, um diese insgesamt zu verbessern. Beispiele für derartige Elemente sehen Sie im nachfolgenden Bildschirmfoto.

HubSpot Help article screenshot

Eine Vorschau der Seite anzeigen

Im Menü auf der linken Seite können Sie auch das Auge-Symbol wählen, um den Abschnitt Preview (Vorschau) aufzurufen. Von hier aus können Sie Folgendes tun:

  • Device preview (Geräte-Vorschau): Klicken Sie auf eines der hier angezeigten Symbole, um eine Vorschau Ihrer Seite für das jeweilige Anzeigegerät (Tablet, Smartphone usw.) anzuzeigen.
  • Smart Preview (Intelligente Vorschau): Aktivieren Sie das Kontrollkästchen neben „Preview page as specific contact“ (Vorschau der Seite als bestimmter Kontakt anzeigen), und wählen Sie einen Kontakt aus dem Drop-down-Menü aus. Hierdurch können Sie eine Vorschau der Seite anzeigen, wie sie für den jeweiligen Besucher wiedergegeben wird. Dies kann hilfreich sein, wenn Sie auf Ihrer Seite Smart Content verwenden, den Sie testen möchten.
  • Shareable preview (Teilbare Vorschau): Klicken Sie auf diese Schaltfläche, um einen Link zu einer Vorschau anzuzeigen, den Sie mit Kollegen teilen können (auch wenn Ihre Seite noch nicht live ist). 
HubSpot Help article screenshot

Seite veröffentlichen oder planen

Nun, da Sie Ihren Inhalt fertig bearbeitet und für Suchmaschinen optimiert haben und mit dem Aussehen Ihrer Vorschau zufrieden sind, müssen Sie eine der Registerkarten Publish (Veröffentlichen) oder Schedule (Planen) aufrufen.

Dort haben Sie zwei Möglichkeiten zur Auswahl: Publish now (Jetzt veröffentlichen) oder Schedule for later (Für einen späteren Zeitpunkt planen). Klicken Sie auf das Optionsfeld unter der gewünschten Option (wenn Sie Schedule for later (Für einen späteren Zeitpunkt planen) auswählen, müssen Sie Datum und Uhrzeit für Ihren Zeitplan eingeben), und klicken Sie dann oben rechts auf die blaue Schaltfläche Schedule (Planen) oder Publish (Veröffentlichen), um den Zeitplan für die Veröffentlichung zu bestätigen oder die Seite sofort zu veröffentlichen. 

HubSpot Help article screenshot

Vorheriger Artikel:

Measuring Your Performance Project

Weiter zum nächsten Artikel: