Configure widget settings
Configure settings that apply to the widget container and its presentation.
Set these options before building the layout. Use Design widget layout to create views and add elements.
Open widget settings
Click Settings in the top-right corner to configure:
Identity: name and description for internal use.
Presentation: type, screen placement, and mobile overlay.
Dismissal: outside-click behavior and close button position.
Name and description
Give the widget a clear, memorable name. For example: Summer Sale Pop-up.
Add a short description of its purpose. For example: “Promotes seasonal discounts with an interactive pop-up.”
These fields help teammates find the right widget during campaign setup.
Widget type and placement
Choose the format that matches the message and available screen space.
Pop-up
A focused overlay for promotions, offers, or subscriptions.
Floating Bar
A slim top or bottom bar for persistent announcements.
Full-Screen
An immersive experience that fills the screen.
Carousel
Adds navigation buttons for switching between widget views.
Choose the arrow background color, arrow color, and a Slide or Fade transition.
Set the placement
Set the widget position to Top, Center, or Bottom. Preview the result on desktop and mobile. Ensure the widget does not cover essential content.
Mobile overlay and background
Configure the overlay
Use Background Overlay to dim or color the area behind a mobile pop-up. It is enabled by default and covers the full screen, including the status bar.
Select an overlay color with the color picker. HEX and RGBA values are supported. Adjust opacity in the picker or with the opacity slider.
Use a clear background
Use Clear Background when app content should remain visible behind the pop-up. This disables Background Overlay and Overlay Color automatically.
Dismissal and close button
Enable outside-click dismissal
Enable outside-click dismissal when users should close the widget by tapping or clicking outside it. This option works on web and mobile.
Position the close button
Choose a close button location:
Widget Top-Right Corner: the default position.
Above the Right Corner of Widget: places the button outside the container.
Custom Button Position: sets its exact location.
For a custom position, drag the close button into place. Click outside the widget to confirm.
View settings
Select a view, then open View Settings to style its overall container.
Available controls include:
Minimum height: the view’s minimum vertical space.
Background: the outer area behind the container.
Container Background: the container’s fill color.
Background Image: an image behind the view content.
Corner Radius: the roundness of the container corners.
Border width: the thickness of the container border.
Use these settings before adjusting individual elements. For full layout guidance, see Design widget layout.
Background image
Use a background image to add visual context to a view:
Click Background Image.
Choose None, Image URL, or Upload.
Add the image to the layout.
Set the view’s minimum height to fit the image properly.
For example, add a campaign background image that matches your brand.
Transparent container
Use a transparent container when the widget should blend into the host page or app.
By default, containers can have a background, border, or shadow. To remove that frame:
Enable Clear Background.
Set Background Color to Clear.
Add components to the layout.
Enter image URLs in the HTML builder, when needed.
For example, if you create a floating logo widget, the logo appears without a card background or shadow.
Continue building
Build the visual layout next. Then configure interactions and validation.
Last updated
Was this helpful?