Visual Editor ermöglicht es Ihnen, ein Bild in einer Pop-up-Vorlage direkt über die UI einzusetzen, ohne den JSX-Code bearbeiten zu müssen.
Bilder in jede Pop-up Vorlage einbetten, indem Sie ihre URL hinzufügen. Jedes Bild, das Sie in einem Pop-up einsetzen möchten, muss das erste im Whatfix Dashboard gehostet, oder auf einer online Bildteilungs-Website wie Imgur, ImgBB, und mehr. Nachdem die Bilder gehostet sind, verwenden Sie die Bild-URL, um die Bilder hinzuzufügen.
- Stellen Sie sicher, dass Sie die URL des Bildes haben, bevor Sie fortfahren.
- Die Bild-URL muss https enthalten, wenn das Pop-up auf einer sicheren Webseite angezeigt wird.
- Nur .jpg, .gif und .png Bildformate mit einer Größe von bis zu 4 MB werden unterstützt.
- Mit Whatfix können Sie bis zu 100 Bilder und Videos von Ihrem lokalen Laufwerk hochladen und in Ihren Pop-ups verwenden. Sobald diese Grenze erreicht ist, wird die Fehlermeldung angezeigt. Dieses Limit kann jedoch erhöht werden, indem Sie support@whatfix.com kontaktieren.
Verwenden Sie die folgenden Schritte, um ein Bild in einem Pop-up mit dem Visual Editoreinzusetzen:
-
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 eine der Pop-up-Vorlagen aus, zum Beispiel Feature Onboarding.
-
Klicken Sie auf den Bildplatzhalter, um die Image Froala Toolbar zu öffnen.
-
Klicken Sie das + Symbol.
-
Klicken Sie im Dialogfeld Komponente hinzufügen auf Bild.
-
Sie können die URL des Bildes, das Sie einfügen möchten, einsetzen oder ein Bild von Ihrem lokalen Laufwerk oder der Whatfix-Galerie hochladen.
-
Klicken Sie Einsetzen.
-
Das Bild wird im Pop-up hinzugefügt.
Sobald das Bild hinzugefügt wurde, führen Sie die folgenden Änderungen mit der Bild-Froala-Symbolleiste durch:
-
Ändern Sie die Bildhöhe mithilfe des Icons für die Größenänderung.
</div>
-
Aktivieren Sie den Des sicheren Bereichs ignorieren Toggle, um das Bild über die Grenzen des sicheren Bereichs hinaus zu erweitern.
-
Verwenden Sie das Align-Symbol, um das Bild links, rechts oder zentriert auszurichten.
-
Verwenden Sie das Vertikale Ausrichten Symbol, um das Bild vertikal auszurichten.
-
Verwenden Sie das Alternativ Text Symbol, um eine textuelle Beschreibung des Bildinhalts bereitzustellen.
-
Verwenden Sie das Bild ersetzen Symbol, um das vorhandene Bild zu ersetzen.
-
Verwenden Sie das Komponente entfernen Symbol, um das Bild zu löschen.
-
Verwenden Sie die Ziehen und Ablegen Funktion, um das Bild um das Pop-up herum zu verschieben oder neu zu positionieren.
-
Mit den Drag-Handler kann das Bild sowohl vertikal (spaltenweise) als auch horizontal (zeilenweise) verschoben bzw. neu positioniert werden.
</div>
Wann 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?.
- Beenden Sie die Erstellung des Pop-up und klicken Sie Pop-up speichern.
Ein Bild in einer Pop-up Vorlage einsetzen oder bearbeiten, nachdem Sie diese erstellt haben, indem Sie das Bearbeiten Symbol auf dem Dashboard verwenden.
