Configure OneSignal For Web Push Notifications

In order to use our  Web Push Notifications system you will need to connect your Buddyboss account to OneSignal. Please follow the steps below to walk through setting up an account and creating your Application (App) for your site.

Create OneSignal Account

We integrate with OneSignal to provide your web push notification system. Let’s Sign Up to OneSignal account. Enter your Email Address, Password and Company or Website Name. Tick the box and agree with their terms and conditions. Lastly, click on the Create Account button. 

Sign Up to OneSignal

4 plans for using Onesignal will appear next. For instance, we are selecting the Free one. 

Select Free Plan

After clicking Get Started Now, OneSignal will send you a confirmation mail to your email.  

Check Your Email

Open that email and click on Confirm Your Account button. 

Confirm Your OneSignal Account

Now select your role category and the type of the company you want to add with OneSignal. Also, you will need to add the primary reason for using OneSignal and click Continue.

Select your Business Category in OneSignal

Add your Website name and hit the Create button.

Enter the Name of your App/ Website

Now, you will have to fill out the steps to get the most out of OneSignal. Let’s Set up your Messaging Channel. 

Quick Start guide in OneSignal

Press the first option here.

Setup Messaging Channels

For its Push Notification Configuration, we will select Web Configuration and click Continue

Push Notification Configuration in OneSignal

Select Custom Code option. And fill up the Site Name and URL. Also, you have to upload the Icon. 

A popup will appear in front of you, hit the Choose File and select an icon from your computer or drives. 

Now crop the icon as you like and click the Save button.

After that there will be a Save button below, click on it. You will navigate to another page, where you have to hit on Finish to complete the process.

And your Web Configuration is Active now. You will get the confirmation like in the image below. 

If we move on the other options like Adding or Migrating users you can either click Next Step or Upload CSV file from your website.

We have clicked Next Step and a green tick will appear next to it. 

Connect OneSignal with BuddyBoss Website

You have completed the OneSignal account initially. Now, navigate to BuddyBoss > Integrations > OneSignal

OneSignal Integration in BuddyBoss

First, you will see this notice at the top asking you to enter a new API key in order to resume sending web push notifications. If you click on the link here, you will be redirected to this exact page to set up your OneSignal. 

As you can see on this page, you need to enter your OneSignal App ID and Rest API key. To get this information, let’s go to our OneSignal Account. Click on the App you previously created then hit the Settings > Keys & IDs tab. 

OneSignal App ID and Rest API Key

Right away, you will see your OneSignal App ID and Rest API keys. I will copy these and paste them back to my WordPress site. Then click Save Settings.

Fill up the OneSignal App ID and Rest API Key

If there is any issue with connecting your OneSignal account, you will get this type of warning. 

Not Connected warning in OneSignal

If the Site URL for the BuddyBoss app doesn’t match this site’s URL then you will get this type of error message. 

Connected though Having issue with your app's configuration

Set Up the Web Push Notifications

Next you will need to activate the Web Push Notifications. Go to BuddyBoss – Settings – Notifications

Now scroll down to find out the Web Push Notifications. Firstly, tick the box of Enable Web Push Notifications. Then you can Upload the Default Notification Icon.  

After clicking on the Upload button, a popup will appear. Hit on the Select your file button.

Select an image and click on Crop Photo

Tick the box of Automatically Request Permission and Enable Soft Prompt. You can add whatever message you want to show. 

You can change the text of Allow Button and Cancel Button. Lastly, hit the Save Settings button.

Let’s move to the frontend to see how the notification works after a member just logged in. 

OneSignal Notification in Your BuddyBoss

Just like that, you have now connected your OneSignal account to your BuddyBoss site and the web push notifications should continue to work.


We're always happy to help with questions you might have! Search our documentation, contact support, or connect with our sales team.