How To Go Live With AMP Pages?

Accelerated Mobile Page is an open-source Framework from Google and Twitter that helps to load content on the mobile pages quickly.  Now, Google has started supporting subscriptions on AMP pages, and here’s how you can integrate PushEngage web push notifications on your AMP pages.

1.Add the code mentioned below to the <head> section of your website.

<script async custom-element=’amp-web-push’ src=’https://cdn.ampproject.org/v0/amp-web-push-0.1.js’ ></script>

2. Navigate to Site Settings > Site Details > Scroll down to Click here for Setup Instruction and select the AMP tab. Download the package file and save in the root folder, and add the service-worker.js file to the root directory of your website such that it is accessible.

3. Add AMP HTML to your <body> section where u want to show `Subscribe to updates’ and ‘Unsubscribe from updates’ button.

A. Here’s the AMP web push HTML configuration –

AMP Web Push HTML configuration

B. Here’s the code for ‘Subscribe to Updates’ button –

C. Here’s the code for ‘Unsubscribe from Updates’ Button –

Unsubscribe from updates` button.

4. Add AMP css to your <body> section. This help to customize your `Subscribe to updates’ and ‘Unsubscribe from updates’ button.

amp web push css

That would be it and your installation will be complete.

If in case you run into any issues, please feel to contact us by clicking here. Our support team would be able to help you.

Still stuck? How can we help?
Last updated on September 23rd, 2022

Engage and Retain Visitors AfterThey’ve Left Your Website

Increase the value of every web visit with Push Notifications that are hard to miss.

  • Forever Free Plan
  • Easy Setup
  • 5 Star Support