Guides

Messenger on AMP Pages

Suggest Edits

Acquiring Messenger Subscribers through your AMP Page

This feature will help you boost your messenger subscriptions and reach out to a wider audience who visit your AMP page. Since JavaScript is not supported on AMP pages we provide a button which you can add on your AMP page. Once a visitor clicks on this button he gets redirected to his messenger inbox.

📘

Note

A user is added as a subscriber once he clicks on the 'Get Started' CTA button in his messenger inbox.

Steps to Add a Messenger Button on your AMP Page

Step 1: Navigate to your Facebook page and copy the page @Username. The username will be available on the top of your Facebook page below the Page Name.

Step 2: Add the below code on your AMP page and replace the YOUR_PAGE_NAME field with your page Username.

<button style="font-family: Arial; font-style: normal; font-weight: 500; font-size: 14px; line-height: 16px; letter-spacing: 0.7px; color: #FFFFFF; padding: 10px 20px;
    background: #6364EB; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); border-radius: 4px; border: none; display: flex; flex-direction: row; align-items: center; cursor: pointer;"
    type="button" on="tap:AMP.navigateTo(url='https://m.me/YOUR_PAGE_NAME',target=_blank)">
               
        <svg style="margin-right: 10px;" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none">
               
            <path fill-rule="evenodd" clip-rule="evenodd" d="M8.68617 8.85792C9.24226 8.00703 10.3176 8.00319 11.0808 8.56569L13.6897 10.4877C13.9591 10.6716 14.2332 10.6668 14.4624
            10.4877L17.799 7.96199C18.3582 7.46394 19.2135 8.07075 18.666 8.86671L15.3433 13.9528C14.7873 14.8037 13.7117 14.8074 12.9485 14.2451L10.3398 12.3228C10.0703 12.1392 9.79634
            12.1439 9.56691 12.3228L6.23054 14.8488C5.67133 15.3466 4.81586 14.7398 5.36335 13.9441L8.68617 8.85792ZM8.54262 21.8282C9.63393 22.1917 10.8012 22.3889 12.0147
            22.3889C18.0808 22.3889 22.9983 17.4714 22.9983 11.4053C22.9983 5.33936 18.0808 0.421875 12.0147 0.421875C5.94874 0.421875 1.03125 5.33936 1.03125 11.4053C1.03125 14.6732
            2.45874 17.6069 4.72358 19.6189V22.7207C4.7157 23.2951 5.34119 23.6758 5.85096 23.3822L8.54262 21.8282Z" fill="white"/>
        </svg>

        Get Latest Updates in Messenger
</button>

Step 3: Once the button is added on your page you shall be redirected to the messenger inbox where you can click on 'Get Started'

❗️

Note

Please note that the messenger button URL should be accessible and should redirect the user to the messenger inbox. Here is a test link.

Updated over 1 year ago