Landingpages - Teil 3: Bearbeiten der Einstellungen aller Elemente Ihrer Landingpage

💡 Gut zu wissen
Landingpages sind im Rahmen von Business- und Enterprise-Plänen verfügbar.

In diesem Artikel erklären wir Ihnen, wie Sie die Abschnitte und Elemente auf Ihrer Landingpage konfigurieren. Nachdem Sie die Abschnitte auf Ihrer Landingpage angeordnet haben, ist es nun Zeit, sie mit Elementen wie Text, Bildern oder Schaltflächen zu füllen.

Wir haben eine Reihe von Artikeln erstellt, die Ihnen beim Aufbau Ihrer Landingpages helfen:

Allgemeine Einstellungen

Einige Einstellungen gelten sowohl für Abschnitte als auch für Elemente. Zunächst erklären wir die allgemeinen Einstellungen, dann diejenigen, die für Abschnitte bzw. Elemente spezifisch sind.

Ausrichtung

mceclip0.png

Mit der Einstellung Ausrichtung können Sie wählen, wie ein Element ausgerichtet sein soll (horizontal oder vertikal):

Abstand

mceclip1.png

Mit der Einstellung Abstand können Sie den vertikalen und horizontalen Abstand um und in Abschnitten und Elementen festlegen:

  • Außenabstand erstellt einen Abstand um eine Komponente, außerhalb der definierten Ränder.
  • Füllung erstellt einen Abstand in einer Komponente, zwischen dem Abschnitt oder Element und seinen Rändern.

Sie können zwischen verschiedenen Abstandgrößen wählen, von XS (klein) bis XL (sehr groß).

Sichtbarkeit

mceclip5.png

Für Abschnitte:

  • Mit der Einstellung Sichtbarkeit können Sie die Sichtbarkeit der Abschnitte Ihrer Landingpage basierend auf dem Gerät steuern, auf dem sie angezeigt wird. Sie können die Optionen Auf Mobilgerät verbergen und/oder Auf Desktop verbergen wählen.
  • Wenn Sie einen Abschnitt auf einem bestimmten Gerät verbergen, wird er im Editor durchgestrichen angezeigt und diese Nachricht erscheint: "Dieser Abschnitt ist auf einem Mobilgerät/Desktop nicht sichtbar", je nach gewählter Option.
mceclip6.png

Für Elemente:

  • Mit der Einstellung Sichtbarkeit können Sie die Sichtbarkeit einiger Elemente Ihrer Landingpage basierend auf dem Gerät steuern, auf dem sie angezeigt wird. Sie können die Optionen Auf Mobilgerät verbergen und/oder Auf Desktop verbergen wählen.
  • Diese Einstellung hat keine visuellen Auswirkungen im Editor und beeinflusst nur die veröffentlichten Landingpages, um zu verhindern, dass Sie den Überblick über Inhalte im Editor verlieren.

 

Hintergrundfarbe

mceclip7.png Mit der Einstellung Hintergrundfarbe können Sie eine Hintergrundfarbe zu einem Abschnitt oder Element hinzufügen und seine Transparenz verwalten.
💡 Gut zu wissen
Die Textfarbe ändert sich abhängig von der Hintergrundfarbe des Abschnitts automatisch.

Hintergrundbild

mceclip8.png

Mit der Einstellung Hintergrundbild können Sie ein Bild aus Ihrer Bildbibliothek, über eine URL oder von Ihrem Computer als Hintergrundbild eines Abschnitts oder eines Elements hinzufügen:

  • Beschriftung: Schreiben Sie eine Beschriftung für das Hintergrundbild.
  • Entfernen: Löschen Sie das aktuelle Hintergrundbild.
  • Ersetzen: Wählen Sie ein neues Hintergrundbild, um das aktuelle zu ersetzen.
  • Hintergrundgröße: Wählen Sie, wie sich das Hintergrundbild in den Abschnitt oder das Element einfügen soll.
  • Hintergrund-Wiederholung: Wählen Sie, ob das Hintergrundbild im gesamten Abschnitt oder Element wiederholt werden soll.
  • Farbüberlagerung: Wählen Sie eine Farbe, die über dem Inhalt des Abschnitts oder Elements hinzugefügt werden soll, und verwalten Sie ihre Transparenz.

Abschnitt

Eigenschaften

mceclip9.png

Mit der Einstellung Eigenschaften können Sie den Abschnitt umbenennen. Der Name Ihrer Abschnitte wird angezeigt, wenn Sie im Menüfeld Layout navigieren.
💡 Gut zu wissen
Wir empfehlen, Ihre Abschnitte zu benennen, um den Überblick zu behalten und die Navigation zu erleichtern.

Stil

mceclip10.png

Über die Einstellung Stil können Sie das Erscheinungsbild des Abschnitts festlegen:

  • Kante zu Kante: Dies beeinflusst den horizontalen Abstand an den Seiten des Abschnitts.
  • Volle Höhe: Zeigt das Bild als Vollbild an.
  • Hintergrund-Parallax: Parallax-Scrolling sorgt dafür, dass das Hintergrundbild langsamer scrollt als der Inhalt im Vordergrund.

Hintergrundfarbe, Hintergrundbild und Abstand

Die Einstellungen Hintergrundfarbe, Hintergrundbild und Abstand werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Zeile

Zeilen sind nur im klassischen Landingpage-Editor verfügbar.

Sie können die Einstellungen einer Zeile bearbeiten, indem Sie über das linke Menüfeld zur Registerkarte Layout navigieren. Details dazu finden Sie in Landingpages - Teil 2: Definieren der Struktur auf Ihrer Landingpage. Sie können außerdem die Brotkrümelnavigation verwenden, die oben auf Ihrem Bildschirm angezeigt wird, wenn Sie auf ein Element klicken.

mceclip11.png

Hintergrundfarbe, Hintergrundfarbe, Abstand und Sichtbarkeit

Die Einstellungen Hintergrundfarbe, Hintergrundbild, Abstand und Sichtbarkeit werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Erweitert

mceclip12.png
  • Zwischenräume zwischen Spalten verbergen: Legen Sie die Größe der Lücke (Zwischenraum) zwischen den Spalten Ihrer Zeile fest.
  • Rundung der Ecken: Ermöglicht es Ihnen, die Ecken Ihrer Zeile abzurunden. 

Spalte

Spalten sind nur im klassischen Landingpage-Editor verfügbar.

Sie können die Einstellungen einer Spalte bearbeiten, indem Sie über das linke Menüfeld zur Registerkarte Layout navigieren. Details dazu finden Sie in Landingpages - Teil 2: Definieren der Struktur auf Ihrer Landingpage. Sie können außerdem die Brotkrümelnavigation verwenden, die oben auf Ihrem Bildschirm angezeigt wird, wenn Sie auf ein Element klicken.

mceclip11.png

Stil

mceclip13.png
  • Größe ändern: Legen Sie die Breite Ihrer Spalte fest.
  • Mobile Größe: Legen Sie fest, wie breit Ihre Spalte auf Mobilgeräten sein soll.
  • Rundung der Ecken: Ermöglicht es Ihnen, die Ecken Ihrer Spalte abzurunden. 

Hintergrundfarbe, Hintergrundfarbe, Abstand und Sichtbarkeit

Die Einstellungen Hintergrundfarbe, Hintergrundbild, Abstand und Sichtbarkeit werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Text

Neuer Landingpage-Editor
mceclip14.png
Klassischer Landingpage-Editor
mceclip15.png

Sie können ein Text-Element hinzufügen und Text auf Ihrer Landingpage formatieren. 

Format-Symbolleiste

mceclip16.png

Mit der Format-Symbolleiste können Sie den Stil Ihres Texts ändern. Wählen Sie den Text aus, den Sie bearbeiten möchten, um die Format-Symbolleiste anzurufen, und klicken Sie auf die 3 Punkte rechts, um auf weitere Optionen zuzugreifen.

Ausrichtung und Abstand

Die Einstellungen Ausrichtung und Abstand werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Bild

Neuer Landingpage-Editor
mceclip18.png
Klassischer Landingpage-Editor
mceclip19.png

Bilder sind eine gute Möglichkeit, um das Design Ihrer Landingpage anzupassen und interaktiver zu gestalten. Sie können ein Bild aus unserer Bildbibliothek oder von Ihrem Computer auswählen oder über eine URL einfügen.

Ausrichtung und Abstand

Die Einstellungen Ausrichtung und Abstand werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Bild

mceclip21.png

Die Bild-Einstellungen ermöglichen es Ihnen, ein Bild auszuwählen und seine Größe zu verändern:

  • Bild-URL: Geben Sie die URL des Bildes ein, das Sie hinzufügen möchten.
  • Entfernen: Löschen Sie das aktuelle Bild.
  • Ersetzen: Wählen Sie ein neues Bild, um das aktuelle zu ersetzen.
  • Größe anpassen: Legen Sie Größe des Bildes fest.

Stil

mceclip22.png

Über die Einstellung Stil können Sie das Erscheinungsbild des Bildes festlegen:

  • Schattierung: Fügen Sie einen Schatten zu Ihrem Bild hinzu.
  • Rundung der Ecken: Runden Sie die Ecken des Bildes ab.
  • Stil und Farbe der Ränder und Farbe: Fügen Sie einen Rand zu Ihrem Bild hinzu und wählen Sie seine Farbe.
  • Breite des Rands: Legen Sie fest, wie breiter der Rand des Bildes sein soll.
  • Rundung der Ecken: Legen Sie die Rundung der Ecken Ihres Bildes fest.

Logo

Neuer Landingpage-Editor
mceclip23.png
Klassischer Landingpage-Editor
mceclip33.png

Logos sind ideal, um Ihre Marke auf Ihrer Landingpage hervorzuheben.

Ausrichtung und Abstand

Die Einstellungen Ausrichtung und Abstand werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Bild

mceclip1.png

Über die Bild-Einstellung können Sie ein Logo auswählen und seine Größe ändern:

  • Beschriftung: Schreiben Sie eine Beschriftung für das Logo.
  • Bild-URL: Geben Sie die URL des Logos ein.
  • Entfernen: Löschen Sie das aktuelle Logo.
  • Ersetzen: Wählen Sie ein neues Logo, um das aktuelle zu ersetzen.
  • Logo zuschneiden: Schneiden Sie das Logo auf die gewünschte Größe zu.
  • Alt: Fügen Sie ein Alt-Tag hinzu, um Ihr Logo mit beschreibenden Informationen zu versehen.
  • Link: Fügen Sie einen Weiterleitungslink zu Ihrem Logo hinzu.

Stil

Die Einstellung Stil ist nur im neuen Landingpage-Editor verfügbar.

mceclip26.png

Über die Einstellung Stil können Sie das Erscheinungsbild des Logos festlegen:

  • Stil und Farbe der Ränder: Fügen Sie einen Rand zu Ihrem Logo hinzu und wählen Sie seine Farbe.
  • Breite des Rands: Legen Sie fest, wie breit der Rand des Logos sein soll.
  • Rundung der Ecken: Legen Sie die Rundung der Ecken Ihres Logos fest.

Schaltfläche

Neuer Landingpage-Editor

mceclip27.png

Klassischer Landingpage-Editor
mceclip28.png

Sie können ein Schaltfläche-Element verwenden, um eine Website oder eine andere Unterseite Ihrer Landingpage zu verlinken. Durch das Hinzufügen von Schaltflächen zu Ihrer Landingpage können Sie bestimmte Links hervorheben, auf die die Besucher klicken sollen. 

Ausrichtung, Abstand und Sichtbarkeit

Die Einstellungen Ausrichtung, Abstand und Sichtbarkeit werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Eigenschaften

mceclip29.png

Mit der Einstellung Eigenschaften können Sie den Link definieren, auf den die Schaltfläche verweisen soll:

  • Call-to-Action: Geben Sie den Text ein, der in Ihrer CTA-Schaltfläche angezeigt werden soll.
  • Eine Aktion wählen: Sie können zwischen drei Aktionen wählen: "Mit einer URL verlinken", "In einem Abschnitt verankern" oder "Mit einer Seite in diesem Funnel verlinken".
    Wenn Sie "Mit einem Abschnitt verankern" wählen, wählen Sie im Drop-down-Menü den gewünschten Abschnitt aus.
    Wenn Sie "Mit einer Seite in diesem Funnel verlinken" wählen, wählen Sie im Drop-down-Menü die gewünschte Seite aus.
  • Ein Ziel wählen: Legen Sie fest, ob der Link in einem neuen Tab geöffnet werden soll.
  • URL (Link): Fügen Sie den Link hinzu, auf den die Schaltfläche verweisen soll.

Stil

mceclip30.png

Über die Einstellung Stil können Sie das Erscheinungsbild der Schaltfläche festlegen:

  • Farbe: Wählen Sie die Farbe der Schaltfläche aus.
  • Stil und Farbe der Außenlinien: Wählen Sie einen Typ für die Außenlinien der Schaltfläche und ihre Farbe.
  • Breite der Außenlinien: Legen Sie fest, wie breit die Außenlinien der Schaltfläche sein sollen.
  • Volle Breite: Wählen Sie, ob die Schaltfläche so breit sein soll wie Ihre Seite.
  • Füllung: Wählen Sie, ob die Schaltfläche ausgefüllt oder leer sein soll:
    mceclip0.png
  • Form: Wählen Sie, ob die Schaltfläche viereckig, rund oder oval sein soll.
  • Schattierung: Fügen Sie eine helle oder dunkle Schattierung zu der Schaltfläche hinzu.
  • Schaltflächensymbol: Fügen Sie der Schaltfläche ein Symbol hinzu und wählen Sie dessen Position.

Trenner

💡 Gut zu wissen
Es können nur horizontale Teiler hinzugefügt werden.
Neuer Landingpage-Editor

mceclip31.png

Klassischer Landingpage-Editor
mceclip32.png

Sie können außerdem ein Trenner-Element verwenden, um die verschiedenen Elemente und Abschnitte auf Ihrer Landingpage visuell zu trennen. 

Abstand

Die Einstellung Abstand wird im Abschnitt Allgemeine Einstellungen in diesem Artikel beschrieben.

Stil

mceclip38.png

Wählen Sie die Dicke des Trenners: Dünn, dick oder sehr dick.

Farbe

mceclip39.png

Wählen Sie die Farbe des Trenners.

Formular

Neuer Landingpage-Editor

mceclip34.png

Klassischer Landingpage-Editor
mceclip35.png

Sie können ein Formular-Element verwenden, um eine Landingpage zur Leadgenerierung zu erstellen. Weitere Informationen zu Formularen auf einer Landingpage finden Sie in dem Artikel Teil 4: Hinzufügen eines Formulars und Nutzung von erweiterten Optionen.

Icon

Neuer Landingpage-Editor

mceclip37.png

Klassischer Landingpage-Editor
mceclip24.png

Sie können ein Icon-Element verwenden, um visuellen Content hinzufügen und Ihre Landingpage zu illustrieren.

Ausrichtung und Abstand

Die Einstellungen Ausrichtung und Abstand werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Einstellungen

mceclip40.png

Über die Einstellungen für Icons können Sie ein Icon auswählen und sein Erscheinungsbild anpassen:

  • Ersetzen: Wählen Sie ein neues Icon aus, um das aktuelle zu ersetzen.
  • Anpassen: Legen Sie Größe des Icons fest.
  • Hintergrund: Fügen Sie eine Hintergrundfarbe zum Icon hinzu.
  • Vordergrund: Fügen Sie eine Vordergrundfarbe zum Icon hinzu.
  • Stil und Farbe der Ränder:  Fügen Sie einen Rand zum Icon hinzu und wählen Sie seine Farbe aus.
  • Breite des Rands: Legen Sie fest, wie breit der Rand des Icons sein soll.
  • Rundung der Ecken: Legen Sie die Rundung der Ecken des Icons fest.
  • Link: Fügen Sie einen Weiterleitungslink zu Ihrem Icon hinzu.

Video

Neuer Landingpage-Editor

mceclip41.png

Klassischer Landingpage-Editor
mceclip42.png

Sie können ein Video-Element auf Ihrer Landingpage verwenden, um Ihre Marke oder Ihre Produkte zu präsentieren, ohne zu viel Text zu verwenden.

Abstand

Die Einstellung Abstand wird im Abschnitt Allgemeine Einstellungen in diesem Artikel beschrieben.

URL

mceclip43.png Mit der Einstellung URL können Sie den Link zum Video hinzufügen. Sie können ein Video verwenden, das auf YouTube, Vimeo, Dailymotion, Canal+, Wista, Twitch, Youku oder Coub gehostet wird.

Stil

mceclip44.png

Über die Einstellung Stil können Sie das Erscheinungsbild des Videos verwalten:

  • Stil und Farbe der Ränder: Fügen Sie einen Rand zum Video hinzu und wählen Sie seine Farbe aus.
  • Breite des Rands: Legen Sie fest, wie breit der Rand des Videos sein soll.
  • Rundung der Ecken: Legen Sie die Rundung der Ecken des Videos fest.

Container

Das Container-Element ist nur im neuen Landingpage-Editor verfügbar.

mceclip45.png

Sie können ein Container-Element verwenden, um mehrere Elemente zu gruppieren und gleichzeitig zu verschieben oder in der Größe anzupassen.

Hintergrundbild, Abstand und Sichtbarkeit

Die Einstellungen Hintergrundbild, Abstand und Sichtbarkeit werden im Abschnitt Allgemeine Einstellungen dieses Artikels beschrieben.

Stil

mceclip46.png

Über die Einstellung Stil können Sie das Erscheinungsbild des Containers festlegen:

  • Hintergrundfarbe und Transparenz: Fügen Sie eine Hintergrundfarbe zum Container hinzu und verwalten Sie seine Transparenz.
  • Stil und Farbe der Ränder: Fügen Sie einen Rand zum Container hinzu und wählen Sie seine Farbe aus.
  • Position des Rands: Legen Sie fest, auf welcher Seite des Containers ein Rand hinzugefügt werden soll.
  • Breite des Rands: Definieren Sie, wie breit der Rand des Containers sein soll.
  • Rundung der Ecken: Legen Sie die Rundung der Ecken des Containers fest.
  • Schattierung: Fügen Sie einen Schatten zu Ihrem Container hinzu.

Code

Neuer Landingpage-Editor

mceclip47.png

Klassischer Landingpage-Editor
mceclip48.png

Sie können ein Code-Element verwenden, um Code Snippets zu Ihrer Landingpage hinzuzufügen, zum Beispiel einen Facebook-Kommentarbereich

💡 Gut zu wissen
Der im Editor eingefügte Code kann nur auf veröffentlichten Landingpages getestet werden.

⏩ Nächste Schritte

🤔 Sie haben eine Frage?

Wenden Sie sich bei Fragen an unser Support-Team: Erstellen Sie einfach ein Ticket über Ihr Konto. Wenn Sie noch kein Konto haben, können Sie uns hier kontaktieren.

Wenn Sie Unterstützung bei einem Projekt mit Brevo suchen, können wir Sie mit dem richtigen zertifizierten Brevo-Expertenpartner zusammenbringen.

💬 War dieser Beitrag hilfreich?

0 von 11 fanden dies hilfreich