Wix is a cloud-based platform that helps to create websites that offer online hosting and design services. Its user-friendly drag-and-drop features and the abundance of pre-made templates enable us to create websites without needing technical expertise.
Web push notifications, often referred to as browser push notifications, are interactive messages that websites send to visitors' devices using browsers. These messages are relevant, timely, personalized, and work best for engaging, re-engaging, and keeping website visitors on the page.
In this guide, we will discuss three methods to implement push notifications to a website created with Wix, along with their pros, cons and implementation guide.
1. Using WonderPush
There are multiple push notification platforms available. WonderPush is one of them, which makes sending push notifications to apps and websites simple and affordable. It has a RESTful API, is GDPR compliant, fully functioning, and provides an online dashboard for creating alerts and assessing their outcomes. Furthermore, it is compatible with all widely used native mobile and online platforms.
Pros of Using WonderPush
- Features available such as segmentation, scheduling options, and easy automation.
- Great customer support.
Cons of Using WonderPush
- The price is a little bit high and gives only 14 days of the trial period.
- Support is available only in English.
Tutorial: How to Implement Push Notifications with WonderPush
To implement push notifications with WonderPush on Wix, we have to use the Custom Code feature. However, to use Custom Code, we have to upgrade our Wix plan to a premium and connect a custom domain.
Step 1 - Create a new project
First, create a new project on WonderPush. In there, select "Website" as the project type and "Wix" as the way to install WonderPush.
Then, provide website information such as the website URL, HTTPS notification domain, and the site icon. The site URL is the URL under which we registered our Wix website.
Step 2 - Select notification subscription prompts
Then, select notification subscription prompts. These are how the notifications subscribed by the user will appear on the user's side.
Step 3 - Add custom code to the Wix site
WonderPush gives a code snippet that has to be included in our Wix site.
Head back to the Wix dashboard and go to Settings. There we can find the Custom Code feature. In there, paste the code snippet copied from WonderPush. Also, select the "Load code on each new page" option and it is better to place the code in "Body - end".
Step 4 - Subscribe for notifications
If the notification setup is done correctly, a popup message asking to subscribe to notifications on the site will appear when a user opens the website in a new tab, as shown below.
After users subscribe, they will receive the following notification sent from the site URL we provided in step 1.
Now go to the WonderPush dashboard. There we can see the notification analytics, and also we can create new notifications to send to subscribed users.
Step 5 - Send new push notifications
To create notifications, go to the "Notifications" section and click "Create notifications."
In there, fill the necessary information and create a notification. Also, we can add test users to see a push notification preview before sending it publicly.
If the notification is sent publicly, the subscribed users will see the new push notification as below.
2. Using OneSignal
Another platform for providing push alerts, OneSignal, is comparable to WonderPush. Push notifications can be simply integrated into web and mobile apps thanks to the OneSignal notification service. It has features like segmentation, automatic messaging, and real-time reporting. It is also very scalable.
Pros of Using OneSignal
- Rich features such as omnichannel support.
- Great documentation.
Cons of Using OneSignal
- The price is relatively higher.
- Support is available only in English.
- Performance monitoring might be challenging at the beginning.
Tutorial: How to Implement Push Notifications with OneSignal
Similar to the previous method, we have to use Wix Custom Code. To use Custom Code, we have to upgrade our Wix plan to a premium plan and add a custom domain.
Step 1 - Create a new app
After signing up for OneSignal, create a New App/Website. These steps are similar to the WonderPush implementation. So I will not explain each step in depth.
We need to add the configuration details, as shown below as well.
Step 2 - Add custom code to the Wix site
Copy the code snippet provided by the OneSignal.
Then, add it to the Wix site as we did in the previous section. It is better to add it to the "Head" this time.
Step 3 - Subscribe for notifications
Then, open the website in a new tab. It will pop up a message asking to subscribe to notifications on the site.
After we subscribe, we can see the following notification.
Step 4 - Send new push notifications
To send a new push notification, we have to create one first, as shown in the screenshot below.
Then, fill in the notification campaign information as shown below.
3. Using Simple Push Notifications
We can implement push notifications to a Wix site using apps from Wix App Market. It has a vast collection of plugins that can be installed on our websites. In this guide, I will discuss about one such app called Simple Push Notifications. It allows our Wix website to send push notifications to subscribed users.
Pros of Using Simple Push Notifications
- Easier to set up compared to the other two methods.
- Supports automation.
- Great customer support.
Cons of Using Simple Push Notifications
- The price is high, and the free plan allows you to send only 10 notifications per month
- Limited features compared to third-party push notification platforms.
Tutorial: How to Implement Push Notifications with Simple Push Notifications
Simple Push Notifications is a Wix app available in Wix App Market. These apps can be added to our Wix site to enable different features. This method also requires the site to have a premium plan and a connected domain.
Step 1 - Add Simple Push Notifications to the site
First, go to Wix App Market. Find the "Simple Push Notifications" app and add it to the site.
Step 2 - Send users the subscription prompt
Then navigate to "Simple Push Notifications" in the "Apps" section in Wix Dashboard. There will be a set of instructions on how to use Simple Push notifications. At the end of the tutorial, click on "Setup the Prompt."
In there, create a popup to send the users asking to subscribe for push notifications from the website.
Step 3 - Subscribe for push notifications
After creating the notification, we can send it to users, and it will pop up on our website as below. By clicking "Allow", the user can subscribe to receive push notifications.
Step 4 - Send new push notifications
Now we can create push notification campaigns and send them to subscribed users. For that, click on "New Campaign."
Then, give a title and message to configure a push notification. Finally, click on "Send Now" to send the notification.
The push notification will be displayed on subscribed users' screens as below.
Also, we can see the information about the push notification campaigns in the dashboard.
Wrapping It Up
Throughout this guide, we discussed three easy ways to implement push notifications in websites created with Wix. The first method uses the WonderPush, and the second method uses OneSignal, which can be embedded into our Wix site with the Custom Code feature. The third method uses a push notification plugin called Simple Push Notifications from Wix App Market, which can be directly added to the site and create push notifications. With the methods mentioned above, you can implement push notifications to your Wix website and improve user engagement.
