🌟 Forge one-of-a-kind customer interactions using Rebuy's data-driven Rules Engine! 🤖🔍 Utilize logic-based rules, both present and past customer interactions, product and website data, or tap into Rebuy's AI Endpoints to configure the most individualized offers during the Checkout process. 🛒💫

Shopify made an announcement on February 13, 2023, stating their decision to discontinue the usage of the checkout.liquid file and transition all customers to checkout extensions. The Checkout Extensions Widget aligns with Shopify's future direction and this guide will detail the process of creating and integrating the Checkout Extensions Widget.

Before we get started. Make sure you understand all the capabilities of the Checkout Extensions widgets!

Dive into this effortless and exciting step-by-step journey to acquire your very first checkout extensions! 🚀✨

To get started, the first thing you need to do is set up a Checkout Extensions widget in Rebuy. You can achieve this by navigating to Rebuy, going to the checkout extensions section, and selecting the "get started" option.

Afterwards, you have the option to select from three different types of product offers for the checkout extensions. You can always modify this choice later, so go ahead and pick the one that best suits your requirements at this stage. Once you've made your selection for the widget type, simply click on one of the available options, give your widget a name, and then click on "create widget."

By default, a widget will be built with the recommended AI pre-configured in the data source, so you will see a preview of those recommendations.

Once your widget is created, you have the option to either install it immediately to the checkout for instant results or make adjustments to your widget settings and data source rules. If you decide to proceed with installing the widget into your Shopify checkout, you can follow these steps at your convenience.

When you're ready to install or preview the complete version, be sure to copy your widget ID (as it will be necessary for the upcoming steps). To access your Shopify checkout editor, you can conveniently do so by clicking the "go to Shopify" button in the widget settings, or click "preview" in the upper right corner, which will automatically direct you to the checkout editor.

After accessing your checkout editor, you have the option to select the "add app block" button. From there, pick the "Rebuy Smart Component" app block, input the widget ID from your widget page, opt for "NO" when it comes to hiding this extension setting, and then proceed to click on the save button.

Congratulations! You have effectively installed your checkout extension widget. There's one more step to complete, which involves customizing the widget's placement. Return to the main checkout profile settings page, and within that page, simply click and drag the app block to your preferred location. Once you've found the ideal spot, proceed to click the "save" button.

If you are looking to customize your widget and data sources, head down to those sections for more instructions!

There are various settings available for modification within the Rebuy checkout extensions widget. However, there are some settings that we cannot control such as adding a logo, header, background, accent colors, button colors, error colors, etc. In order to modify those types of settings you will need to head to the Shopify checkout editor settings.

In the general language section, you can modify the widget super title, title, and description to say whatever meets your specific needs. The preview will update real time to see the changes you are making.

In the call to action settings, you can update the variant language and the add to cart state options. They will be pre-filled to basic placeholders. The preview will update real time to see the changes you are making.

Within the "main product" section, you have the flexibility to determine the number of products you'd like to showcase on the checkout extension widget. Please note that the widget previewer is restricted to displaying a maximum of two products. Additionally, you can specify the source of your images, whether it's at the variant or product level. Lastly, you have the option to decide whether you want to include product descriptions and add a quantity input selector to the widget.

Within the "variants" section, you have the ability to define the type of selector you'd like to use, which can be either a select dropdown or radio buttons. This selector enables customers to choose from the available variants. You also have the option to modify when these variant options are displayed, which is set as the default "if there is a variant, then show it." However, you can change this to "never show" or "always show" as per your preference. Additionally, you can opt to display the variant titles and choose to hide any out-of-stock variants from being visible in the selector.

🔒 You can choose to activate or deactivate hidden product properties. These concealed product attributes serve the purpose of tracking performance and facilitating dynamic discounts. Be aware that if you disable them, you'll forfeit valuable performance and engagement metrics! They are enabled by default.

Once you have the initial widget built, you can modify your data source rules to meet your needs. To edit your data source, click on the "EDIT" button next to the "DATA SOURCE." Make the necessary adjustment to your rules and click "SAVE." The default rule on the checkout extensions widget will be to return one of the Rebuy endpoints.

The product preview section in the widget previewer serves as a tool to confirm how the data source rules will be applied to the widget. Please note that this previewer is restricted to displaying only two products and does not reflect the exact style you'll observe in your checkout. To obtain a comprehensive preview of your widget, you'll need to install it into a checkout.

Want to learn more about Rebuy features? Book a demo with our team today!