All Collections
Widgets
Cart Page
How To Create A Cart Page Widget
How To Create A Cart Page Widget

In this guide, we will learn how to create a widget on the cart page.

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

The Cart Page is a popular place to offer additional recommendations or give the customer more opportunities for "Product Discovery". This article will show you how to install a carousel of products to the bottom of the Cart Page just like below, however there are several additional places and opportunities to add more!

Before you move forward with creating this widget we highly recommend you complete our getting started guide if you haven't already

Creating our Widget


To get started please navigate to Widgets in your Rebuy Admin dashboard.

From here you will see all the most popular locations to add a widget to your online store and enhance customer experience. Below that is where you will see a list of all your other widgets you have.

For the Cart Page widget we will be clicking on the Cart tile to get started.

If you haven't already created some cart page widgets, you'll see a menu with some prebuilt configurations, select "Create New" on the "Recommended (Full Page)" card.

Otherwise, select "New Widget" on the top right-hand side of your screen to see the list of pre-configured options. You are more than welcome to choose the others as well! You have full control over the recommendations.

The quick start to this widget will start with 8 items to show and be placed at the bottom of the page after installation.

Installing the widget


It is highly recommended that you test all your widgets in preview mode before setting them live to your store. We have a wonderful guide on how to use preview mode if you are unfamiliar with using it.

If you are on a Shopify 2.0 theme you will need to install this with an App Block. You can find instructions on how to do that here. Otherwise you can manually install the widget following the instructions outlined in our manual widget installation guide.

Configuring your Data Source


The Data Source is set to return AI recommendations by default. There are many more ways you can set up your Data Source to be custom tailored to you. For getting started with making your own custom Data Source we recommend getting started with our Data Sources 101 .

Customizing your widget


Now you are ready to start customizing your widget. From here you'll just need to determine what you want the language of the widget to say, where the widget is placed, and what the offers(s) will be if you don't want to use the AI. To learn more about creating recommendation 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!


โ€‹

Did this answer your question?