Anpassen deines Funnels und deiner Website für mobile und Desktop-Ansichten

Einer der Vorteile des Funnel Builders ist die Möglichkeit, zu sehen und zu bearbeiten, wie der Funnel in der Desktop- und Mobilansicht aussieht. Manchmal sieht jedoch das, was in der einen Ansicht am besten aussieht, in der anderen nicht so gut aus. Die beste Lösung, um sicherzustellen, dass das Design des Funnels in beiden Ansichten gut aussieht, ist, daran zu denken, dass je einfacher, desto besser und nach Fertigstellung eines Abschnitts in der Desktop-Ansicht zum Editor der mobilen Ansicht zu wechseln.

Die Ausrichtung einiger Spalten und Elemente sieht in der mobilen Ansicht anders aus als in der Desktop-Ansicht, da der gesamte Inhalt in der mobilen Ansicht vertikal gestapelt wird. Elemente, die auf dem Desktop von links nach rechts ausgerichtet sind, erscheinen auf dem Handy von oben nach unten.

Idealerweise ist es nicht sinnvoll, Abschnitte, Zeilen, Spalten oder Elemente zu erstellen, die nur für Mobilgeräte oder nur für den Desktop bestimmt sind (bestimmte Inhalte können ausgeblendet werden, sodass sie nur in einer Ansicht erscheinen). Bei der Bearbeitung hast du dann doppelten Aufwand, da die in einer Ansicht vorgenommenen Aktualisierungen/Überarbeitungen in der anderen Ansicht nicht aktualisiert werden (es handelt sich um separate Inhalte, die nur in einer Ansicht angezeigt werden). In einigen Szenarien ist es jedoch notwendig, Abschnitte nur für Mobilgeräte oder nur für den Desktop zu erstellen, um bestimmte Designs zu erreichen.

HINWEIS: Die Schriftgrössen sind die einzigen Elemente, die gleichzeitig eingestellt werden können (Desktop-Schriftgrösse und mobile Schriftgrösse).

Layout, Abstände und andere strukturelle Änderungen erfordern Abschnitte, die nur für Mobilgeräte und nur für den Desktop verfügbar sind. Daher empfiehlt es sich, zunächst die Desktop-Version zu erstellen und dann in der mobilen Ansicht zu ermitteln, welche Abschnitte nicht so angezeigt werden, wie du sie haben möchtest. Sobald du diese Abschnitte bestimmt hast, kannst du sie duplizieren und eine Version in eine reine Desktop-Version und die andere in eine reine Mobilversion ändern (siehe untenstehende Schritte). Anschliessend kannst du die Version nur für Mobilgeräte nach Bedarf bearbeiten.

Um einen Bereich nur für den Desktop oder nur für mobile Endgeräte einzurichten, befolge diese einfachen Schritte:

Schritt 1: Klicke auf das Symbol "Bearbeiten" auf dem Funnel deiner Wahl.

Schritt 2: Klicke auf den gelben Button "Seite bearbeiten".

Schritt 3: Klicke auf das Element, das du bearbeiten möchtest.

Schritt 4: Wechsle unter den Einstellungen des Elements zu "Erweitert".

Schritt 5: Klicke unter "Sichtbarkeit" auf das Desktop- und das Handy-Symbol, bis sie blau sind, um sie beide zu aktivieren.

So sieht es aus, wenn sie nicht ausgewählt oder ausgeschaltet sind:

Schritt 6: Anschliessend kannst du in der oberen Menüleiste auf die gleichen Desktop- und Mobilsymbole klicken, um die optimierten Seiten anzuzeigen.

Schritt 7: Vergewissere dich, dass du die Änderungen speicherst, bevor du die Seite verlässt.