Hinweis: Dieser Artikel wird aus Kulanz zur Verfügung gestellt. Er wurde automatisch mit einer Software übersetzt und unter Umständen nicht korrekturgelesen. Die englischsprachige Fassung gilt als offizielle Version und Sie können dort die aktuellsten Informationen finden. Hier können Sie darauf zugreifen.
Landing Pages

Landing-Page mit einer Starter-Vorlage erstellen

Zuletzt aktualisiert am: Mai 11, 2021

Produkte/Lizenzen

Alle

Sie können eine Starter-Vorlage verwenden, um eine einfache Landing-Page mit einem Ccontent-Angebot für Ihre Website-Besucher zu erstellen. In diesem Artikel erfahren Sie, wie Sie eine neue Landing-Page erstellen, Ihr Seitendesign anpassen und Ihre Seite veröffentlichen.

Bitte beachten: Starter-Vorlagen unterstützen nicht Smart Content, benutzerdefinierte Module, Personalisierung, Zugriff auf Quellcode in Rich-Text-Modulen oder erweiterte Optionen wie das Wechseln zu einer anderen Vorlage und den Zugriff auf Header-HTML.


Bevor Sie loslegen

Landing-Page mit einer Starter-Vorlage erstellen

So erstellen Sie eine neue Landing-Page mit einer Starter-Vorlage:

  • Gehen Sie in Ihrem HubSpot-Account zu Marketing > Website > Landing-Pages.
  • Klicken Sie oben rechts auf „Erstellen“ > „Landing-Page“.
  • Klicken Sie im Menü der Seitenleiste links auf „Alle Ihre Vorlagen“.
  • Bewegen Sie den Mauszeiger über eine Vorlage und klicken Sie oben rechts auf „Vorschau“.

preview-starter-template

  • Um eine Seite mit dieser Vorlage zu erstellen, klicken Sie oben rechts auf „Vorlage verwenden“.

Seiteninhalte bearbeiten

Starter-Vorlagen enthalten Blöcke an Website-Content, die Module genannt werden. Sie können diese Module in horizontalen Zeilen oder in vertikalen Spalten neu anordnen.

Zeilen und Spalten können in Elementbereiche gruppiert werden. Indem Sie Elemente zusammen gruppieren, können Sie Hintergrundstile auf einen ganzen Bereich Ihrer Seite anwenden. Sie können diese Elemente auch per Drag-&-Drop verschieben, um das Layout Ihrer Seite neu zu gestalten. Erfahren Sie mehr darüber, wie Sie Seiten-Content in einem Drag-&-Drop-Bereich bearbeiten.

Um die Darstellung Ihrer Seiteninhalt auf einem Mobilgerät anzupassen, klicken Sie auf das mobile edi„Für Mobilgeräte bearbeiten“-Symbol oben links.

edit-page-for-mobile

Schriftarten, Farben und Schaltflächen anpassen

Um die Standardstile für Ihre Start-Vorlage anzupassen, klicken Sie im linken Bereich auf die Registerkarte „Design“. Sie können auch die Hintergrundfarbe oder das Hintergrundbild für eine bestimmte Zeile, eine bestimmte Spalte oder einen bestimmten Abschnitt Ihrer Seite anpassen.

edit-starter-theme-on-page

Typografie

Bearbeiten Sie im Abschnitt „Typografie“ die Schriftarten und Schriftstile für den Text und die Überschriften auf Ihrer Seite. Es werden nur Google-Schriftarten unterstützt.
  • Haupttext: Passen Sie die Schriftart, die Schriftgröße und die Schriftfarben für den Hauptteil Ihrer Seite an:
    • Klicken Sie auf das Dropdown-Menü „Haupttext“, um die Schriftart auszuwählen.
    • Klicken Sie auf die Pfeiltasten, um die Schriftgröße auszuwählen.
    • Klicken Sie auf das Farbfeld, um eine Farbe für Ihre Schriftart auszuwählen. Um eine benutzerdefinierte Farbe festzulegen, klicken Sie auf die Registerkarte „Erweitert“ und geben Sie einen Hexadezimal-Wert ein.
  • Überschriften: Passen Sie die Schriftart und Farbe für Text in Ihren Modulen mit einem Heading-Tag an.
    • Klicken Sie auf das Dropdown-Menü „Überschriften“, um eine Schriftart auszuwählen.
    • Klicken Sie auf das Farbfeld, um eine Schriftfarbe auszuwählen.
  • Link-Text: Passen Sie die Schriftarten und Farben für Links auf Ihrer Seite an.
    • Klicken Sie auf das Dropdown-Menü „Link-Text“, um eine Schriftart auszuwählen.
    • Klicken Sie auf das Farbfeld, um eine Link-Farbe auszuwählen.
    • Klicken Sie auf die Styling-Schaltflächen oder das Dropdown-Menü, um die Stile für Ihren Link-Text auszuwählen.
    • Um anzupassen, wie Links dargestellt werden, wenn Besucher mit Ihrer Seite interagieren, können Sie die Link-Farbe und -Transparenz ändern.
      • Farbe des Links beim Daraufzeigen: Passen Sie die Farbe und Transparenz von Link-Text an, wenn ein Besucher den Mauszeiger auf den Link bewegt.
      • Farbe des aktiven Links: Passen Sie die Farbe und Transparenz von Link-Text an, bevor der Link angeklickt wird.
      • Farbe des besuchten Links: Passen Sie die Farbe und Transparenz von Link-Text an, nachdem ein Besucher den Link angeklickt hat.

Buttons

Passen Sie im Abschnitt „Schaltflächen“ die Art und Weise an, wie einfache Schaltflächen und Schaltflächen zur Formulareinsendung auf der Seite mit Stilen formatiert sind.
  • Button-Hintergrundfarbe: Passen Sie die Farbe für den Hintergrund Ihrer Schaltflächen an.
    • Geben Sie einen Hexadezimal-Wert ein oder klicken Sie auf das Farbfeld, um eine Farbe auszuwählen.
    • Geben Sie einen Prozentwert ein oder klicken Sie auf die Pfeiltasten, um die Transparenz der Hintergrundfarbe Ihrer Schaltflächen festzulegen.
  • Button-Textfarbe: Die Farbe für den Text von Schaltflächen auf Ihrer Seite.
    • Geben Sie einen Hexadezimal-Wert ein oder klicken Sie auf das Farbfeld, um eine Farbe für den Text auszuwählen.
    • Geben Sie einen Prozentwert ein oder klicken Sie auf die Pfeiltasten, um die Transparenz der Textfarbe Ihrer Schaltflächen festzulegen.
  • Button-Eckenradius: Passen Sie die Form Ihrer Formular-Schaltflächen an, indem Sie einen Wert eingeben oder den Schieberegler ziehen. Ein höherer Wert bedeutet, dass die Schaltflächen auf Ihrer Seite abgerundete Ränder haben, während ein Wert von 0 bedeutet, dass Ihre Schaltflächen quadratisch sind.

Bitte beachten: Es empfiehlt es sich, einheitliche Farben, Schriftarten und Stile basierend auf den Einstellungen der Registerkarte „Design“ zu verwenden. Sie können auf der Registerkarte „Optionen“ im linken Bereich die Standardstile für ein Modul überschreiben.

Seite für Suchmaschinen optimieren

Klicken Sie auf die Registerkarte „Optimieren“, um das SEO-Tool zu öffnen. Hier können Sie Empfehlungen für das Verbessern der Performance Ihrer Inhalte in Suchmaschinenergebnissen anzeigen.

Seiteneinstellungen bearbeiten

Klicken Sie auf die Registerkarte „Einstellungen“, um Ihre Seitendetails anzupassen.

  • Interner Seitenname: Der Seitenname, der nur HubSpot-Benutzern angezeigt wird. Für Besucher ist er nicht sichtbar.
  • Seitentitel: Der Titel, der oben in der Registerkarte Ihres Webbrowsers angezeigt wird, wenn die Seite geladen wird.
  • Seiten-URL: Die URL für Ihre Seite. Sie erscheint in der URL-Leiste im Browser, wenn Besucher zu dieser Seite navigieren. Sie können Ihre Seiten-URL auch nach der Veröffentlichung bearbeiten.
  • Meta-Beschreibung: Der Inhalt, der in den Suchergebnissen unterhalb des Seitentitels angezeigt wird.
  • Feature-Bild: Klicken Sie auf diesen Schalter, um ihn zu aktivieren und damit ein bestimmtes Bild zu präsentieren, wenn Ihre Seite in sozialen Medien geteilt wird. Klicken Sie auf „Hochladen“, um ein Bild aus Ihrem Computer auszuwählen, oder auf „Bilder durchsuchen“, um ein Bild aus Ihrem Datei-Tool auszuwählen.

Seite in Vorschau anzeigen und veröffentlichen

Bevor Ihre Seite live geht, klicken Sie oben rechts auf „Vorschau“, um zu testen, wie Ihre Seite auf Desktop- und Mobilgeräten angezeigt wirdKlicken Sie oben rechts auf „Veröffentlichen”, wenn Sie mit der Vorschau Ihrer Seite zufrieden sind.