Available on the Awesome plan

With this Klaviyo integration, you can add a text block in your Klaviyo emails and display the user-generated content (UGC) like photos and videos that you are tagged on Instagram. Adding social proof can help you promote your products better.

See other integrations with Klaviyo:

  1. Send review requests with Klaviyo
  2. Send follow-up emails to reviewers with Klaviyo 
  3. Add Judge.me featured reviews (selected for the carousel) in Klaviyo emails 
  4. Add Judge.me product review stars and average ratings to Klaviyo emails

How the integration works

  • This feature depends on the Judge.me UGC media grid, so you need to connect your Instagram account with Judge.me, enable the UGC media grid and publish some photos in the UGC dashboard.
  • After connecting Judge.me and Klaviyo using API key, you can create a UGC Widget Feed in Judge.me, then copy the feed URL and add to Klaviyo Wed Feeds settings.
  • Then, you can add a text block of codes to retrieve the photos from your UGC media grid and display them on your Klaviyo emails.
  • The codes will run and randomly picked up to six photos that you published in your Judge.me UGC media grid.

How to set up the integration

Step 1: Add Klaviyo API key

For Klaviyo integration to work, you need to add Klaviyo API Key to Judge.me settings. If you have already created the API key for Judge.me, you can skip this step.

  • In Klaviyo, go to Settings > API Keys.
  • Click Create Private API Key and copy it.

  • In Judge.me, go to Settings > Integrations > Admin Backend > Email Marketing Integration > Klaviyo.
  • Paste your Klaviyo API Key and click Check.

This feature will enable you to show stars and aggregate product ratings on your emails. To enable this feature:

Step 2: Enable the UGC Feed in Judge.me

  • In Klaviyo feeds section, toggle the bar to enable the UGC feed.
  • Click Save Settings
  • Click Copy to copy the feed URL

Step 3: Add the feed URL to Klaviyo

  • Go to Klaviyo Settings > Web Feed, then click Add Web Feed

  • Enter the feed details, then click Add Data Feed.
    • Feed Name: JudgemeUGCwidgetfeed
    • Feed URL: the feed URL you copied from Judge.me
    • Request Method: GET
    • Content Type: JSON

Note: You can use any name for the feed, just make sure it's up to 64 characters long, consists of only letters, numbers and underscores. You will need to use exactly this name when adding the liquid code to the email templates in the next steps.

Step 4: Display user-generated content from the feed in Klaviyo emails

  • From Klaviyo Flows, choose the email template you want, then click on it to Create Flow.

  • Click Edit Email to open the email editor

  • To add the user-generated content, follow these steps:
    • Add a text block

  • Click on the </> icon (source code), then paste the codes below

<table border="0" cellpadding="0" cellspacing="0" style="table-layout:fixed; width:100%; border:none; max-height: 400px; height: 100%" width="100%">
    {% for thumbnail in feeds.JudgemeUGCwidgetfeed.ugc_media_grid|slice:'0:6' %}
      {% if forloop.counter0 == 0 or forloop.counter0 == 3 %}<tr style="height: 50%;">{% endif %}
          <td style="width:auto; height: 100%; overflow:hidden; vertical-align:middle; padding:5px;">
            <table border="0" cellpadding="0" cellspacing="0" width="100%" style="height:100%;">
                  <td align="center" style="word-break:break-word;">
                    <table border="0" cellpadding="0" cellspacing="0" style="height:100%; border-collapse:collapse; border-spacing:0px;">
                          <td style="height:100%; border:0; padding:0;" valign="middle">
                            <a href="{{ thumbnail.products_urls|first }}" target="_blank" style="height:100%;">
                              <img alt="Post {{ forloop.counter }}" src="{{ thumbnail.thumbnail_url }}" style="display:block; outline:none; height:auto; width:100%;" title="Post {{ forloop.counter }}">
      {% if forloop.counter0 == 2 or forloop.counter0 == 5 %}</tr>{% endif %}
    {% endfor %}
  • Click on the </> icon again for the changes to take effect
  • Click Preview and Test to preview your email with a real product.

  • You can also send a test to your own email.

  • Here is how your email will look like in reality

Step 5: Save your email

After you are done, click Save and Exit. Then continue to customize your email flow and activate it when you are ready!