Wie macht man ein Element klebrig?

Warum ein Element klebrig machen?

Sticky Elements können das Benutzererlebnis verbessern, indem sie wichtige Inhalte sichtbar halten, während Benutzer durch die Seite scrollen. 

Wenn Sie beispielsweise ein Advertorial entwerfen, möchten Sie vielleicht eine CTA-Box oder eine Schlüsselbotschaft, um bleiben sichtbar, während der Benutzer scrollt, sodass sichergestellt ist, dass es immer zugänglich ist.

Sehen Sie sich das Design der Sticky-CTA-Box auf der rechten Seite der Seite an, die fixiert bleibt, während der Hauptinhalt auf der linken Seite scrollt:

Dieser Ansatz stellt sicher, dass sich die Leser ohne Unterbrechung mit wichtigen CTAs beschäftigen können, was die Konversionsraten und die allgemeine Benutzerinteraktion verbessert.

In GemPages ist das Hinzufügen eines Sticky-Elements unkompliziert und erfordert keine Programmierkenntnisse.

So machen Sie ein Element in GemPages klebrig

Schritt 1: Wählen Sie Ihr Element

Wählen Sie das Element aus, das beim Scrollen sichtbar bleiben soll. Dies kann eine Schaltfläche, ein Banner usw. sein.

Schritt 2: Zugriff auf erweiterte Positionseinstellungen

• Klicken Sie in der linken Seitenleiste im GemPages Editor auf Einstellungen .
• Navigieren Sie zu der Erweitert Tab.

Schritt 3: Position auf „Sticky“ setzen

• Finden Sie die Position Option unter Erweiterte Einstellungen
• Ändern Sie die Position von Standard auf Klebrig (Sticky). Durch diese Änderung bleibt das Element an seiner Position relativ zum Ansichtsfenster „haften“, wenn der Benutzer daran vorbeiscrollt.

Häufige Anwendungsfälle für Sticky Elements

Die Fixierung von Elementen kann je nach Seitenlayout und Konversionszielen auf verschiedene Elemente angewendet werden. Im Folgenden werden einige gängige Methoden vorgestellt, mit denen Händler in GemPages fixierte Elemente nutzen, um wichtige Inhalte beim Scrollen sichtbar zu halten.

So erstellen Sie einen fixierten CTA-Button

Wenn Sie möchten, dass Ihre Handlungsaufforderungsschaltfläche beim Scrollen sichtbar bleibt, können Sie das Schaltflächenelement mithilfe der folgenden Funktion fixieren: Position Einstellung.

Folge diesen Schritten:

Schritt 1: Wähle aus Schaltflächenelement Sie möchten klebrig machen.

Schritt 2: Gehen Sie zur Erweitert Registerkarte in der linken Seitenleiste.

Schritt 3: Scrollen Sie nach unten zum Position .

Schritt 4: Setze die Position Option zu Klebrig (Sticky).

Sobald die CTA-Schaltfläche aktiviert ist, bleibt sie beim Scrollen durch die Seite sichtbar, sodass Besucher jederzeit leichter aktiv werden können.

So fügen Sie einen fixierten CTA nur auf Mobilgeräten hinzu

In GemPages, wenn Sie eine Schaltfläche festlegen Klebrig (Sticky) Auf Desktop-Computern bleibt die Seite auch auf Mobilgeräten fixiert. Dies geschieht, weil GemPages Folgendes verwendet: Responsive DesignDas bedeutet, dass die Positionseinstellungen standardmäßig geräteübergreifend gelten.

Wenn Sie jedoch möchten, dass die CTA-Schaltfläche fixiert bleibt nur auf MobilgerätenSie können eine separate mobile Version der Schaltfläche erstellen und die Fixierung nur auf diese Version anwenden.

Folge diesen Schritten:

Schritt 1: Duplizieren Sie die Schaltfläche, die nur auf Mobilgeräten fixiert werden soll.

Schritt 2: Wähle aus Originalknopfdann aktualisieren Sie es Display-Einstellungen anzeigen auf Nur Desktop und verstecke es auf Mobil.

Schritt 3: Wähle aus doppelter Buttondann aktualisieren Sie es Display-Einstellungen anzeigen auf Mobil (und es bei Bedarf auf dem Desktop ausblenden).

Schritt 4: Wenn die Schaltfläche „Duplizieren“ ausgewählt ist, gehen Sie zu Erweitert Registerkarte. Scrollen Sie zu Position Abschnitt. Stellen Sie die Position Option zu Klebrig (Sticky).

Nach Abschluss der Implementierung wird das Sticky-Verhalten nur für die mobile Version der Schaltfläche gelten, während die Desktop-Version unverändert bleibt.

Wie man eine ansprechende Produktbeschreibung erstellt

Auf Produktseiten werden häufig fixierte Produktbeschreibungen verwendet, um wichtige Informationen (wie Produktdetails, Preis oder Schaltflächen zum Hinzufügen zum Warenkorb) sichtbar zu halten, während Kunden durch Produktbilder oder lange Beschreibungen scrollen.

Folge diesen Schritten:

Schritt 1: Wähle aus Elemente der Produktbeschreibung.

Schritt 2: Gehen Sie zur Erweitert Registerkarte in der linken Seitenleiste.

Schritt 3: Scrollen Sie nach unten zum Position .

Schritt 4: Setze die Position Option zu Klebrig (Sticky).