What is a push notification this is our website and whenever you have push notification enabled for your website then if someone visits your website then they'll get a.
Pop-up on the screen right here and they'll be asked to allow or don't allow the notifications of your website and if the visitor decides to.
Allow it then the visitor will become a subscriber of your website and you can then send a notification of your posts whenever you have a new post in your website.
And it will appear on their device and so in this way you can bring your visitors back to your website whenever you have a new content for your website so in this video i'll show you how to.
Create a push notification service for our blogger website so let's get started .
And here we can see that this is the official website of one signal and if you scroll down we can see that these developers trust this service and.
Then if we scroll down more we can see we have different services like mobile push where you can send notification to the visitors mobile device.
And then we have web push where you can send notifications to your visitors web browser and then also have in-app notifications email and sms and if you scroll down we can.
See we have a lot of different features that is there in the service so you can go ahead and check this out so here we can see that it supports a lot of different.
Web development environments and the good thing is that it has a free version for getting started with one signal so if you go to pricing.
Posts Related:
We can see there is a free version and
It has some limitations but you can get started with the free version and as your website grows you can upgrade to.Different plans of one signal so just go ahead and read through these different features and you'll be able to understand the difference so now the first thing you have to do is.
Register on one signal so go to sign up and enter these details and click on create account or you can even log in using github google or facebook all right once you've done that you'll.
Get this screen over here which says welcome to one signal and the first thing you have to do is you have to add your app or website over here.
So we do have a website so let's go to our website and let's copy the url liveblogger123.blogspot.com and first of all we have to name the.
Website so i'll just name it live blogger and then here we have the different platforms you wish to use this app for so we'll just click on web push.
And then click on next so the first one is typical site so for typical website select this if you are unsure but we have a blogger website so you can go ahead and click on.
The second option and here you can see different website builder and cms are displayed over here we want to select blogger so click on.
Blogger once you've done that just scroll down and we can see different options we have to fill out so the first thing is the site name.
We'll just type live blogger and then we
Have the site url so we have copied the url i'll just paste it over here and then we also have the option of adding.An icon to all the notifications so let me just click on upload and i'll just add an icon over here so i have just uploaded this icon and i'll just click on save.
And the upload is complete so whenever we have a notification this icon will be displayed and the next thing is that we have to choose a label so this should be.
A unique label so let me just check whether we have live blogger available we'll know after we click on submit so the next thing is the prompt so the first one we have over.
Here is the slide prompt this is how it will look it will slide from the top and we will have two options allow and no thanks.
And you can go ahead and customize whatever you have over here the text and all those things so just click on this button and here we have the option of changing the.
Text so you can add anything over here like if you want to get notifications about our new blog posts please click on allow so we can see that.
The text is being displayed over here or you can just delete this and leave it as it is so this is the default text and then we have the buttons over here as well you.
Can change this to whatever you want for the cancel button you can add it as don't allow in the same way you can change the text of the accept.
Button and the next option is that when should our prompt be displayed so by default it is set to after one page view and after 20 seconds.
So we can change these values over here i'll just change it to 10 seconds so whenever someone visits our website for the first time and after 10 seconds the visitor will have a prompt on the.
Screen and we also have an option of adding categories so you can add different categories and put different subscribers on different categories and in this way you can.
Send dedicated notifications to different categories i'll just disable that we'll just keep one category for everyone and then here's the preview this is the.
Desktop version and this is the mobile version it will slide in from the bottom all right so let's click on done and then we can also add other.
Prompts like uh here we can see we have a subscription bell over here so this is how it will look the visitor can just click on this and he'll be subscribed to your website.
In the same way you can go ahead and change the options over here and we'll have other options like custom link and native prompt so these are all the different.
Options for our website this is not recommended because a lot of people deny this notification so i'll just go ahead and close this one this is the recommended.
One so i'll just keep that and then here we have other options like what should be displayed when the user subscribes for our service so this is the title we can just type.
Anything over here and also for the message you can just have any message over here by default it has thanks for subscribing and you can also.
Add a link over here whenever the visitor has subscribed you can send him to a specific link if you want i'll just disable that and then let's.
Scroll down and let's see what are the other options we have these are some advanced options so i'll just leave them as it is and then lastly we have the save button.
Let's click on that and our settings have been saved the next thing is that we have to add this code to our blogger website so just click on copy code and go to the.
Blogger dashboard and then go to theme then click on this arrow and click on edit html and you have to paste it inside the head section so we can see.
It should be pasted inside the head section so this is the head section of our website let's go ahead and paste the code right here and then just click on save.
So our code has been saved and that's basically it with the push notification let's click on finish and now let's go over here to our.
Website and let's refresh our page and let's wait 10 seconds and see whether we get the notification and here we can see we have the notification and we have the logo over.
Here as well we have the text and everything just as we set up and we have the option of don't allow and allow let's click on allow.
And i'll just click on allow over here and we have this message live blogger thanks for subscribing and that's basically it we can see that we have subscribed.
To this website now we can go ahead and send notifications to our subscribers so let's go back to the dashboard and here we can see that we have.