- 01 Oct 2024
- 2 Minutes To Read
-
Print
-
DarkLight
-
PDF
Insert an image in a Pop-up
- Updated On 01 Oct 2024
- 2 Minutes To Read
-
Print
-
DarkLight
-
PDF
Embed images in any Pop-up template by adding their URL. Any image you want to insert in a Pop-up has to be first hosted on the Whatfix dashboard, or on an online image-sharing website like Imgur, ImgBB, and more. Once hosted, use the image URL to add the images.
Also upload images from your local hard drive if the template supports the image field. For example, Pop-up templates such as SYSKA and Meet & Greet.
- Ensure that you have the image URL before proceeding.
- Only .jpeg, .jpg, .gif, and .png image formats that are up to 10 MB in size are supported.
- Whatfix enables you to upload up to 100 images from your local drive for use in your Pop-ups. Once this limit is reached, you will see an error message. However, increase this limit by contacting support@whatfix.com.
Use the following steps to insert an image using the Pop-up templates that support image fields:
-
On the Guidance dashboard, click Widgets.
-
Click Pop-ups.
-
Select one of the Pop-up templates, for example, Feature Onboarding.
-
Click the image placeholder to open the Image Froala Toolbar.
-
Click the + icon.
-
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.
-
Click Insert.
-
The image gets added in the Pop-up.
Once the image gets added, make the following changes using the Image Froala Toolbar :
-
Resize the image height using the Resize options icon.
-
Enable the Ignore safe area toggle to extend the image beyond the safe area boundaries.
-
Use the Align icon to align the image to left, right, or center.
-
Use the Vertical Align icon to align the image vertically.
-
Use the Alternative Text icon to provide a textual description of the image content.
-
Use the Replace Image icon to replace the existing image.
-
Use the Remove Component icon to delete the image.
-
Use the Drag and Drop feature to 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.
- Finish creating the Pop-up and click Save Popup.
Insert or edit an image in a Pop-up template after creating it, using the Edit icon on the Dashboard.