Articles on: ReConvert for Shopify

Product Recommendations Widget | Shopify

The product recommendations widget allows you to add multiple recommended products to your store using the ReConvert editor.

Throughout these steps, please ensure you click save regularly to avoid your changes being lost.

Getting Started

Open the ReConvert editor

In the navigation menu, locate the product recommendations widget

Expand or collapse the widget to view its contents

By default, the product recommendations widget contains three widgets:

Divider widget - a simple line that allows for more clarity
Text widget - a simple text box with styling that you can use to add explanation, title to the widget
Products widget - the main part of the product upsell widget will be explored in this article

Selecting products to display

Select the products sub-widget on the left hand side

Select your preferred layout: Grid, Slider or List

Grid

The default layout is Grid. This option spreads out the selected number of products on your customers' page, adhering to the maximum products per row that you choose.

Slider

You can also choose to display your product recommendations in a Slider format. The slider shows up to 4 products on the screen at once, allowing customers to scroll through additional products. The scrolling options, from most to least noticeable, are:

- Pill: A small clickable button for scrolling.
- Shadow: An area indicating to the customer to click for more products.
- None: Only the initial maximum 4 products will be visible, with no scroll option indicated.

List

Alternatively, the List layout creates a straightforward list of your products, respecting the maximum number of products you select.

Next, choose the product(s) to display options:

Shopify Recommendations: This is the default. It is a dynamic product recommendation that uses Shopify's recommendation engine to recommend products that the customer is already interested in. You have the option within this setting of the following:-

Recommendation intent: Choose between related or complementary recommendations
Exclusion tags: Exclude products with specific tags
Hide products that are in the cart: Avoid showing products already in the cart

Most Expensive Product in Cart: Displays the priciest item in the cart - (we have found that this can work the best for customers at certain points of the sales flow, but we would not recommend using this at pre-purchase in the checkout, but it could work well for post-purchase upsells)

Cheapest Product in Cart: Displays the least expensive item in the cart

Third-Party Integrations: Use apps like Wiser, Personalized Recommendations, Rebuy, and Recomatic

Specific Products: Manually select a product from your store

Customizing Product Display Blocks

Image settings

Select the image block

Choose to contain or cover the image

Decide whether to display the main product image or a specific variant image by selecting or deselecting the checkbox at the bottom of this block

Product title

Set the product title (default is the product name). Alternatively, you can also select one alternative product title that will be displayed beneath every product

Product details

Choose a subtitle (variant name, vendor, type, custom text, or none)

Product description

Decide whether to display the product description

Choose between showing the default or an alternative description

Make the description collapsible if necessary (often descriptions can be lengthy, so it may make sense to collapse the description)

Price and Discounts

The placeholders you will see correspond to the following:-
* XXX = Compare-to-Price - this is the most expensive price of the product listed in the Shopify inventory
* YYY = Original Price - this is the price once any non-discount codes have been selected, (i.e. the discounted price that you've manually reduced the compare-to-price to)
* ZZZ = Product Price including Discount - this is the Original Price minus any coupon codes or other discount you've used within ReConvert

Select the product prices to display (at least one)

Display only the final (lowest) price [ZZZ]

Display highest (pre-discounted) and final (lowest) prices [XXX] and [ZZZ]

Display all available prices - (this will include a middle price too if you have one set - [XXX], [YYY], and [ZZZ]

Choose whether to display the 'compare to price' (the highest price in your store for each item) [XXX]

Top Tip:- We recommend either: a) showing all 3 prices; or omitting the Compare-to-Price [XXX] and just leaving the Original Price [YYY] and Product Price including Discount [ZZZ]
If you choose to display all of these prices and one does not exist, Shopify will leave that price as blank

Select the size of each of the selected prices - you can choose small, default or large

Set up discounts:

You have three options when it comes to applying the discount. You can:-

Apply a percentage discount
Apply a fixed monetary value discount per item
Apply a fixed monetary value discount per order

You also have the option to limit the application of discounts to only those orders above a certain value

Save changes after configuring

Shipping options

These options are now available on the Post Purchase pages, Thank You page, and Order Status page.

For shipping options to be amended, you will need to amend your Shopify post-purchase order settings to 'create a new order' instead of 'add to existing order'. By default, the shipping fee in upsells that use 'add to existing order', Shopify will calculate the shipping fee.

The shipping options for the newly-created order include:

Free shipping
Fixed price shipping
Managed by Shopify - you can also set a fallback shipping rate to ensure orders are not processed with free shipping if Shopify encounters an issue generating the shipping total.

Variant picker

The variant picker block allows you to enable or disable the variant picker in the upsell widget.

Decide whether to display the variant picker

Customize the variant picker text

Save changes

Quantity selector

Choose to display or hide the quantity selector

If displaying the quantity selector, you can change quantity selector label text

Set default, minimum, and maximum quantities

If you are choosing to use a minimum quantity that is greater than 1, please note that the default quantity will need to match or exceed the minimum quantity

Order summary

Tick whether to display an order summary

If you choose to display an order summary, you can also amend the text for:- subtotal, discount, taxes and total tax

Buttons

Choose button type (primary, secondary, or plain)

On Checkout page we would recommend using the Secondary button type to keep 'Buy' as the only primary button. On other pages, we recommend using the Primary button type

Customize the button text if needed

Decide whether to require a customer's second-click validation, and if so the text you would like displayed

Save changes before proceeding

While button colors cannot be changed here, they can be changed by following the steps contained within this helpdesk article

Success and Error Banner

Success Banner

Customize the success message and banner type

Choose whether the banner is dismissible

Choose to display or hide the undo button to allow customers to remove the upsold item from their order

Error Banner

Customize the error message and banner type

Dynamic Error Banner Text, if selected, will display the actual error in this this space for the customer (in English). Alternatively, you can type in your own catch-all error text here or in a language other than English if your store's language is not in English

Choose whether the banner is dismissible

It is recommended to show the customer success and error banners to keep the customer informed of the status, even if it is just a one line standard text

Advanced Customizations

You are able to drag and drop product upsell widgets as well as hide / display / delete them

Conclusion

The product recommendation widget in ReConvert is a powerful tool to enhance your store's functionality and increase sales. By following the steps outlined in this guide, you can customize and optimize the widget to suit your needs. For further assistance, feel free to reach out to our support team. Happy upselling!

Well, that’s a wrap!

If this article did not solve your issue, our support team is available for you 24/7, just click the live chat button at the bottom-right corner of this page.

📢 Did you know we have a YouTube channel? Don’t forget to subscribe to the channel to keep in touch with us and our news and updates.
🙏 If you find our app useful, help other merchants find it by leaving us an honest review on the Shopify app store! It means the world to us.
📧 Please let us know if you spot any typos, mistakes or omissions via care@reconvert.com

Updated on: 09/09/2024

Was this article helpful?

Thank you!