Skip to main content

1. Enable the Klaviyo Integration

See here for more information on how to enable the Frate Returns Klaviyo integration. Once the Frate Returns integration is enabled within Klaviyo, you can build a flow just like you normally would.

2. Create a New Flow

  1. Go to Flows in Klaviyo.
  2. Click Create Flow.
  3. Choose Create from Scratch.
  4. Name the flow whatever you’d like.

3. Choose the Route Returns Trigger

When selecting a trigger, you will see events sent from Frate Returns by going to Your Metrics -> API.
The trigger will only appear if it has been triggered at least once since the Klaviyo integration was enabled. If you do not see the trigger:
  • You may need to trigger the event first by placing a test order, or
  • The Route team can trigger example event data if needed.
Once you select the trigger you want, save it.

4. Add the Email Action

After saving the trigger:
  1. Click Add Action
  2. Select Email
  3. Choose Custom HTML Email
Using custom HTML allows you to fully control the formatting of the email.

5. Pull Event Data Into Your Email

When you click Preview Email, Klaviyo will show the recent event data that triggered the flow. From there you can pull specific values to include in your email. For example, if you want an item image, click the Image URL field and Klaviyo will generate the variable you can insert into your email.

6. Preview the Email

While building your email, click Preview Now to see how the email will appear using the sample event data. This lets you confirm that:
  • Images render correctly
  • Variables populate correctly
  • Formatting looks right

Example: “Ship Back Request” Email

Here is an example of how a “Ship Back Request” email might be formatted:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
  <head>
    <title></title>
    <style type="text/css">
      body {
        background: #eee;
        font-family: 'Helvetica Neue', Helvetica, Arial, san-serif;
      }
      #outer {
        width: 95%;
        min-width: 320px;
        max-width: 600px;
        margin: 20px auto;
        background: #f9f9f9;
        position: relative;
      }
      #inner {
        padding: 20px;
        font-size: 14px;
        line-height: 19px;
      }
      p {
        margin: 0 0 9px;
      }
    </style>
  </head>
  <body>
    <h1 style="text-align:center;font-size:20px;line-height:1.4;font-weight:600;margin:24px 0;">
      Your return is ready to be shipped back!
    </h1>
    <p style="font-size:16px;line-height:1.5;margin:16px 0;">
      Hi {{ name }}, Your return request has been reviewed.
    </p>
    <p style="font-size:16px;line-height:1.5;margin:16px 0;">
      Please ship the item(s) back by:
      <b>{{ event.ship_back_deadline|format_date_string|date:'F d, o' }}</b>
    </p>
    <td style="font-family: Arial, sans-serif; color:#111;">
      <hr style="border:0;border-top:1px solid #e5e7eb;margin:24px 0;"/>
      <h1 style="text-align:center;font-size:20px;line-height:1.4;font-weight:600;margin:0 0 24px;">
        Items you'll be shipping back
      </h1>
      <!-- Returned items in this shipment -->
      {% for shipment in event.shipments %}
      <h2 style="font-size:18px;line-height:1.2;margin:0 0 12px;font-weight:600;">
        Items you'll be shipping back
      </h2>
      {% for item in shipment.items %}
      <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="margin-bottom:16px;" width="100%">
        <tr>
          <td style="width:120px;padding-right:24px;vertical-align:top;">
            <img src="{{ item.image_url|default:'' }}" style="display:block;border-radius:4px;border:0;outline:none;" width="100"/>
          </td>
          <td style="vertical-align:top;">
            <h2 style="font-size:18px;line-height:1.2;margin:0 0 8px;font-weight:400;">
              {{ item.title|default:'' }}
            </h2>
            <p style="font-size:14px;line-height:1.5;margin:0 0 8px;color:#27272a;font-style:italic;">
              {{ item.description|default:'' }}
            </p>
          </td>
        </tr>
      </table>
      {% endfor %}
      <p style="text-align:center;margin:16px 0 8px;">
        <a href="{{ shipment.label_url|default:'' }}" style="color:#4f67db;text-decoration:underline;font-weight:500;" target="_blank">
          Print shipping label
        </a>
      </p>
      <div style="text-align:center;margin:0 0 16px;">
        <img alt="QR code for shipping label" src="{{ shipment.qr_code_url|default:'' }}" style="display:block;width:100%;max-width:240px;margin:0 auto 16px;border:0;outline:none;"/>
      </div>
      <h2 style="font-size:16px;line-height:1.5;font-weight:600;margin:0 0 8px;">
        {{ shipment.instructions_title|default:'' }}
      </h2>
      <p style="font-size:14px;line-height:1.43;margin:0 0 24px;">
        Tracking code:
        <b>{{ shipment.tracking_code|default:'' }}</b>
      </p>
      <hr style="border:0;border-top:1px solid #e5e7eb;margin:24px 0;"/>
      {% endfor %}
    </td>
  </body>
</html>