# Web push via Google Tag Manager

Implement push notifications in four steps without any coding!\
Pushwoosh WebSDK Lite can be added to your website through Google Tag Manager, making the integration process as easy as possible.

<Aside type="note">
#### Partial Functionality

Note that of all visitors of your website, only those using Chrome or Firefox would be able to subscribe for and receive push notifications. The WebSDK Lite also has limited access to Pushwoosh features, such as custom Tags, UserIDs, or event-triggered messaging. For details, please reach out to our [Support Team](https://help.pushwoosh.com/hc/en-us/requests/new/)!
</Aside>

## Integration

### Firebase Credentials

In the [Firebase Console](https://console.firebase.google.com/project/\_/settings/cloudmessaging/), choose your project to obtain your Firebase **Server Key** and **Sender ID**. Please see the screenshot below for reference:

<img src="/web-push-notifications-web-push-via-google-tag-manager-1.webp" alt=""/>

### Pushwoosh Control Panel

Go to Pushwoosh [**Control Panel**](https://go.pushwoosh.com/v2/applications) and add a new app. On the opened page, configure Chrome or Firefox platform by clicking the **Configure** button in the respective row. Fill in the form:

* The **Server Key** from Firebase Console into the **API key** field;
* The **Sender ID** from Firebase Console into the **FCM Sender ID** field;
* The exact address of your website into **Website Name** field.

<img src="/web-push-notifications-web-push-via-google-tag-manager-2.webp" alt=""/>

Make sure to copy the Application Code of the newly created app, you'll need it later. The app code is highlighted below:

<img src="/web-push-notifications-web-push-via-google-tag-manager-3.webp" alt=""/>

### Google Tag Manager

**1.** In Google Tag Manager, choose a container or create a new one.

<img src="/web-push-notifications-web-push-via-google-tag-manager-4.webp" alt=""/>

**2.** Create a new Tag and choose **Custom HTML** in Tag Configuration.

<img src="/web-push-notifications-web-push-via-google-tag-manager-5.webp" alt=""/>

**3.** Copy the script below and paste it into the HTML field;

```txt
<script type="text/javascript" src="//cdn.pushwoosh.com/webpush-lite/v1/pushwoosh-web-notifications-lite.js?pw_application_code=#####-#####" async></script>
```

**4.** Change number signs `#####-#####` (highlighted on the picture below) in the script to your Pushwoosh Application Code, which you acquired in Step 2.

<img src="/web-push-notifications-web-push-via-google-tag-manager-6.webp" alt=""/>

**5.** Scroll down to Triggering options and choose **All Pages**.

<img src="/web-push-notifications-web-push-via-google-tag-manager-7.webp" alt=""/>

**6.** Click "Save". Your Tag is ready!

### Push subscription button

Let users subscribe for push notifications with a push subscription button. To set up the button, simply add the following script via Google Tag Manager.

```txt
<div style="text-align:center;margin:90px 0;">
  <button style="color:#000000;background: none;font-size: 16px;cursor: pointer;font-weight: 700;padding:0 60px;line-height: 60px;border:3px solid #000000;" type="button" name="button" onclick="window.pushwooshLite.instance.showSubscriptionWindow()">Subscribe Now</button>
</div>
```

All done! Your website's visitors can now subscribe for and receive push messages.