> ## Documentation Index
> This page relates to Cloudinary Integrations. Fetch the complete documentation index for all Cloudinary Integrations at: https://cloudinary.com/documentation/llms-integrations.txt?referrer=docpage and then use it to discover all relevant pages before exploring further.
> If your task extends beyond this product, fetch the top-level index covering all Cloudinary products and topics at: https://cloudinary.com/documentation/llms.txt?referrer=docpage

# Klaviyo Connect App



  
  

The Klaviyo Cloudinary integration lets you use your Cloudinary media, including dynamic, personalized image templates, directly in Klaviyo emails.
> **INFO**:
>
> The **Klaviyo integration** is currently in **Beta**. There may be minor changes to functionality, user interface, and other implementation details before the general access release. We invite you to try it out. We would appreciate any feedback via our [support team](https://support.cloudinary.com/hc/en-us/requests/new).

## Overview

Klaviyo is a marketing automation platform for email and SMS campaigns. The Cloudinary integration for Klaviyo connects your cloud to Klaviyo and adds Cloudinary assets as Universal Content blocks.

![Klaviyo Email Editor](https://cloudinary-res.cloudinary.com/image/upload/f_auto/q_auto/bo_1px_solid_grey/klaviyo_editor.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")

The integration enables you to:

* Access and select Cloudinary assets directly within the Klaviyo email editor
* Reference assets as reusable Universal Content blocks without duplicating them into Klaviyo
* Personalize dynamic Cloudinary templates using Klaviyo profile attributes and event data
* Automatically keep every email up to date when you re-render an asset in Cloudinary
* Track which Universal Content blocks in Klaviyo reference a given Cloudinary asset

### Use cases

**Single source of truth for campaign assets**

Save Cloudinary assets to Klaviyo as Universal Content blocks that reference the Cloudinary URL instead of copying the file into Klaviyo's image library. Re-rendering the asset in Cloudinary automatically updates every campaign and flow email that uses it.

**Personalize visuals with customer data**

Bind the text and image fields of a dynamic Cloudinary template (`.cldt.json`) to Klaviyo profile attributes or event data to personalize the visual for each recipient, then save the result as a Universal Content block. Recipients without matching personalization data see the template's default values.

> **NOTE**:
>
> * **Safari**: The Safari browser may require additional steps when logging in to the Media Library. If you encounter an issue, follow the prompts to log in separately and attempt to open the Media Library again. Alternatively, use one of the other [recommended browsers](dam_digital_asset_management#supported_browsers) when working with Cloudinary.

> * **Third-party cookies**: Some browsers (such as Firefox) may block third-party cookies by default, which can prevent the Media Library Widget from functioning properly. Users may need to explicitly allow third-party cookies for the Cloudinary domain (`https://cloudinary.com`) in their browser settings.

## Prerequisites

* **A Cloudinary account** with Media Library access ([sign up for free](https://cloudinary.com/users/register_free) if you don't have one).
* **A Klaviyo account** with permission to connect third-party apps.

> **TIP**: Optionally install the [Cloudinary Chrome Extension](chrome_extension_integration) to add a Cloudinary asset picker and personalization controls inside the Klaviyo editor.


## Set up the integration

### Connect Klaviyo to your Cloudinary account

1. Sign in to Cloudinary.
2. Click to open the [Klaviyo Connect](https://urls.cloudinary.app/klaviyo) dialog box from Cloudinary's App Marketplace.
3. Click **Enable**.
4. Click **Connect Cloudinary to Klaviyo**, allowing pop-ups if prompted.
5. Approve the requested permissions in the Klaviyo sign-in window to:
   * Verify your account
   * Create and update Universal Content blocks
   * Upload to the Klaviyo image library (only used if you choose the copy-upload option when saving assets)
   * List the events you can personalize on (e.g., **Placed Order**, **Added to Cart**)
   * Read recent events to populate relevant event fields and product images
  
When you return to Cloudinary, the **Setup** tab shows that you're **Connected**.

![Klavyio Setup Tab - Upload Defaults](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/klaviyo_setup_upload.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")

### Configure upload defaults

On the app's **Setup** tab, set the defaults applied whenever you save an asset to Klaviyo:

* **Default image/video transformation**: Select one from your [image](named_transformations) or [video](video_named_transformations) named transformations, respectively.
* **Alt text source**: Select the metadata option used as the alt text for assets you save to Klaviyo.

> **NOTE**: You can override the default transformation for any individual asset when you save it to Klaviyo.

## Use Cloudinary assets in Klaviyo

Save Cloudinary images, videos, and dynamic Cloudinary templates to Klaviyo, and add them as reusable Universal Content to your campaigns and flows.

### Save assets to Klaviyo

Saving an asset to Klaviyo creates a Universal Content block that you can then add to any campaign or flow email.

1. In the Cloudinary Media Library, select one or more assets.
2. From the assets toolbar, choose **Use in Klaviyo**.
   ![Save to Klaviyo Option](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/klaviyo_select.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")
   > **TIP**:
>
> To manage a single asset in Klaviyo, select **Use in Klaviyo** from the (3-dots) options menu on its Manage page, or from the **DAM Apps** option in the asset's context menu.
3. In the **Save to Klaviyo** dialog box, optionally expand **Delivery options** to change the defaults:
   1. Select a storage option:
      * **As Universal Content blocks (recommended)**, selected by default: references the Cloudinary URL without duplicating the asset, and updates automatically whenever you re-render the asset in Cloudinary.
      * **Upload a copy to Klaviyo's image library**: stores a separate copy in Klaviyo that no longer stays in sync with Cloudinary.
   2. Select a named transformation, or type a [raw transformation string](transformation_reference), to save variations of the selected assets in Klaviyo.
4. In the **Save as-is** section, click the **Save ... to Klaviyo** button. The label reflects how many assets you selected, for example **Save 3 assets to Klaviyo**, or **Re-save to refresh** for assets already saved.
   ![Save to Klaviyo Dialog](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/klaviyo_save.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")

> **READING**:
>
> :no-title

> * Cloudinary saves images as a static reference to the asset's delivery URL, and saves videos with an animated WebP or GIF preview that links through to the full-quality video. 

> * To personalize dynamic Cloudinary templates with Klaviyo data, see [Create personalized content with dynamic Cloudinary templates](#create_personalized_content_with_dynamic_cloudinary_templates).

### Use Cloudinary content in campaigns and flows

Once you save a Cloudinary asset as a Universal Content block, add it to any campaign or flow email in Klaviyo like you would any other content block.

> **TIP**: Use the [Cloudinary Chrome Extension](#use_cloudinary_from_the_klaviyo_editor) to add or replace assets directly from URL fields in the Klaviyo email editor. The extension opens the Cloudinary asset picker within Klaviyo, so you don't need to switch to the Cloudinary Console. Selected assets are copied to the Klaviyo image library and stored separately, so they no longer stay in sync with Cloudinary.

**To add a Universal Content block to your email:**

1. Edit a campaign or flow email in Klaviyo.
2. Click the **Add content** icon to add your Universal Content block to the email.
   ![Add a Universal Content block to an email](https://cloudinary-res.cloudinary.com/image/upload/f_auto/q_auto/bo_1px_solid_grey/docs/integrations/klaviyo_add_universal_content.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")
   > **NOTE**: If the Universal Content block contains a Cloudinary template that uses event variables to personalize its content, see [Create personalized content with dynamic Cloudinary templates](#create_personalized_content_with_dynamic_cloudinary_templates) to see the full flow.
3. Drag the Universal Content block into your email where you want it to appear.
4. Preview the email with a profile, or send a test, to verify the content renders as expected. 

**To replace an existing asset with a Universal Content block:**

1. Click the asset you want to replace and click the trash icon from its context menu. ![Delete an existing asset](https://cloudinary-res.cloudinary.com/image/upload/f_auto/q_auto/bo_1px_solid_grey/docs/integrations/klaviyo_replace.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")
2. Click the **Add content** icon to drag a Universal Content block into your email.![Add Universal Content block](https://cloudinary-res.cloudinary.com/image/upload/c_crop,w_1350,h_1350,g_south,y_80,x_380/f_auto/q_auto/bo_1px_solid_grey/docs/integrations/klaviyo_replace-3.png "thumb: w_400,dpr_2, with_code:false, with_url:false, width:400")
3. Drag the Universal Content block into the empty space.![Move the Universal Content block into the space](https://cloudinary-res.cloudinary.com/image/upload/c_crop,w_1900,h_1350,g_south,y_140,x_430/f_auto/q_auto/bo_1px_solid_grey/docs/integrations/klaviyo_replace-4.png "thumb: w_450,dpr_2, with_code:false, with_url:false, width:450")

> **TIP**: Notice the new image has a Cloudinary logo watermark. This is because of the named transformation that was [configured as an upload default](#configure_upload_defaults).

### Track assets saved to Klaviyo

To see where Klaviyo uses a Cloudinary asset, select one or more assets already saved in Klaviyo and open the **Links to Klaviyo** tab. It lists the Universal Content blocks that reference the selected assets, along with block thumbnails, block type, and whether the block still exists in Klaviyo. Use **Open in Klaviyo** to jump directly to a block.

> **NOTE**: Klaviyo's API reports usage at the block level, not which specific campaigns or flows embed a block.

![Links to Klaviyo Dialog](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/klaviyo_links.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")

## Create personalized content with dynamic Cloudinary templates

Dynamic Cloudinary templates let you create personalized visual content for your Klaviyo emails. Connect the template's images, videos, and text to Klaviyo profile or event data, then save the template as a Universal Content block. When you use the block in a campaign or flow, its content changes based on each recipient's data.

Follow the instructions below to create a dynamic Cloudinary template in Figma and personalize it with Klaviyo data.

If you only want to save existing images, videos, or already-built templates to Klaviyo as-is, see [Save assets to Klaviyo](#save_assets_to_klaviyo) instead.

{!partialdoc}partial_embed_your_own_video_player{!partialdoc}

{!videoTranscript:publicId=training/klaviyo_integration_templates}

{!collapsed:title=Tutorial contents}

{!partialdoc}partial_tutorial_contents{!partialdoc}

{!partialdoc}partial_tutorial_contents_klaviyo_integration{!partialdoc}

{!/collapsed}
-->

### Create a dynamic Cloudinary template in Figma

Dynamic Cloudinary templates let you design once, then swap dynamic elements, such as images, videos, and text, for personalization.

Use the [Cloudinary Figma Plugin](figma_integration) to create a dynamic template, then save it to Cloudinary so you can personalize it with Klaviyo data.

1. Make sure your Figma plugin is [open and connected](figma_integration#log_in_and_connect).
2. Start with a design in Figma, for example the visual you want to send as a personalized abandoned cart or promotional image.
3. Select the frame or artboard you want to export, then select the **Export Template** tab.
   ![Export Template tab](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/klaviyo_figma_export.png "thumb: w_800,dpr_2, with_code:false, with_url:false, width:800")
4. Define which layers become dynamic fields, the parts that change per recipient, and which layers stay flattened into the background image. 
5. Click **Create template** to save the template to your Cloudinary Media Library. Confirm uploading any custom fonts the design uses that aren't already in your Cloudinary account.

> **TIP**: See [Export Template](figma_integration#export_template_beta) in the Figma Plugin documentation for full details.

### Personalize the template with Klaviyo data

Open the personalization panel from either Cloudinary or Klaviyo:

* **From Cloudinary**: In the Media Library, select a single dynamic template and select **Use in Klaviyo** (see [Save assets to Klaviyo](#save_assets_to_klaviyo)). The **Personalize with Cloudinary** dialog opens.
  > **TIP**: If it doesn't open by default, first click **Personalize this template**.
  ![Personalize templates in Cloudinary](https://cloudinary-res.cloudinary.com/image/upload/bo_1px_solid_grey/q_auto/f_auto/klaviyo_personalize_templates.png "thumb: w_801,dpr_2, with_code:false, with_url:false, width:800")
* **From Klaviyo**: 
  > **INFO**: Personalizing dynamic templates from within Klaviyo requires the [Cloudinary Chrome Extension](#install_the_browser_extension_optional), which lets you personalize templates directly in Klaviyo, without switching to the Cloudinary Console.
  1. Edit the template's Universal Content block. 
  2. In the left panel in the Image section, click **Replace**.
  3. Select the **Dynamic image** tab to personalize the selected Universal Content Block.
  ![Personalize templates in Klaviyo](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/docs/integrations/klaviyo_edit_templates.png "thumb: w_801,dpr_2, with_code:false, with_url:false, width:800")

Once the panel is open:

1. Click **Add event data** (from Cloudinary) or **Event** (from Klaviyo).
2. Optionally **Select an event** to personalize against, such as **Placed Order** or **Added to Cart**. Selecting an event unlocks its fields, such as the ordered product's name or image, for binding in the next steps.
   > **TIP**: You don't need to select an event to bind fields to profile attributes, such as the recipient's first name.
3. For each text field:
   * Choose a fixed value, or type **@** to select a profile attribute, an event field, or a coupon.
   * Click a text formatting button to shrink the text to fit, wrap it, or truncate it with an ellipsis.
4. For each image field:
   * Select **Use template image**, or, if your dynamic template is bound to an event, select **Event image - Image URL**.
   * Click the crop button to crop the image manually.
   * Select a crop option: **Auto** to let AI choose the best crop, **Face** to crop around detected faces, or one of the directional crops.
5. Review the live preview, which updates with sample values as you bind fields.
6. Click **Save to Klaviyo** to create the Universal Content block, and **Update to Klaviyo** if it's been saved before.

![Personalize templates in Klaviyo](https://cloudinary-res.cloudinary.com/image/upload/bo_1px_solid_grey/f_auto/q_auto/docs/integrations/klaviyo_personalize_templates.png "thumb: w_801,dpr_2, with_code:false, with_url:false, width:801")

> **NOTE**: Every field keeps the template's default value, so the block still renders correctly for recipients without matching personalization data. Reopening the same template later reloads your previous bindings and updates the same Universal Content block instead of creating a duplicate.

### Use personalized content in a campaign or flow

1. Add the saved Universal Content block to a campaign or flow email.
   > **INFO**: If you personalized against an event, send the email from a flow that matches the selected event so the event data is available.
   ![Add the Universal Content block to an email](https://cloudinary-res.cloudinary.com/image/upload/bo_1px_solid_grey/q_auto/f_auto/docs/integrations/klaviyo_add_email_template.png "thumb: w_800,dpr_2, with_code:false, with_url:false, width:800")
2. Preview the email with a profile, or test data, that has matching attributes to check the personalization.
3. Send a test email to verify the personalization renders correctly for different recipients.

> **READING**:
>
> :no-title

> * For the general steps to add and preview a Universal Content block, see [Use Cloudinary content in campaigns and flows](#use_cloudinary_content_in_campaigns_and_flows). 

> * To see where Klaviyo uses a template's Universal Content block, see [Track assets saved to Klaviyo](#track_assets_saved_to_klaviyo).

## Use the Cloudinary Chrome Extension

The [Cloudinary Chrome Extension](chrome_extension_integration) lets you select, save, and personalize Cloudinary assets directly in the Klaviyo email editor, without switching back to the Cloudinary Console.


### Install the extension

1. Install the [Cloudinary Chrome Extension](https://chromewebstore.google.com/detail/cloudinary/pbnliljccdeodopiomgchhnndelaeblg) from the Chrome Web Store, or click **Add to Chrome** on the extension card in the app's **Setup** tab.
2. Confirm the extension is active: once you install and enable it, the app's **Setup** tab shows an **Extension active** badge.

> **NOTE**: For full instructions, see the [Chrome Extension](chrome_extension_integration) documentation.

### Use Cloudinary from the Klaviyo editor

When designing a campaign or flow email in the Klaviyo email editor, look for Cloudinary controls on image blocks, link blocks, and Universal Content HTML blocks.

You can use the Cloudinary Chrome Extension to add or replace images and videos in the following fields.

#### Add a dynamic Cloudinary template

1. Click the **Add content** icon and add a **Basic** image block.
2. Click **Select image**. 
3. Select the **Dynamic image** tab in the dialog box. 
4. Click the Cloudinary Chrome Extension icon to open the Cloudinary asset picker and **Pick a template** to import. ![Template URL field with Chrome Extension](https://cloudinary-res.cloudinary.com/image/upload/bo_1px_solid_grey/q_auto/f_auto/docs/integrations/klaviyo_add_with_chrome.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")
5. Personalize the template (see [Personalize the template with Klaviyo data](#personalize_the_template_with_klaviyo_data)).
6. Click **Save**.

#### Add video content

1. Click the **Add content** icon and add a **Basic** video block.
2. Click the Cloudinary Chrome Extension icon to open the Cloudinary asset picker and select the video you want to import. ![Video URL field with Chrome Extension](https://cloudinary-res.cloudinary.com/image/upload/q_auto/f_auto/bo_1px_solid_grey/docs/integrations/klaviyo_add_video_with_chrome.png "thumb: w_700,dpr_2, with_code:false, with_url:false, width:700")

> **INFO**:
>
> You can see the **Add content** icon when adding image content, as well. However, we don't recommend using the Chrome Extension in this case because Klaviyo uploads a copy to its image library, breaking the Cloudinary link. Any changes you make to the image in Cloudinary aren't reflected in Klaviyo.
> Video URLs are an exception. Because videos open in a browser tab rather than directly in the email, Klaviyo keeps the Cloudinary URL instead of creating a separate copy.

## Troubleshooting

| Issue | Solution |
|---|---|
| Missing permissions notice. This can appear in any tab, most often the **Setup** tab or the personalization editor. | Reconnect the app from the **Setup** tab. |
| No event fields or images available | Some custom metrics aren't supported for personalization. Try a standard event, or bind images from your Cloudinary Media Library instead. |
| Preview looks broken in Klaviyo | Klaviyo doesn't evaluate personalization in its own preview. Use the Cloudinary panel preview, or send a test email to verify rendering. |
| Preview looks broken in Cloudinary when event images are selected | Make sure **Fetched URL** isn't selected in the **Restricted image types** section of the product environment [Security](https://console.cloudinary.com/app/settings/security) page of the Console Settings.
| Extension not detected | Confirm you installed and enabled the extension in Chrome, then reload the Klaviyo editor tab. Check the **Setup** tab for the **Extension active** badge. |
| "Cloudinary DAM session token is missing" error. This appears as a notification or a red banner in the app, most often after clicking **Disconnect Klaviyo** on the **Setup** tab or when performing an action in the personalization editor. | The app receives a Cloudinary session token only when it's launched from Cloudinary, so retrying the action won't help. Close the app, select your assets again in the Media Library, and reopen the app from the asset menu or bulk actions, then repeat the action. No work is lost, and your Klaviyo connection and saved content aren't affected. If the error persists, log out of Cloudinary, log back in, and reopen the app. |

## Cloudinary Professional Services configuration support
The Klaviyo integration is part of Cloudinary's [**Standard**](integrations#standard_integrations) Professional Services integration configuration package. 

If you need assistance setting up this integration and you're on an Enterprise plan with a professional services package in your contract, Cloudinary's professional services can help you set it up as part of your contracted package.

**Learn more: [Cloudinary Professional Services packages](integrations#cloudinary_professional_services_packages)**