Skip to main content
All CollectionsWidgetsProduct Page
How To Create A Product Cross Sell Pop Up Widget
How To Create A Product Cross Sell Pop Up Widget

This article will help you create a product page cross-sell popup!

Strauss Van Wagenen avatar
Written by Strauss Van Wagenen
Updated over a week ago

A Product Cross-sell Popup Widget is a great way to display offers to customers on add to cart, which asks if they would like to add more complementing items! A cross-sell is NOT an upsell (switching to a higher value alternative) but just asks them to add additional items For more insight on upselling vs cross-selling, check out this article.

Creating our Widget:

From the Rebuy admin, navigate to the Online Store tab. From here you can see the most popular locations you can upgrade your online store as well as a list of all created widgets. Select "Product Page".

If you haven't already created some product page widgets, you'll see a menu with some prebuilt configurations, select "Create New" on the "Add to Cart Cross-sell (Pop-up)" card. Otherwise, select "New Widget" on the top right-hand side of your screen to see the list of pre-configured options.

This quick start to this widget will start with 8 items to show and trigger when the customer clicks add to cart. The trigger sometimes varies from theme to theme so play with the widget settings! The Data Source is set to return AI recommendations. From here you'll just need to determine what you want the language of the widget to say, and what the offers(s) will be if you don't want to use the AI. To learn more about creating product page rules for your new widget, check out this article. If you need help placing it after creation, use some dynamic placement! More on widget settings.

  • If you would like to add more styling to the widget that is not available in the widget editor check out this article.

Now that you've created your widget and set up your rules in the Data Source, go test it out! There is a "Live Mode" toggle in the widget settings, just make sure it's off, then you're ready to install and test, if it's working as expected, enable Live Mode and you're set!

Pop Up Installation Help

Some themes are a bit tricky to work with and the popup may not work as expected. We've found that adding the following code snippet before the closing body tag in the theme.liquid file may help! Be sure to replace the "XXXXX" with the correct widget ID, and remove the initial Rebuy div from the product.liquid file. Click save!

{% if product %} <div data-rebuy-id="XXXXX" data-rebuy-shopify-product-ids="{{ product.id }}"></div> {% endif %}


โ€‹

Did this answer your question?