Today time is very important for everyone and then if you show Email subscribe form than, in the most cases he will not feel Email subscribe form because it takes some time. But I have a great solution to this problem. Web Push notification is the best way to create a bond between your visitor. So today we learn how to add Web Push Notification in WordPress website.
What do you need before starting
Before you start, you need these :
- A valid Email address
- A website or blog(WordPress or Non-WordPress)
- SSL Certificate(https) (optional but recommended)
What are we going to do?
In this lesson, we are going to
- Create an account on OneSignal(free)
- Install OneSignal on our website
- Setup and Configure it.
So, Let’s get started.
Create an account and do the setup on OneSignal
- First, go to OneSignal.com and create an account(Sign up) or sign in if you already have an account on it by click on Login option.
- After that, you click on ADD NEW APP and give a Name as you like e.g. your website name and click Create.
- After that, you will be got a screen as showing in the picture. So next select on Web Push and click Next.
- After that, you will be asked for Choose Integration and Website builder. Here we are using WordPress so we select WordPress plugin and Website builder and WordPress.
- Scroll down and Enter your website name, website URL and upload your website’s icon. Next, If your website running on HTTPS than keep ‘My site is not fully HTTPS’ option turn off or if your website is running on HTTP then you turn on ‘My site is not fully HTTPS’ and give a label which is looking like your website name.
- Now you will be got APP ID and API KEY. Copy it because we need it after some step
- Scroll down and click finish.
Now we need to setup on our WordPress site.
Setup and configure on WordPress
- Login to your admin panel on WordPress.
- Go to Plugin > Add New. Search OneSignal and install it. After install, click on activate it.
- After activation, we got an option OneSignal Push in dashboard menu.
- Click on OneSignal Push and Enter your OneSignal App Id.
- Enter your API KEY in the REST API Key’s option.
- Now you need Safari Web ID but at this time we don’t have it. So go to OneSignal on a new tab and click on settings and choose Apple Safari and enter your website name & URL and click Save.
- After that, your push notification has been activated but we need Safari Web ID so click on Apple Safari and copy Web ID and close the page.
- Now feel Safari Web Id on your website.
- Scroll down and turn on ‘Use an alternate full-screen prompt..’ and ‘Show the Slide Prompt…’ in the option of
Prompt Settings & Subscription Bell(optional).
- Now scroll down at the bottom and click save.
So, guys. We have done everything on our WordPress site. Now clear cache, open your website and subscribe yourself.
So guys, if you have any problem-related Push Notification and it’s activation, ask by comment box. I hope you like it.