Bubble Setup

🚧
Non-HTTPS domains are no longer supported
Sites hosted on HTTP are no longer supported. As a result of this change, we are pausing support for this platform indefinitely. Sites that continue to use the os.tc domain will no longer be able to prompt for push notifications; however, existing subscriptions will continue to receive notifications.

This guide will walk you through how to set up Web Push for your Bubble site using the Website Builder setup process in the OneSignal Dashboard.

To jump back into the setup process at any point, go to App Settings and click Configure for the Google Chrome platform.

Pre-requisites:

A Bubble site

Step 1. Choose Integration

In the OneSignal Dashboard, click New App/Website from the All Applications page.

On the screen that appears, fill in the name of the app.

If your account is part of an Organization, select the name of the organization that the app should belong to from the list.

Select Web Push from the list of platforms, then click Next: Configure Your Platform.

On the screen that appears, select Website Builder > Bubble.

Step 2. Site Setup

Once you've selected Bubble as your integration, you must fill out information about your site.

Enter Site URL

You will need to enter in your primary domain that you have set up in Bubble.

Auto Resubscribe

Recommended: This feature is only for HTTPS sites and if you do not select "My site is not fully HTTPS". This allows users to automatically resubscribe upon returning to the site without being prompted if they clear their browser cache or if you are transferring to OneSignal from another push provider.

Default Notification Icon URL

Enter a link to an icon file that is at least 80x80 pixels. Recommended size is 192x192. The file must be .png, .jpg, or .gif.

Choose a Label

Select the “My site is not fully HTTPS” option.

Bubble implementations must choose a unique label that will be displayed as the originating subdomain in your notifications.

Warning: You can only change your label if you have less than 100 web push users. Once you have 100+ web push users, this setting is disabled.

Step 3. Permission Prompt Setup

To send push notifications to users, you first must ask them for permission using a Prompt. You must have at least one Prompt on your site for web push to work. Click Add a Prompt to open the permission prompt selector.

Permission Prompt Editor

Although the OneSignal dashboard gives you multiple options to ask users for permission to send them notifications, the best way to do this with the Bubble plugin is to choose the slide prompt and turn auto-prompt off.

The plugin provides a workflow action that allows you to prompt the user whenever you want to, giving you more control over the flow of this feature. This action also automatically sends your Bubble user’s unique ID to OneSignal once they accept notifications. This allows you to send notifications directly to users in your Bubble database. You will not be able to use this feature unless auto-prompt is turned off.

Step 4. Welcome Notification

Welcome notifications an optional way to thank users after subscribing to your site. Users will see a welcome notification as soon as they subscribe. You can edit or disable them here.

Step 5. Advanced Options

Most sites will not have to edit anything in Advanced options. See Web Push Advanced Options to learn more about each option.

👍
Site Configured
Once you've completed steps 1-5, click 'Save' to save your configuration.
Next, you'll need to add OneSignal to your site by following step 6.

Step 6. Enable OneSignal Plugin in Bubble

Retrieve your App ID and API Key from the OneSignal dashboard under Settings > Keys & IDs and enter them in the Bubble plugins tab.

Safari Custom Certificate (Optional) : OneSignal automatically provides the necessary certificates to work with Safari Browsers at no additional cost. If you already have your own Safari Web Push Certificates, toggle on this option to upload your Safari Web .p12 Push Certificate and password.

Step 7. Subscribe & Send a Test Notification

Visit the site and subscribe through the OnesSignal permission prompt that you configured in Step 3.

Then, send a test notification to yourself through the OneSignal Dashboard to test your implementation.

Bubble Setup

🚧
Non-HTTPS domains are no longer supported

Step 1. Choose Integration