SOP: Struktur im Funnel-Builder verstehen und bearbeiten 

Ziel
Diese SOP erklärt den Aufbau der Seitenstruktur im Funnelspot-Builder. Sie zeigt, wie die einzelnen Ebenen (Sektionen, Spalten und Elemente) hierarchisch miteinander verbunden sind und wie du gezielt auf bestimmte Bereiche zugreifst oder sie bearbeitest.

Voraussetzungen

• Zugriff auf das Funnelspot-Dashboard mit Bearbeitungsrechten

• Eine bestehende Funnel-Seite (z. B. Opt-in-Seite) ist vorhanden

Schritt-für-Schritt-Anleitung

1. Überblick: Ebenen im Funnel-Builder
Gehe zu "Funnel" und wähle den Funnel aus, den du bearbeiten möchtest. 

Die Struktur im Funnelspot-Builder ist hierarchisch aufgebaut, ähnlich wie Schichten oder eine Zwiebel. Jede Ebene enthält die nächste.
Die Farbcodierung hilft bei der Orientierung:

(Dieses Bild ist eine Fotocollage mit den einzelnen Ebenen. Du kannst immer nur eine gleichzeitig auswählen).

2. Schichten-Ansicht öffnen

1. Im Funnelspot-Builder die zu bearbeitende Seite öffnen (z. B. eine Opt-in-Seite).

2. Oben im Menü auf „Schichten“ klicken, um die Ebenenstruktur sichtbar zu machen.

3. In der Schichten-Ansicht werden alle Sektionen und ihre untergeordneten Bereiche angezeigt.
   
   

3. Aufbau verstehen

1. Grüne Sektionen sind der äußere Rahmen der Seite.

   • Jede Sektion kann mehrere blaue Spalten enthalten.

2. Innerhalb der blauen Spalten liegen fliederfarbene Reihen, die den vertikalen Aufbau bestimmen.

3. In den fliederfarbenen Reihen liegen die orangenen Elemente (Inhalte wie Text, Buttons oder Bilder).

   Beispiel:
   Sektion (grün) → Spalte (blau) → Reihe (flieder) → Element (orange)

4. Elemente gezielt auswählen

1. Wenn du ein Element schwer anklicken kannst (z. B. ein Textfeld hinter einem anderen Element):

   • Öffne die Schichten-Ansicht.

   • Klicke zuerst auf die blaue Spalte, dann auf die fliederfarbene Reihe und schließlich auf das orangene Element.

   • So kannst du gezielt auf tiefere Ebenen zugreifen.

2. Das aktuell ausgewählte Element wird im Builder farblich markiert.

5. Ausrichtung und Positionierung verstehen

1. Die fliederfarbenen Reihen sind vertikal ausgerichtet – sie funktionieren wie Buchseiten:

   • Links = oben auf der Seite

   • Rechts = unten auf der Seite

   • Zentrum = mittig positioniert

2. Um ein Element (z. B. ein Bild) zu verschieben, wähle das orangene Element aus und ändere die Ausrichtung (oben, Mitte, unten).

6. Sektionen benennen (optional)

1. Um die Übersicht zu verbessern, können Sektionen manuell benannt werden:

   • Klicke auf die grüne Sektion.

   • Gib im Feld „Bezeichnung“ einen Namen ein, z. B. „1. Schwarzes Banner“.

2. Der Name wird anschließend in der Schichten-Übersicht angezeigt.

3. Das hilft, bei komplexeren Seiten schneller die richtige Sektion zu finden.

   Hinweis:
   Das Benennen ist optional – es dient nur der Orientierung, beeinflusst aber nicht die Funktion oder Performance der Seite.
   
   

Qualitätscheck / Ergebnis

• Die Seitenstruktur ist klar nachvollziehbar.

• Alle Elemente sind korrekt zugeordnet (grün → blau → flieder → orange).

• Optional benannte Sektionen erleichtern die Bearbeitung.

• Elemente können gezielt und ohne Fehlklicks ausgewählt werden.

Fehlerquellen & Troubleshooting

• Element nicht auswählbar: Über die Schichten-Ansicht manuell zur richtigen Ebene navigieren.

• Ausrichtung funktioniert nicht: Prüfen, ob die Ausrichtung auf der fliederfarbenen Ebene (Row) korrekt eingestellt ist.

• Sektionen vertauscht: In der Schichten-Ansicht per Drag & Drop neu ordnen.