- 08 Oct 2024
- 4 Minuten zu lesen
- Drucken
- DunkelLicht
- pdf
Customize a Pop-up template
- Aktualisiert am 08 Oct 2024
- 4 Minuten zu lesen
- Drucken
- DunkelLicht
- pdf
The Visual Editor enables you to design and customize the components in Whatfix Pop-ups easily, eliminating the need for code editing. With the Drag-and-Drop feature, content creators can resize Pop-ups, add or delete components, and add customizations directly in the UI.
- Customize a Pop-up during the Pop-up creation using Whatfix Studio. To know more about creating a Pop-up, see Create a Pop-up.
- A Pop-up can also be customized after creation using the Edit icon on the Dashboard.
Use Cases
Use the following steps to add an extra button in the Pop-up using the Add Component on the Visual Editor:
On the Pop-up template, hover your cursor over the button corner, and then click to open the button configuration menu.
Click the + icon. The Add Component dialog box opens.
On the Add Component dialog box, click Button.
The button gets added.
Whatfix enables you to change the following button configurations:
Change the button Type to Primärer Button or Sekundärer Button.
Click the Button Style icon to change the Color, Hover color, and Corner radius of the button.
Click the Button Resize icon to resize the button.
Click the Horizontal Align icon to align the button horizontally.
Click the Vertical Align icon to align the button vertically.
- Using the Drag and Drop feature, move or re-position the button around the Pop-up.
- Using the Drag Handlers, the button can be moved or re-positioned both vertically (column-wise) and horizontally (row-wise).
When you make changes to the Pop-up using the Drag Handlers, you may not be able to undo certain changes. In that case, you may need to re-create the Pop-up.
Use the following steps to add an image in the Pop-up using the Add Component on the Visual Editor:
On the Pop-up template, double-click the text to open the Rich Text Editor.
Click the + icon. The Add Component dialog box opens.
On the Add Component dialog box, click Image.
Paste the embed URL of the image you want to insert or upload an image from your local drive or Whatfix Gallery.
- The image URL must contain https if the Pop-up is displayed on a secure webpage.
- GIFs can also be added using the image dialog box.
- Only .jpg and .png image formats that are up to 4 MB in size are supported.
- Click Insert.
The image gets added.
- Using the Drag and Drop feature, move or re-position the image around the Pop-up.
- Using the Drag Handlers, the image can be moved or re-positioned both vertically (column-wise) and horizontally (row-wise).
When you make changes to the Pop-up using the Drag Handlers, you may not be able to undo certain changes. In that case, you may need to re-create the Pop-up.
Use the following steps to add a video in the Pop-up using the Add Component on the Visual Editor:
On the Pop-up template, double-click the text to open the Rich Text Editor.
Click the + icon. The Add Component dialog box opens.
On the Add Component dialog box, click Video.
Paste the video URL.
The video URL must contain https if the pop-up is displayed on a secure webpage.
- Click Insert.
- Using the Drag and Drop feature, move or re-position the video around the Pop-up.
- Using the Drag Handlers the video can be moved or re-positioned both vertically (column-wise) and horizontally (row-wise).
When you make changes to the Pop-up using the Drag Handlers, you may not be able to undo certain changes. In that case, you may need to re-create the Pop-up.
Use the following steps to add an extra Text box in the Pop-up using the Add Component on the Visual Editor:
On the Pop-up template, double-click the text to open the Rich Text Editor.
Click the + icon. The Add Component dialog box opens.
On the Add Component dialog box, click Text.
The Text box gets added.
- Using the Drag and Drop feature, you can move/re-position the Text box around the Pop-up.
- Using the Drag Handlers the video can be moved/re-positioned both vertically (column-wise) and horizontally (row-wise).
When you make changes to the Pop-up using the Drag Handlers, you may not be able to undo certain changes. In that case, you may need to re-create the Pop-up.
Customize the Pop-up background color and background image directly in the UI using the Visual Editor.
To change the Pop-up Background Color, under CONTROL, choose the color from the existing color palette or enter the hex code of the desired color.
To add a Pop-up Background Image, under CONTROL, click Upload image.
Paste the embed URL of the image you want to insert or upload an image from your local drive or Whatfix Gallery.
Click Insert.
- Only .jpg, and .png image formats that are up to 4 MB in size are supported.
- The Pop-up Background Image and Color can be changed only using Whatfix Studio and not the Dashboard.
Similarly, mix and match multiple components, and create your own custom template.