Skip to main content
All CollectionsGetting Started Share your Tolstoy
Abandonment Flows Offsite Widget in Klaviyo
Abandonment Flows Offsite Widget in Klaviyo

This guide outlines how to create, configure, and implement an Abandonment Flows off-site widget in Klaviyo

Niezl avatar
Written by Niezl
Updated over a week ago

The Abandonment Flows off-site widget is a powerful new feature that allows you to dynamically populate videos based on product IDs featured in your email flows.

Getting Started

Select "Abandonment Flows" to begin creating your widget.

Note: This feature is currently only available for Klaviyo users and does not support other email tools.

Selecting Videos

  1. By default, the Product Tagged Playlist will be selected.

  2. You'll see different groupings of videos based on product tags.

GIF Configuration

Link to:

  • For Abandonment Flows, videos only redirect to Product pages dynamicly, opening the video on that product page.

UTM Parameters:

  • Add UTM parameters for tracking and analytics tools like Google Analytics.

  • This will help track traffic coming from users who click the GIF to your store.

  • Important: After adding UTM parameters, you must re-copy and paste the widget code.

Fallback Playlist:

  • Select a fallback playlist to populate the GIF if there are fewer than three videos tagged for a product.

  • Example: If you have a 100-product catalog but only 70 have videos, the fallback playlist will be used for the remaining 30 products. If a product has 2 videos, the fallback will only be used for the missing 3rd video.

  • Note: Videos from the fallback playlist will redirect to the product page but will not play on the page itself.

Video Feed Behavior

To change whether you want the video to open in full screen or picture-in-picture mode:

  • Go to "Video Feed" section

  • Toggle the "View Feed in full screen" option as desired

Publishing Your Widget

In Tolstoy

  1. Copy the provided code snippet.

  2. There's no need to select your email tool, as it's only available for Klaviyo.

In Klaviyo

  1. Go to an email flow in Klaviyo.

  2. Edit one of the templates.

  3. Add the HTML code using either:

    • The source code for a block

    • Native HTML code implementation

Edit Template
Paste Code

Previewing Your Widget

  1. To preview the GIF, click on "Preview and Test" in Klaviyo.

  2. Since the widget dynamically populates videos, you can swipe through events to see different implementations for each product.

Preview GIF
Preview GIF

Troubleshooting

If you don't see the GIF even though there is a fallback playlist set up, please contact support for assistance.

Did this answer your question?