Web Push Notification Popup

Web Push Notification is a highly effective Popup, which will level up your commercial campaign. With the help of this Popup, you can send alert style massages to website visitors via desktop web and mobile web browsers.

Now, let's create a Web Push Notification step by step, and see how it works.

To create the Popup, first, please open your WordPress Dashboard and press Popup Builder >> Add New, after then choose the Web Push Notification Popup

Now, please fill in and customize all the required features. Start by adding the title and text content for your popup as you see on the screenshot below

Push Notification Main Options. This tool will help you to design and customize the required settings for the Popup.

The "Allow" button gives an opportunity to your site visitors to agree for future Web Push Notifications from your website, via clicking on the "Allow" button.

With the help of this tool, you can set the desired design for the"Allow" button, such as the color of the button, text, border, width, the button radius in pixels or percentage.

The "Disallow" button. Via clicking on the "Not Allow" button, the site visitors decline to receive future web push notifications from your website.

By checking the "Save choice" option, the Popup will appear again for the same user after the selected days, since the day when the "Not Allow" button was pressed by the user.

If you stay the "Push to button" option unchecked (as default) the "Allow and Disallow" buttons will be shown under the text of the Popup.

Popup Display Rules. This section responses, where to show the popup on the website. In the example, we have selected Home Page to open the Popup.

Popup Events shows when the popup should appear. As you see on the screenshot, we have chosen the On load mode and set 2 sec. to delay the popup appearance.

This section also gives an opportunity to add or delete rules to customize your Popup more in details.

Design. This section includes tools to design and customize your Popup appearance.

The Padding tool, which adds some space (in pixels) around your Popup content.

The Popup z-index increases or decreases the value to set the priority of displaying the Popup content in comparison of other elements on the page.

The Theme gives the internal look of the Popup.

The Background options, to customize the background of the site by setting the color, image, and mode.

Dimension. This section is responsible for the Popup size.

The Responsive Mode, which allows you to specify the Popup automatically.

The Custom mode, to select the width and height of the Popup (in pixels) manually, with an opportunity to set your desired maximum and minimum dimensions.

Popup Options. This section gives additional tools to configure the Popup.

The Action on popup content click gives you options to close, redirect it on URL address or open on a new tab by clicking on the Popup.

The Popup opening and Popup closing animation options, to set the type and speed of them.

The Popup location, to set the position of the Popup on the screen.

The Popup order gives an opportunity to prioritize the number of Popup appearance on the same page in comparison to other Popups.

The Popup event delay allows adding an opening delay for the Popup in seconds (referred to shortcodes, custom CSS classesHTML attributes or JS called custom events)

At the end of filling in, please press Publish

In case of any changes, please press Update, after then Preview Changes to see the result

The final result of our Web Push Notification Popup

To see your created Popup, please press Popup Builder. Here, you have a possibility to switch on/off the Popup, also to see the views

Now, your Web Push Notification Popup is already created and ready to use.

How to send Web Push Notification Popup

Now, let's see how you can send push messages to your subscribers after confirmation of Web Push Notification Popup.

To start sending push messages, please open Popup Builder on your WordPress Dashboard, after then press Push Notification and start filling in.

Send Push is a tool, which you need to use for sending push messages to your subscribers.

The List of recipients gives an opportunity to select the appropriate Web Push Notification Popup(s) from your created list, to send a push message.

With the help of this section, you have an opportunity to choose your desired title, message text, URL address where to link by clicking on the push Popup and select your desired icon.

 After filling in all required fields, please press Send, as it is captured on the screenshot below

Subscribers. To have analytics of your created push Popups regarding categories, such as subscriber's ID, Region (country), Browser, Date, and Popup Title and filter them choosing the created date and selecting the appropriate Web Push Notification Popup(s) from the list.

Also, you can select and Delete the Popup(s) in case of need.

Campaigns. This section gives an opportunity to see analytics for a group of Web Push Notification Popups, by the following criteria: ID, creation Date, Campaign title.

Also, you can see the number of sent/delivered Popups and clicks on them.