Create a Modal – By Scratch Method

A Modal is a popup window displayed on top of the webpage content with a dimmed background. It is commonly used for forms, login/signup, offers, alerts, announcements, and user actions.

After successfully logging in, navigate to the App Banners module from the left-side navigation panel and follow the steps below.

Step 1: Open the App Banners Module

Click App Banners from the left-side navigation panel.

Step 2: Create a New App Banner

Click the Create App Banner button. The App Banner Details form appears.

Enter the required details such asName,Device,Language, and selectModalas theApp Banner Type.

and continue to the Next Step

Click the Next button.

Screen – Create App Banner

Select the Start from Scratch method.

The Visual Editor opens with a blank canvas to create the modal from scratch.

Step 5: Open the Design Block Panel

Click the Plus (+) button on the canvas or the Layout tab to open the Design Block Panel.

Screen – Open Design Block Panel

Step 6: Add Design Blocks and Modal Content

Add the text, images, styling, and other properties by selecting the required design block, such as Heading,Text,Image,Button (CTA), or any other available element to build the modal.

Screen – Add Modal Design Blocks

Step 7: Save the Modal

Click Save Changes to save the modal.

Step 8: Preview the Modal

Click Preview to review the modal before publishing.

Step 9: Publish the Modal

Click Publish. A popup appears to enable or disable the App Banner.

A Publish popup appears displaying the app banner details. Review the publish settings such as Start Date, End Date, Run Forever, and Show Only Once. Update the settings as required before publishing.

Step 11: Publish the App Banner

Click the Publish button to make the app banner live.

You can write it like this:

After saving or publishing, the Modal App Banner appears on the App Banner Dashboard. Once integrated with the web application, users can view the modal on the website.