> ## Documentation Index
> Fetch the complete documentation index at: https://docs.worldvisagroup.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Pushpad Push Integration with WorldVisa

> Connect Pushpad to WorldVisa to send web push notifications through workflows. Store your Pushpad project ID and auth token in the WorldVisa dashboard for delivery.

This guide walks you through the entire process of configuring and using [Pushpad](https://pushpad.xyz) with WorldVisa, from getting your credentials to sending your first notification.

[Pushpad](https://pushpad.xyz) is a web push service that supports sending notifications to all major browsers via FCM, Mozilla autopush, Windows Push Notification Services, and APNS, with just one simple API.

## Configure Pushpad with WorldVisa

Before you can send notifications, you need to connect your Pushpad project to WorldVisa by getting your credentials and adding them to your integration settings.

### Step 1: Get your Pushpad credentials

To configure the Pushpad integration, you need:

* An active Pushpad account
* A Pushpad auth token (found in the [account settings](https://pushpad.xyz/access_tokens))
* Your Pushpad project ID (found in the project settings)

**1. Log in to Pushpad**

Open your Pushpad dashboard and sign in.

**2. Create a project**

![New project](https://mintcdn.com/wv-enterprise/l3bkwl1N_3mOn9aW/images/developers/channels-and-providers/push/pushpad/new-project.png?fit=max\&auto=format\&n=l3bkwl1N_3mOn9aW\&q=85\&s=4416597690182347cbc6c66b6d10253e)

**3. Record the Project ID**

Click **Settings** on the project page and record the **Project ID**. You need it to connect to WorldVisa.

![Project ID](https://mintcdn.com/wv-enterprise/l3bkwl1N_3mOn9aW/images/developers/channels-and-providers/push/pushpad/project-id.png?fit=max\&auto=format\&n=l3bkwl1N_3mOn9aW\&q=85\&s=3710ba898951866abf8773f2edd2bcbd)

**4. Open access tokens**

Navigate to the [access token](https://pushpad.xyz/access_tokens) page.

**5. Add access token**

Generate a token in Pushpad and paste it into the integration form.

**6. Create the token**

Fill in the required fields to create a new access token, or use your existing token if you already have one.

![Add access token](https://mintcdn.com/wv-enterprise/l3bkwl1N_3mOn9aW/images/developers/channels-and-providers/push/pushpad/add-token.png?fit=max\&auto=format\&n=l3bkwl1N_3mOn9aW\&q=85\&s=a52919076cc5dc295818dfbd4f9107f7)

**7. Copy the token**

Copy the generated token. You need it to connect to WorldVisa.

![Generate access token](https://mintcdn.com/wv-enterprise/l3bkwl1N_3mOn9aW/images/developers/channels-and-providers/push/pushpad/access-token.png?fit=max\&auto=format\&n=l3bkwl1N_3mOn9aW\&q=85\&s=2fc018ec188771c7c3f9310218f6be70)

### Step 2: Connect Pushpad to WorldVisa

Add these credentials to your Pushpad integration in the WorldVisa dashboard.

**1. Log in to the WorldVisa dashboard**

Open the WorldVisa Dashboard.

**2. Open Integration Store**

On the WorldVisa dashboard, navigate to the **Integration Store**.

**3. Connect a provider**

In the **Integration Store**, click **Connect provider** to begin setup.

**4. Select Push tab**

Open the **Push** tab in the Integration Store.

**5. Select Pushpad**

In the **Push** tab, choose **Pushpad** from the provider list.

**6. Paste credentials**

In the Pushpad integration form, paste your access token and project ID from [Step 1](https://docs.worldvisagroup.com/developers/integrations/push/pushpad.md#step-1-get-your-pushpad-credentials) into the corresponding fields.

![Pushpad Integration in WorldVisa](https://mintcdn.com/wv-enterprise/l3bkwl1N_3mOn9aW/images/developers/channels-and-providers/push/pushpad/pushpad-integration.png?fit=max\&auto=format\&n=l3bkwl1N_3mOn9aW\&q=85\&s=5ab187583d65acaa74223e962687bbb9)

**7. Create the integration**

Review your credentials, then click **Create Integration** to save.

## Activity tracking

Pushpad supports [push activity tracking](https://docs.worldvisagroup.com/developers/integrations/push/push-activity-tracking.md). Enable the **Push Activity Tracking** toggle on the Pushpad integration, then forward events from your site.

WorldVisa sends the WorldVisa message id as Pushpad `custom_data`. Pushpad passes that string only to [action button](https://pushpad.xyz/docs/action_buttons) callbacks. A tap on the notification body does not include it. Chrome is the only browser that shows action buttons, and it shows at most two.

Add a button whose `action` matches a function on `self.notificationActions`. Leave `custom_data` as the value WorldVisa sets. Replacing it removes the message id.

```json theme={null}
{
  "actions": [
    { "title": "View", "action": "trackClick" }
  ]
}
```

You can set `actions` with a [provider content override](https://docs.worldvisagroup.com/developers/integrations/push#every-other-push-provider-is-a-raw-passthrough). In the service worker, `customData` is the message id:

```javascript theme={null}
self.notificationActions = {
  trackClick: function (customData) {
    return fetch("https://your-api.com/api/notifications/events", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        eventType: "clicked",
        eventId: customData,
      }),
    });
  },
};
```

Your backend then calls [WorldVisa's activity endpoint](https://docs.worldvisagroup.com/developers/integrations/push/push-activity-tracking.md#step-3-forward-events-to-WorldVisa-from-your-backend). `delivered`, `opened`, `dismissed`, and `failed` use the same `eventId`.

## Using Pushpad with WorldVisa

Once your integration is configured, in other to send push notification using the PushPad provider, you must do the following:

### Step 1: Add subscriber device token

After [setting up the Pushpad SDK](https://pushpad.xyz/docs/pushpad_pro_getting_started) on your website, you must [assign a user ID (uid)](https://pushpad.xyz/docs/identifying_users) to your users' push subscriptions.

This `uid` is the identifier WorldVisa uses to target a specific browser. For example, if you use `pushpad('uid', 'user123')`, then `user123` is the ID you must register in WorldVisa.

You can do this by making an API call to update the subscriber's credentials.

```bash theme={null}
curl -L -X PUT "${WV_API_URL}/v1/subscribers/<SUBSCRIBER_ID>/credentials" \
-H 'Content-Type: application/json' \
-H 'Accept: application/json' \
-H "Authorization: ApiKey ${WV_API_KEY}" \
-d '{
  "providerId": "pushpad",
  "credentials": {
    "deviceTokens": [
      "token1",
      "token2",
      "token3"
    ]
  },
  "integrationIdentifier": "pushpad-MnGLxp8uy"
}'
```

### Step 2: Send a notification

Now you're ready to send a push notification. [Create a workflow with a Push step](https://docs.worldvisagroup.com/developers/workflow/create-a-workflow.md) and then trigger it. WorldVisa sends the notification to the `uid`s associated with the subscriber.

The example below demonstrates a simple trigger using WorldVisa’s SDK.

```bash theme={null}
curl --location "${WV_API_URL}/v1/events/trigger" \
--header 'Content-Type: application/json' \
--header "Authorization: ApiKey ${WV_API_KEY}" \
-d '{
    "name": "workflowId",
    "to": [
        "subscriberId"
    ],
    "payload": {}
}'
```


## Related topics

- [Activity Tracking](https://docs.worldvisagroup.com/developers/integrations/push/push-activity-tracking.md)
- [Push Webhook Push Integration with WorldVisa](https://docs.worldvisagroup.com/developers/integrations/push/push-webhook.md)
- [Expo Push Push Integration with WorldVisa](https://docs.worldvisagroup.com/developers/integrations/push/expo-push.md)
- [APNS Push Integration with WorldVisa](https://docs.worldvisagroup.com/developers/integrations/push/apns.md)


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.