Before you begin
Ensure your image assets are compatible with the platform. Refer to the "Creative Spec Guide" for the exact dimensions of each type of visual element, including image buttons, split-screen layouts, and background images. You can download the Spec Guide in the Media Library or within the experience campaign builder editor by clicking on the "Design" tool tab on the top right.
Add Images
To add a standard image at the screen editor level, click the "Add Elements" option on the left-side design panel and select the "Image/Video" option.
Then, you can either select an existing image from your Media Library or upload a new image file.
Add Image Buttons
To add an image button, click the "Add Elements" option and select the "Image Button" option.
For optimal display and load times, keep the file size of image buttons around 300kb.
Use a minimum resolution of 600x600, preferably with square images and centered content.
If you encounter issues with your image buttons, adjust the "Position" and "Size Mode" controls.
The "Position" matrix allows you to choose which part of the image to highlight.
"Show All" displays the entire image, avoiding cropping.
"Fit the Space" scales the image to fill the button.
"Original" shows the image at its original resolution.
Add a Split-Screen Layout
Split-screen design specifications are available in the Creative Specs guide, with a suggested resolution of about half the width of standard background images. While split-screen layouts are ideal for desktop, they may present challenges for mobile users. In such cases, enable "Style Independently" and choose a different layout for mobile.
To add a "Split-screen" layout, select the screen background to open the left-side menu panel.
In the "Mobile Layout" section, hover over the layout icons and select the desired split-screen type: Top or Bottom split.
Adjust the percentage of the split screen to control how much of the image you want to display.
To add a background image, select the split screen and click the upload icon on the left-side panel to add your image or video asset.
FAQ
How do I add Alt-Text to the images?
Alt text is essential for ADA compliance, providing descriptions of images for visually impaired readers. It is only required when the image conveys information; purely decorative images do not need alt text. To add alt text, select the image in your campaign and scroll to the alt text field in the left panel.