Prerequisites
You'll need a valid Progressier subscription and have completed the onboarding
You'll need a Bubble app on the Personal plan or higher
Install the official Progressier plugin
Go to your Bubble dashboard, click on Plugins in the menu, and click on Add plugins.
Search for Progressier, choose Progressier — PWA & Web Push, click Install, and then Done.
In the Progressier dashboard, go to Settings > Danger Zone > API Key and copy the value you find there. Then paste it into your Bubble dashboard in the API key field.
Follow the instructions in this article to connect your Bubble data with push subscriptions.
Use the API in a workflow
Now that you've initialized the connection with Bubble, you can use Progressier in a workflow. The email targeting action enables you to send a notification to a specific user. The general targeting action allows you to send a notification to all subscribed users in one go.
Select Insert dynamic data to use your user data. You can now trigger push notifications as part of any workflow!
API Fields
title required
The title of the push notification, up to 50 characters. This typically identifies the sender of the notification, i.e. you or one of your users depending on the purpose of the notification.
body required
The main message of the push notification, up to 100 characters. Avoid repeating your app name or what you already set in title. It's generally a good idea to display a text preview of the content users will see when they click the notification.
url required
The URL where users will be taken when they open the push notification.
email required with the email targeting plugin action
The email of the user to notify. You may want to use Bubble's native function: Insert dynamic data > Current's User email for testing purposes. But in most cases, you'll want to generate a dynamic list of emails based on other criteria. Note that you can enter a single email (e.g. hello@progressier.com) or a comma-separated list of emails (e.g. user1@progressier.com,user2@progressier.com,user3@progressier.com).
recipients required with the general targeting plugin action
An JSON object with key/value pairs that identify one or more recipients of the push notification. The push notification will be sent to every user that matches your rules. For example, if you set this to {"email": "example@progressier.com"}, the notification will be sent to any user whose email is exactly example@progressier.com. If you specify multiple parameters, push notifications will be sent to users that match all rules. For example, if you specify {"browser": "Chrome", "country": "DE"}, notifications will be sent to all users that use Chrome AND are in Germany. To send a notification to ALL users, simply set recipients to {} (i.e. an empty object)
icon optional
The URL of an icon that represents the sender of the notification. If not specified, Progressier uses the image specified at Design > Icons & Colors > Default push sender icon. Minimum resolution: 192x192 pixels | Recommended aspect ratio: square 1:1 | Format: JPG or PNG
badge optional
The URL of a monochrome badge that replaces the Chrome icon on Android. If not specified, Progressier uses the image specified at Design > Icons & Colors > Monochrome app badge. Minimum resolution: 72x72 pixels | Format: PNG | Since badges must appear on both light and dark backgrounds, you have to upload a transparent PNG image that can be turned monochrome.
image optional
The URL of a large image accompanying the push notification. Use this field to show an image preview of the content the user will see when they open the notification. If not specified, no image will be used. Recommended aspect ratio: 2:1 landscape | Recommended size: 1440x720px | Max width: 2000px | Min width: 300px | Format: JPG