- 08 Nov 2024
- 6 Minuten zu lesen
-
Drucken
-
DunkelLicht
-
pdf
Ein Carousel Pop-up erstellen
- Aktualisiert am 08 Nov 2024
- 6 Minuten zu lesen
-
Drucken
-
DunkelLicht
-
pdf
Die Carousel Pop-up Vorlage wurde entwickelt, um Ihnen zu helfen, kurze Produktinformationen in Form von Folien zu vermitteln, durch die Ihre Benutzer blättern können. Sie können die Carousel Pop-up Vorlage verwenden, um Ihre Benutzer neugierig zu machen, indem Sie mehrere Informationen (Text, Videos oder Bilder) mithilfe von Folien vermitteln, die in einem einzigen Pop-up zusammengefasst sind.
Schritt 1: Das Carousel Pop-up mithilfe des Visual Editors erstellen
Benutzen Sie die folgenden Schritte, um ein Carousel Pop-up mit dem Visual Editor zu erstellen:
-
Melden Sie sich bei der Anwendung an, in der Sie Inhalte erstellen möchten, und starten Sie dann den Whatfix Studio.
-
Auf dem Whatfix Studio, klicken Sie Pop-up.
-
Wählen Sie in der Dropdown-Liste Thema das gewünschte Farbthema aus.
Sie können auch Ihre eigene Farbe verwenden, indem Sie den Hex-Farbcode in das Textfeld eingeben.
- Wählen Sie die Carousel Vorlage.
- Geben Sie die Anzahl der Carousel Folien ein, die Sie in Ihrem Pop-Up haben möchten, und klicken Sie dann auf Erstellen.
- Fügen Sie mit Hilfe des Visual Editors bis zu 6 Folien in Carousel Pop-Up hinzu.
- Sie können die Folien durch Ziehen und Ablegen der Foliennummer an die von Ihnen gewünschte Position im Pop-up verschieben.
- Entfernen Sie eine bestimmte Folie, indem Sie auf das Symbol X neben der Foliennummer klicken.
- Da es sich um ein Carousel Pop-Up handelt, muss es mindestens 2 Dias haben. Wenn Ihr Pop-up 6 Folien enthält, können bis zu 4 Folien entfernt werden.
- Auf der Pop-up Vorlage bearbeiten Sie den Titel und die Beschreibung für Ihr Pop-up.\
Um den Text anzupassen und auszurichten, schweben Sie mit dem Cursor über einen beliebigen Text und doppelklicken Sie dann auf die Rich Text Editor**.
Für weitere Informationen zum Rich Text Editor, sehen Sie Inhalte in einem Pop-up mithilfe des Rich Text Editors hinzufügen..
- Bearbeiten Sie in dem Pop-up Template den Button Namen für Ihr Pop-up.
Um den Button Text anzupassen, schweben Sie mit dem Cursor über einen beliebigen Text und doppelklicken Sie dann auf den Rich Text Editor.
- Um die Button-Konfigurationen zu ändern, schweben Sie den Mauscursor über den Button und klicken Sie dann, um das Button-konfigurationsmenü zu öffnen.
{height="" width="500"}
9. Klicken Sie auf das Dropdown-Menü neben Aktion, und wählen Sie dann die Button Aktion aus.
Die folgende Tabelle listet die verschiedenen Arten der Button Action, ihr Verhalten und ihre Beschreibungen auf:
Button Aktion | Verhalten |
---|---|
Flow beginnen | Wann der Benutzer auf diesen Button klickt, wird er zu einem Whatfix Flow gebracht, der an den Button angehängt wird. |
URL anhängen | Wann der Benutzer auf diesen Button klickt, wird er an die URL weitergeleitet, die an den Button angehängt ist. |
Skip | Wenn der Benutzer diesen Button anklickt, das betreffende Pop-up ist ausgelassen und sie sehen das Pop-up weiter, bis sie auf den Schließen oder Nicht erneut anzeigen Button klicken. |
Schließen | Wann der Benutzer auf diesen Button klickt, schließt er das jeweilige Pop-Up. |
-
Ändern Sie den Button Typ auf Primärer Button oder Sekundärer Button**.
</div>
-
Klicken Sie auf das Button Stil Symbol, um die Farbe, Hover-Farbe und Eckenradius des Buttons zu ändern.
</div>
-
Klicken Sie auf das Button Größe Symbol, um den Button zu vergrößern.
</div>
-
Klicken Sie auf das Horizontale Ausrichten Symbol, um den Button horizontal auszurichten.
</div>
-
Klicken Sie auf das Vertikal ausrichten Symbol, um den Button vertikal auszurichten.
</div>
- Im Rich Text Editor, klicken Sie auf das +-Symbol. Das Dialogfeld Komponente hinzufügen öffnet sich.
- Mit Komponente hinzufügen können Sie Text, Button, Bild/GIF, Video und Audio zum Pop-up hinzufügen.
-
Fügen Sie bis zu 24 Komponenten zum Pop-Up hinzu, indem Sie den Reiter Komponente hinzufügen verwenden.
</div>
-
Das Pop-Up folgt einem strukturierten Rasterlayout mit einer 6x4-Konfiguration von 6 Zeilen und 4 Spalten.
-
Der Visual Editor unterstützt maximal 6 Zeilen und 4 Spalten aus 24 Komponenten der Pop-up Vorlage.
-
Mit Ziehen und Ablegen können Sie verschiedene Komponenten auf dem Pop-Up verschieben oder neu positionieren, sowohl vertikal (Zeilenweise) als auch horizontal (spaltenweise).
-
Jede Komponente hat zwei Drag-Handler, den Horizontaler Drag-Handler und den Vertikaler Ziehhandler zum Verschieben der Komponente.
</div>
Wenn Sie Änderungen am Pop-up mithilfe der Drag Handlers vornehmen, können Sie bestimmte Änderungen leider nicht rückgängig machen. In diesem Fall müssen Sie das Pop-up möglicherweise neu erstellen. Weitere Informationen finden Sie unter Kann ich die Änderungen mit den Drag-Handlern rückgängig machen?
- Klicken Sie auf das + Symbol, um eine neue Folie zum Carousel Pop-Up hinzuzufügen.
- Unter CONTROL wählen Sie, ob Sie das 'x'-Symbol auf dem Popup anzeigen und Nicht mehr anzeigen möchten, indem Sie die Toggle aktivieren.\
- Bestimmen Sie, ob Sie die Carousel Punkte und die Carouselpfeile anzeigen möchten, indem Sie die entsprechenden Togglen aktivieren/deaktivieren.
- Um die Pop-up Background Color zu ändern, wählen Sie die Farbe aus der vorhandenen Farbpalette oder geben Sie den Hex-Code der gewünschten Farbe ein.
- Um ein Pop-up Background Image hinzuzufügen, klicken Sie Bild hochladen.
- Sie können die URL des Bildes, das Sie einfügen möchten, einfügen oder ein Bild von Ihrem lokalen Laufwerk oder der Whatfix-Galerie hochladen.
- Nur .jpg, .gif und .png Bildformate mit einer Größe von bis zu 4 MB werden unterstützt.
- Wenn Sie die Position des Pop-ups konfigurieren möchten, aktivieren Sie den Schalter Pop-up positionieren.
- Standardmäßig wird das Pop-up in der Mitte der Seite angezeigt, und Endbenutzer können nicht mit anderen Elementen der Anwendung interagieren, solange sie das Pop-up schließen/interagieren.
- Wenn Sie den Toggle Pop-positionieren aktivieren, können Ihre Endbenutzer auch mit anderen Elementen Ihrer Anwendung interagieren.
- Stellen Sie die Position des Pop-up ein.\
- Sobald Sie das Pop-up erstellt haben, klicken Sie Pop-up speichern.\
Schritt 2: Die Pop-up Visibility Rules konfigurieren
Gehen Sie wie folgt vor, um ein Pop-up zu konfigurieren:
-
Auf dem Whatfix Guidance Dashboard, klicken Sie Widgets.
-
Klicken Sie Pop-ups.
-
Schweben Sie den Mauscursor über das Pop-up-Segment, das Sie konfigurieren möchten, und klicken Sie dann auf das Symbol Bearbeiten.
-
Klicken Sie Visibility Rules festlegen →.
-
Legen Sie die Wo Visibility Rules fest, damit das Pop-up erscheint.
Wenn Sie mehrere Pop-ups mit unterschiedlichen Visibility Rules festgelegt haben, um auf derselben Seite angezeigt zu werden, wird das Pop-up, das mit User Action abgeschlossen als Visibility Rules konfiguriert ist, immer zuerst angezeigt, wenn der Endbenutzer die User Action ausführt.
- Festlegen Sie der Wann Visibility Rules für das Pop-up. Weitere Informationen finden Sie unter Pop-ups planen.
Wenn das Pop-up eine Überspringen Button hat und wenn Ihre Endbenutzer auf den Button Überspringen klicken, es wird nicht als Interaktion betrachtet und das Pop-up wird ihnen unabhängig von den eingegebenen Vorkommnissen angezeigt.
- Klicken Sie Später fertigstellen oder Pop-up bearbeiten, je nach Ihrer Präferenz.
- Später beenden: Speichert das Pop-up als Entwurf.
- Pop-up bearbeiten: Bringt Sie zurück zum Pop-up, wo Sie Einstellungen festlegen können.
-
Wenn Sie mit der Erstellung des Pop-ups fertig sind, wählen Sie das Widget aus und klicken Sie dann an Bereit senden.
-
Gehen Sie zur Bereit Phase und wählen Sie das Segment aus, das Sie in die Produktionsstufe verschieben möchten, und klicken Sie dann Zur Produktion schieben.