WordPress Setup

How to set up OneSignal Web Push notifications on WordPress sites

This guide will walk you through how to set up web push on WordPress and WordPress VIP. If you do not use WordPress, or wish to write custom code, please go to Web Push Quickstart.


Step 1. Choose Integration

Head over to onesignal.com to create an account. If this is not your first app with OneSignal, select New App/Website, name your app, select Web and "Next".

21402140

Image showing platform selection

Select WordPress Plugin or Website Builder to continue:

20022002

Image showing web push selection

Step 2. Site Setup

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

13791379

Image showing Site Setup step

Field

Description

SITE NAME

The default name to call your site used in push notifications.

SITE URL

Your website URL including:

  • http:// or https://
  • www or non-www links (e.g. https://example.com, https://www.example.com)

AUTO RESUBSCRIBE (HTTPS ONLY)

Recommended: Allows push subscribers to automatically resubscribe upon returning to your site without being prompted if they clear their browser data or if you are transferring to OneSignal from another push provider.

DEFAULT ICON URL

Icon used for the Slide Prompt and default for push notifications.

Enter an https icon URL or upload file that is square 256x256 pixels.

The file must be .png, .jpg, or .gif.

My site is not fully HTTPS

Select this checkbox if any apply:

  • you have an HTTP website
  • your site is hosted by WordPress.com

Field

Description

CHOOSE A LABEL

The subdomain label used for push subscription. See Web Push HTTP vs. HTTPS for more details.

Step 3. Advanced Push Settings (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, you may upload it here.

Optional: Upload your own .p12 certificate

If you would like to add your own Safari P12 Certificate turn on the settings in Advanced Settings. This enables you to update your own Private Key File and Private Key Password.

12041204

Advanced push settings in Wordpress Setup.

Step 4. Configure WordPress Plugin

Add the OneSignal WordPress Plugin to your WordPress website if you have not done so already.

Copy the following keys:

17481748

Image dhowing your App ID and API Key

Paste these keys into your WordPress plugin Configure tab in the appropriate inputs:

20082008

Turn on Push Prompts

Enable the Slide Prompt and Subscription Bell Prompt. These prompts allow you to ask site visitors permission to send them push notifications, making them push subscribers to your site.

23822382

Finish and Save Your Settings

Be sure to Save your configuration at the bottom of the plugin once you've added these keys.

20082008

Step 5. Add your first user

Visit your website and you should see the OneSignal Slide and Subscription Bell on your site. You may need to clear any cache plugins you have and refresh the page.

Subscribe to push notifications and check your OneSignal Dashboard Audience > All Users to see your Device Record.

Make sure push notifications are enabled in your device settings. Then head over to Messages > New Push to Send your first Push Notification from OneSignal.

πŸ“˜

Troubleshooting

If running into issues, checkout the Troubleshooting WordPress for common fixes and plugin configurations.

If stuck, feel free to contact [email protected] for assistance.

Step 6. Add Prompts To Your WordPress Site

Setup your prompts in the OneSignal WordPress Plugin, so that users can subscribe to push notifications. You can do this in the Configure section of the plugin.

Subscription Bell

A small icon at the corner of your page that users can interact with to subscribe

Slide Prompt

A small modal that comes from the center of the page and asks if users are interested in signing up.

πŸ“˜

More Customizations

For more things you can do with prompting, see WordPress Customizations.

Step 7. Send Push From Your WordPress Site

Notifications can be sent automatically when you publish a post from the WordPress "Posts" tab. You can send push anytime from the OneSignal.com Dashboard or API. See Sending Push Messages.

Simply create your post as usual and under "OneSignal Push Notifications" check Send notification on post publish.

19901990

If your post is a different post type, you might see "Send notification on forum publish". If you are updating instead of creating, you might see "Send notification on post update". Each of these options should successfully send a notification on the described action.

πŸ“˜

More Customizations

For more things you can do with sending push, see WordPress Customizations.

Welcome Notification

Welcome notifications are 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 in the Configure section of your plugin.


Did this page help you?