Setup Web Notifications For Blogger
Web Push Notifications are the notifications that can be sent to a subscriber via his desktop browser or his mobile browser. These notifications are alert messages that notify the subscriber of the activity from their favorite site.

Web Push Notifications are the future of marketing. The web is gradually changing from email marketing to web push notifications. The reason is very simple.

Today most of the people would rather use their phones for browsing than PC's and not all of them have email notifications enabled. And even if they do it is very rare that they read your newsletter. But most of the people are going to use their browser for browsing the web. So if you use web push notifications then your newsletter reaches more people and hence more visitors for your site. Hence it being called the future of marketing.

A few years back if you had asked a developer that what mobile device features were missing from the web, push notifications would have been high on that list. But now web push notifications have become a reality and you would find many of the top sites like Facebook, Twitter, and Reddit using it.

Web Push Notifications service is provided by different companies. Some of the most notable ones include:

  • OneSignal
  • Kumulos
  • Pushwoosh
  • MixPanel
  • Urban Airship

And a few others. But unfortunately, not all of them provide this service for Blogger. Among them, OneSignal is the one which supports Blogger Platform. So today we are going to review OneSignal and learn how to set it up on Blogger. So without wasting any time let's start.


OneSignal is a multi-platform web push notifications service that was launched in 2014. It provides mobile and web push notifications along with email notifications service too. It is widely used and has about 500K+ Users. It is free to use (offers premium packages too) and provides all the main features.


#1. Free

OneSignal is free to use although it provides premium packages too. But the Push Notifications stuff is completely free.

#2. Compatibility

OneSignal not just provides web push notifications but they offer native push notifications for different platforms. So you can set it up differently for different apps or browsers. 

#3. Various Templates

OneSignal provides different templates for web notifications, so you can customize the appearance of the web push notifications.

#4. A/B Testing

With A/B Testing OneSignal allows you to test different messages with different users by using various segments. This feature is very common in email marketing.

How OneSignal Works?

Any website can enable web push notifications just by installing the OneSignal's  Web-Based SDK. No app is needed. And when a new user opens your website OneSignal promotes a message box asking the user to subscribe to web push notifications. And you can send notifications by logging in to your OneSignal Account. A User that receives the notification can view the post by clicking on the notification.

How to Set It Up On Blogger?

Okay so to set it up on blogger follow the given steps. Before dealing with coding stuff always backup your template so that you do not end up messing your templates.

#1. Creating OneSignal Account

The first thing you need to do is to create a OneSignal account. To create a OneSignal account OneSignal.Com And click on the login button present on top. And opt for sign up. You can signup for a OneSignal Account by using Email, Google, Github, and Facebook. Fill out the form to signup. Verify your account by the email you receive and you are good to go.
OneSignal Signup

#2. Selecting a Platform

Now after logging in you would be redirected to the All Applications page. Click on Add App and name your app by your website. After creating the app you will see a pop-up box to set up a platform. In our case, we want to enable web notifications for our website. So Chose WebPush and click next.
OneSignal Platform Setup

#3. Configuring Web Push

Now comes the longest part of setting up OneSignal. Follow the tutorial step by step.

Choosing Integration

In the case of Integration, you are given three options
  • Typical Site
  • Wordpress Plugin or Website Builder
  • Custom Code
Click on Wordpress Plugin or Website Builder. Now in the list of website builders chose Blogger.
OneSignal Integration

Blogger Site Setup

In this section, you are given a form. Enter your Site's Name and URL. Now upload your blog's Favicon Icon. And then chose a label. It's like your username. For example, I give my blog label 'Octofuss' Then it will have the URL 'OneSignal.Com/Octofuss'.
OneSignal Blogger Site Setup

Permission Prompt Setup

Every site ask's users permission before sending notifications. So it is very much the subscribe box. It is of following types:
  • Bell
  • Slide Prompt
  • Custom Link
OneSignal Bell

OneSignal Slide PromptCustom Link
Select the Prompt type. Next, you can change the Size, Background-Color, Text Color, Location. You can also choose to hide the bell if a user has already subscribed or you can customize bell text.

Welcome Message (Optional)

You can write a custom Welcome message if you want that your subscriber will receive when he subscribes. You can also attach a link.

Advanced (Optional)

Webhooks: Webhooks allows you to track the click-through rate for a particular message. 

Customizing Service Worker paths and filenames: We recommend to keep it in default settings.

Click Notification Behaviour: Let's you chose whether to open the message link in the same tab or a new one.

Persistence: Allows you to chose whether to let notification remain on screen until clicked. We recommend using it.

After configuring the web push click save.

#3. Adding Code To Site

Copy the code that is provided by OneSignal. Now follow the given steps:
  • Go to Blogger > Theme > Edit HTML
  • Search for </head> tag (Use CTRL+F for search)
  • Paste the provided code above it.
  • Now go to your site and you will see the permission dialog. Click subscribe and be your first subscriber.
  • Click Finish.


That's all from us today. We hope you like this post and find it helpful. Web Push Notifications is a rising trend on the web nowadays and Blogger users shouldn't be deprived of it. OneSignal is a good Web Push Notifications provider and it is free. So it is the best solution for Blogger Blogs. We hope you enjoy this article. Please do not forget to share it with your friends. Thanks!

You May Also Like


Post a Comment

Zero tolerance to Spam. Comments containing links will be deleted upon review.