Nachdem Sie die Abschnitte Ihrer Landingpage angeordnet haben, müssen Sie sie mit Elementen wie Text, Bildern oder Schaltflächen füllen. In diesem Artikel erfahren Sie mehr über die Konfiguration von Abschnitten, Zeilen, Spalten und Elementen, um die perfekte Landingpage zu erstellen!

Wir haben eine Reihe von Artikeln zusammengestellt, um Ihnen bei der Erstellung Ihrer Landingpages zu helfen. 

• Vorwort: Was ist eine Landingpage?
• Teil 1: Konfigurieren Ihrer Landingpage
• Teil 2: Definieren der Struktur auf Ihrer Landingpage 
• Teil 3: Bearbeiten der Einstellungen aller Elemente Ihrer Landingpage - SIE SIND HIER
• Teil 4: Hinzufügen eines Formulars und erweiterte Optionen 
• Teil 5: Veröffentlichen Ihrer Landingpage

In diesem Tutorial werden folgende Themen behandelt:

Allgemeine Einstellungen Abschnitte Zeilen Spalten Text Bild, Hintergrundbild und Logo Hintergrundfarbe

Schaltfläche Trenner Icon Video Code Abstand Ausrichtung

Allgemeine Einstellungen

Einige Einstellung werden für Abschnitte, Zeilen und Spalten (und sogar Elemente) vorgenommen. Als erstes beschreiben wir die allgemeinen Einstellungen und gehen dann auf die spezifischeren ein.

Abstand

Wählen Sie zunächst, ob Sie die vertikale oder horizontale Füllung und den Rand bearbeiten möchten.  Ein Rand ist der Bereich außerhalb eines Elements, die Füllung ist der Bereich in einem Element. Rand: Erstellt einen Bereich um Ihre Komponente, außerhalb der festgelegten Ränder. Füllung: Erstellt einen Bereich in Ihrer Komponente, zwischen dem Icon und dem Rand. Sie können zwischen verschiedenen Arten von Abständen wählen, von XS (sehr klein) bis XL (sehr groß).

Sichtbarkeit

Diese Einstellungen haben keine visuellen Auswirkungen im Editor. Sie wirken sich nur auf veröffentlichte Seiten aus, damit Sie im Editor nicht den Überblick über den Inhalt verlieren.

• Auf Tablet verbergen: Im Bearbeitungsbereich können Sie die Sichtbarkeit jedes Abschnitts Ihrer Landingpage nach Gerätetyp steuern. 
• Auf Mobilgerät verbergen: Im Bearbeitungsbereich können Sie die Sichtbarkeit jedes Abschnitts Ihrer Landingpage nach Gerätetyp steuern.

Hintergrundfarbe und Hintergrundbild

Hier können Sie eine Hintergrundfarbe und Transparenz hinzufügen.

Für das Hintergrundbild können Sie ein Bild von Ihrem Computer, aus unserer Bildergalerie oder über eine URL wählen. Unsere Galerie enthält Hunderte von (gebührenfreien) Archivbildern, die Sie auf Ihrer Landingpage verwenden können.

Abschnitte

Eigenschaften Ihres Abschnitts

Hier können Sie Ihren Abschnitt benennen. Der Name wird angezeigt, wenn Sie im linken Menü in Layout navigieren.

Stil

Klicken Sie auf Stil, um die Stil-Einstellungen anzuzeigen:

Kante an Kante: Dies beeinflusst den horizontalen Abstand an den Seiten des Abschnitts. Volle Höhe: Zeigt das Bild als Vollbild an. Hintergrund-Parallax: Parallax-Scrolling ist eine Technik der Computergrafik, bei der das Hintergrundbild langsamer scrollt als der Inhalt im Vordergrund.

Zeilen

Sie können die Einstellungen einer Zeile bearbeiten, indem Sie die Registerkarte Layout im linken Menü öffnen, wie in Landingpages - Teil 2: Definieren der Struktur auf Ihrer Landingpage beschrieben. Sie können auch den Breadcrumb-Trail nutzen, der oben auf Ihrem Bildschirm angezeigt wird, wenn Sie auf ein Element klicken.

Hintergrundfarbe, Abstand und Sichtbarkeit

Die ersten Einstellungen sind dieselben wie oben in Allgemeine Einstellungen. 

Erweitert

Spaltenzwischenräume verbergen: Legt die Größe der Lücke (Zwischenraum) zwischen den Spalten Ihrer Zeile fest. Rahmen: Ermöglicht es Ihnen, die Ecken Ihrer Zeile abzurunden.

Spalten

Stil

In der Registerkarte Stil haben Sie folgende Optionen:

Größe ändern: Legen Sie die Breite Ihrer Spalte fest. Mobile-Größe: Legen Sie die Breite Ihrer Spalte auf Mobilgeräten fest. Rahmenbreite bearbeiten: Ermöglicht es Ihnen, die Ecken Ihrer Spalte abzurunden.

Hintergrundfarbe/-bild, Abstand und Sichtbarkeit

Die anderen Einstellungen sind dieselben wie oben unter Allgemeine Einstellungen. 

Text

Sie können den Stil Ihres Texts mit der Formatierungsleiste ändern. Wählen Sie einfach den Text, den Sie bearbeiten möchten, um die Leiste anzuzeigen. Sie können auf weitere Optionen zugreifen, indem Sie rechts auf die 3 Punkte klicken.

Bild und Logo

Bilder und Logos sind ideal, um das Design Ihrer E-Mails anzupassen und ansprechender zu gestalten.

Um ein Bild oder ein Logo hinzuzufügen, geben Sie entweder Ihre URL ein oder klicken Sie auf HINZUFÜGEN (oder ERSETZEN) in der rechten Seitenleiste. Ein Dateimanager-Pop-up wird angezeigt.

• Importieren Sie eine Datei von Ihrem Computer.
• Wählen Sie ein Bild aus der Galerie: Links im Builder wird ein Menü angezeigt, mit dem Sie nach gebührenfreien Bildern suchen können. Sie können nach Kategorie suchen (Business, Coaching, Beratung, Fitness, Marketing, Büro, Dienstleistungen, etc.).

Nach der Auswahl Ihres Bildes haben Sie verschiedene Optionen:

Skalieren: Legen Sie die Anzeigegröße Ihres Bildes fest. ALT: Fügen Sie ein Alt-Tag hinzu, um Ihr Bild mit beschreibenden Informationen zu versehen. Link: Fügen Sie einen Weiterleitungslink hinzu.

Stil Ihrer Bilder und Logos

• Schattierung: Fügen Sie einen Schatten zu Ihrem Bild hinzu.
• Rahmen: Legen Sie die Rundung der Ränder Ihres Bildes fest.
• Ausrichtung: Sie können Ihr Bild links, mittig oder rechts ausrichten.

Schaltfläche

Sie können unser Schaltfläche-Element verwenden, um eine Website oder einen Abschnitt zu verlinken. Das Hinzufügen von Schaltflächen zu Ihren Landingpages ist eine tolle Möglichkeit, um spezifische Links hervorzuheben, die die Leser anklicken sollen. 

Eigenschaften

Call to Action: Geben Sie den Text ein, der in Ihrer "Call to Action"-Schaltfläche angezeigt werden soll. Wählen Sie eine Aktion: Sie können zwischen drei Aktionen wählen: "Mit einer URL verlinken", "In einem Abschnitt verankern" oder "Mit einer Seite in diesem Trichter verlinken". Wenn Sie "In einem Abschnitt verankern" wählen, wählen Sie im Drop-down-Menü den gewünschten Abschnitt aus. Wenn Sie "Mit einer Seite in diesem Trichter 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 im aktuellen Fenster oder einer neuen Registerkarte geöffnet werden soll. URL (Link): Fügen Sie den Link hinzu, zu dem die Schaltfläche verweist.

Gestaltung Ihrer Schaltfläche

Klicken Sie auf Style, um den Stil Ihrer Schaltfläche zu ändern.

Farbe: Wählen Sie die Farbe Ihrer Schaltfläche. Volle Breite: Legen Sie fest, ob die Schaltfläche über die ganze Breite der Spalte reicht oder nicht. Ausfüllen: Legen Sie fest, ob Ihre Schaltfläche voll oder leer ist. Größe: Legen Sie die Größe Ihrer Schaltfläche fest. Form: Legen Sie fest, ob Ihre Schaltfläche viereckig, rund oder pillenförmig ist. Schatten: Fügen Sie eine helle oder dunkle Schattierung hinzu.

Abstand und Sichtbarkeit

Die anderen Einstellungen sind dieselben wie oben unter Allgemeine Einstellungen. 

Trenner

Legen Sie in der Registerkarte Style fest, wie dick Ihr Trenner sein soll: Dünn, Dick oder Am dicksten.

Formular

Bitte lesen Sie unseren spezifischen Abschnitt im nächsten Teil Teil 4: Hinzufügen eines Formulars und erweiterte Optionen

Icon

Einstellungen Ihres Icons

Icon ersetzen: Wenn Sie auf das Icon oder die Schaltfläche "Ersetzen klicken", wird ein Pop-up mit der Icon-Bibliothek angezeigt. Sie können aus mehr als 1400 verschiedenen Icons wählen. Über die Suchleiste können Sie Icons nach Namen suchen. Sie können auch nach Satz filtern. Skalieren: Sie können Ihr Icon auf die gewünschte Größe skalieren. Ausrichtung: Sie können Ihr Bild links, mittig oder rechts ausrichten. Link: Fügen Sie hier eine URL ein.

Abstand

Die anderen Einstellungen sind dieselben wie oben unter Allgemeine Einstellungen. 

Video

Unter der Registerkarte URL können Sie einen Link zu Ihrem Video einfügen. Sie können ein auf YouTube, Vimeo, Dailymotion, Canal+, Wista, Twitch, Youku oder Coub gehostetes Video verwenden.

Code

Fügen Sie Ihren eigenen HTML-Code hinzu. Der hier im Editor eingefügte Code kann nur in "Vorschau" und auf "veröffentlichten" Seiten getestet werden.

⏭️ Nächste Schritte

• Teil 4: Hinzufügen eines Formulars und erweiterte Optionen 
• Teil 5: Veröffentlichen Ihrer Landingpage
• Sind Landingpages SEO-freundlich?
• Duplizieren einer bestehenden Landingpage
• Verwalten von Unterseiten Ihrer Landingpage