back arrow
All Blogs
Enabling AMP in Braze

How to Enable AMP in Braze for Dynamic Email Campaigns

Don’t give up on AMP for emails just yet. There's room for it in a number of ESPs and email clients. Learn how to implement it successfully. ...

The initial jog for AMP-enabled emails may have dulled. The pandemic already drew marketers’ attention away from experimenting with fancy emails. Add to that Google’s curious insistence on the AMP standard being a standalone application, unrelated to its parent founder, which might have caused a promotional trough. 

More significantly, the incredibly low support for AMP emails in the US and Europe has pushed the standard to relative obscurity. Since consumers are yet to be fully trained to experience AMP emails, there hasn’t been any solid sense of loss among marketers. Most marketers are happy to include standard interactive features into their emails, such as hamburger menus, hotspots, games, toggles, tabs, etc.

But all’s not lost! Quite a number of ESPs do support AMP technology. In this how-to guide, you will learn how to enable AMP in Braze, one of the leading ESPs and customer management platforms in the market today. Let’s get going! 

What is AMP?

Launched by Google in 2019, AMP (Accelerated Mobile Pages) is an open source HTML framework developed by the AMP Open Source Project. 

AMP enhances the performance and user experience of mobile web content by simplifying code and enabling near-instant loading. It achieves this by compressing large files and loading only essential elements required to display a webpage. 

There are four types of AMP: AMP websites, Web Stories, AMP ads, and AMP emails. 

In the context of email marketing, AMP allows marketers to create dynamic and interactive emails, featuring elements such as carousels, accordions, drop-down menus, forms, etc. The goal is to bring app-like functionality within emails. Here’s an example of an AMP-powered email. (Note: ⚡ is the standard sign of an AMP email)

AMP

Currently, the following email clients support AMP technology:

  • Gmail
  • FairEmail
  • Mail.ru
  • Yahoo Mail  

Feel free to go through the full list of supported email clients, platforms, and email providers. 

Enabling AMP on Braze 

Once you’re ready to deploy your dynamic emails to your audience, it’s essential to register each sender email address with Google. Registration is a one-time process, even if your email content evolves or if the same sender address serves other purposes in the future.

1. Create an AMP email

Creating an AMP email involves meeting certain core requirements:

  • To comply with AMP standards, AMP emails need to be clearly identified by including either ⚡4email or amp4email in the HTML tag.
  • The <head> tag must also contain a <script> tag that loads the AMP runtime. <script async src=”https://cdn.ampproject.org/v0.js“></script>
  • A CSS boilerplate to initially hide the content until AMP is loaded: <style amp4email-boilerplate>body{visibility:hidden}</style> 

This code sets the visibility of the body element to hidden, ensuring that the content remains hidden until the AMP components are fully loaded.

  • To add AMP to your emails, you’ll need to introduce a new MIME part with the content type of text/x-amp-html. This AMP MIME part should be nested under a multipart/alternative node and coexist with the existing text/html or text/plain parts. This setup guarantees that the email message renders correctly across all clients.

The below example shows the minimum markup required to make an email a valid AMP email. 

AMP code

2. Test your AMP code

Having created your AMP email, you need to test the AMP code. 
You can check the validity of your AMP code either on AMP Playground or on Gmail AMP for Email Playground. Below is a screenshot of our AMP code being tested on AMP Playground.

AMP Playground

You can insert or paste your AMP code into the Playground and verify it. If there are any errors in the code, the page will display them at the top and provide suggestions on what might be missing or mistaken, similar to the preview shown below.

Verify AMP Playground

Gmail AMP for Email Playground works similarly. You can use the Gmail Playground to insert or paste your code for validation. If your code is correct, the validation status will show “PASS” as the following screenshot shows.

Gmail AMP for Email Playground

If there are errors, it will display a “FAIL” result along with a suggestion message as shown below. 

Error in Gmail AMP for Email Playground

3. Send a test email in Braze

This step involves sending a production-ready AMP email. The registration process requires sending a test AMP email for approval. 

You need to meet the following requirements to register successfully:

  • Emails should include a fallback MIME part with “text/html” content type. This part is displayed in cases where dynamic email is disabled, ensuring consistent delivery of content to all users.
  • Comply with all client-specific sender standards.
  • You must authenticate the emails using SPF, DKIM and DMARC.
  • Ensure that you have reviewed AMP for Email best practices.
  • Your email should be error-free. (Refer to the previous section)
  • Make sure to send a genuine production email. Avoid sending emails with just “Hello world” or blank content.
  • Ensure that the subject line is appropriate and avoids placeholder strings such as {name} and {count}, as well as test strings like [Test], [Proof mail], and [Sample], both in the subject line and the body of the email.

Once you’ve confirmed the above points, send a production-ready AMP email from Braze to the following email addresses:

Time to send the test email from Braze Editor! Follow these steps:

  • Log in to your Braze account
Log in to your Braze account
  • Go to Template. Select Email Templates 
Select Email Templates from  Braze account
  • Select HTML Editor. Click + Create HTML Template
Create HTML Template
Create HTML Template
  • Add the template name and subject line
Add the template name and subject line
  • Click Edit Email Body
Edit Email Body
  • In the ‘HTML’ tab, add your HTML version of the AMP email
Add HTML version of the AMP email
  • Click ‘More‘ and select the ‘AMP‘ option. In the AMP tab, add your production-ready AMP code 
Click AMP Option
  • Send the test email. For that, go to Preview & Test.
Preview & Test
  • Select Test Send. Add email ID in the second box – ‘Add individual users’, and click ‘Send Test’.
Send Test

Send the email directly instead of forwarding it. When emails are forwarded in Gmail, AMP MIME parts are removed. 

Registration works on a per-sender-email-address basis. If you intend to register multiple sender email addresses, each address must be registered individually, and each must send its own production-quality email for approval.

4. Submit the Google registration form

Sender registration is necessary for email clients to display AMP emails to users. You need to fill the AMP for Email: Sender Registration form. This single form is sufficient to be allowlisted for sending AMP emails across all supporting email clients. You only need to submit this form once for any domain you wish to register.

Remember, this is the most important step. Note also that Google will reject your registration application if you don’t send an email for review. 

After sending a test email and completing the Google registration form, you should expect to wait approximately five days for a response. In most cases, responses are received within five working days. Once Gmail has accepted your registration, you can start including AMP email content in your Braze email campaigns. 

Food for thought?

Implementing AMP for email is not easy. For one thing, not many brands use it for reasons already discussed. Second, configuring it for a particular ESP can be a complex process, requiring significant development resources. 

All that said, with ESPs like Braze, and a strong development team at your disposal, you can successfully implement AMP for email. From product selections to appointment bookings, AMP technology is the blend of app and web experiences in email. 

The future of AMP for email remains to be seen. In the meanwhile, if you want to bring more engaging experiences to your subscribers’ inboxes, get in touch with our Braze-certified experts today for a free consultation. 

Did you like this post? Do share it!

    Get In Touch

    We shall get back to you within a few hours.

    Kanchan Gupta

    Kanchan Gupta is a Senior HTML Developer at Mavlers with over 9 years of experience in email development. She specializes in developing email templates, newsletters, and creating campaigns. She is proficient in utilizing leading email marketing platforms such as Braze, HubSpot, Salesforce, Marketo, Klaviyo, MailChimp, Pardot, Iterable, and Campaign Monitor.

    Dhrupalsinh Barad

    As a seasoned project manager at Mavlers, I bring over nine years of expertise in Project Management, Email Marketing and automation, and Client Servicing. My enthusiasm lies in exploring emerging technologies, which I believe hold immense potential to transform our world positively. When I'm not busy solving problems for our clients, managing teams, or managing projects, you can find me lost in a good book or grooving to dance tracks. Helping others thrive and adding value wherever I can is what keeps me going.

    Susmit Panda

    A realist at heart and an idealist at head, Susmit is a content writer at Email Uplers. He has been in the digital marketing industry for half a decade. When not writing, he can be seen squinting at his Kindle, awestruck.

    YOU MAY ALSO LIKE

    WE CAN ALSO HELP YOU WITH

    Email Template
    Productions

    Transform your requirement into visually-appealing & high-converting email templates.

    EMAIL OPERATION
    SUPPORT

    Focus on your business strategy; let us handle the day-to-day operation of your email campaigns.

    DEDICATED
    RESOURCE TEAM

    Eliminate the woes of hiring and training for resources with our dedicated team of scalable email experts.

    Digital
    ASSETS

    Get more from your paid marketing campaigns through conversion-driven landing pages and banners.