How to make
a custom code pop-up notification



A custom code pop-up widget is a graphical user interface (GUI) component that allows website or application developers to create and implement their own custom pop-up window or dialogue box. This widget provides developers with the flexibility to design and implement pop-up windows that are tailored to the specific needs of their website or application.

The widget typically allows developers to add their own HTML, CSS, and JavaScript code to create the pop-up window, providing complete control over the appearance and functionality of the widget. This can include custom animations, forms, and other interactive elements that can be used to engage users and improve the user experience.

The content of the custom code pop-up can vary widely, depending on the needs of the website or application. For example, it can be used to display information about new products or features, to gather user feedback through surveys or forms, or to promote special offers or events.

Custom code pop-up widgets are often used by experienced developers who want to create highly customized and tailored pop-up windows that meet the specific needs of their website or application. However, it is important to use custom code pop-up widgets responsibly and not to overuse them or create pop-ups that are intrusive or annoying to users.

Use the custom code pop-up widget to display the manually created notifications or connect the third-party services like Mailchimp or others.

Create an Account or Sign In and Connect the Website

Find more information on connecting the website to the Magic Widget system here.

Select the Custom Code Type and Create the Notification

Custom Code pop-up

Below is the detailed instructions on creating a custom widget with Magic Widget tools, including all settings and design options.

The pop-up design and configuration process contains the following four sections:

Basic Settings

Custom Code settings
Add the widget name and insert the developed code. Insert links to use the appropriate graphics.


Custom Code triggers
All settings here are as usual.

Display Settings

Custom Code display
Specify here for how long the pop-up will be displayed on the page.

Design Settings

Custom Code design
Follow the design settings.

Activate the Notification

Custom Code activate

Activate the Campaign

Make sure the Campaign is Activated and enjoy the notification.