Documentation Index

For the complete documentation index, see llms.txt. Markdown versions of docs pages are available through the page's alternate Markdown link.

Current page: Add dynamic content to HTML emails in Figma - The video shows how to use the Emailify Figma plugin to add dynamic personalized content to HTML emails, then export the design to an email platform such as Klaviyo. It demonstrates adding platform-specific personalization tags, dynamic image and link content, and conditional blocks or text using custom code.. Machine-readable page: /emailify/tutorials/add-dynamic-content-to-html-emails-in-figma.md.

Add dynamic content to HTML emails in Figma

The video shows how to use the Emailify Figma plugin to add dynamic personalized content to HTML emails, then export the design to an email platform such as Klaviyo. It demonstrates adding platform-specific personalization tags, dynamic image and link content, and conditional blocks or text using custom code.

← Back to Emailify Video Tutorials

What this video covers

The video shows how to use the Emailify Figma plugin to add dynamic personalized content to HTML emails, then export the design to an email platform such as Klaviyo. It demonstrates adding platform-specific personalization tags, dynamic image and link content, and conditional blocks or text using custom code.

Things you'll need

  • Figma
  • Emailify Figma plugin
  • An email marketing platform that supports personalization tags, such as Klaviyo or MailChimp

Steps

  1. Open Figma Resources, search for Emailify under the Plugins tab, and run the plugin.
  2. Create a new email in Emailify and add basic content such as text, an image, and a footer.
  3. Look up the personalization tags for your email platform in the Emailify documentation, such as Klaviyo variables or MailChimp merge tags.
  4. Paste a platform-specific variable into a Figma text layer to personalize content like a first name.
  5. Use Export HTML to upload the email to the selected platform, such as Klaviyo, with the API key set up.
  6. In the platform, create or open a campaign, choose the uploaded template, and preview it to confirm the variable is replaced with real customer data.
  7. Optionally add dynamic image sources, links, alt text, or conditional content using HTML & Mobile Settings, Quick add > Custom Code, and platform-specific template syntax.

Useful links