Articles on: Thank you page optimization

Product upsell widget - v3.0

Product upsell is one of the most powerful widgets in ReConvert - allowing you to display a specific product to the customer, possibly with a special offer, on the thank you page.



Product upsell widget supports our "2 step checkout", which means that the customer will be redirected directly to the payment page in the checkout process, and will skip the cart, customer information and shipping method pages, but will have to enter CC info again.




How to add Product upsell widget



First of all you need to open a template where you want to add the widget. Move to your Thank you pages tab inside of the app and click customize button next to the desired template or you can open it from the app dashboard as well, just scroll it a bit.



Then you need to choose on what side you want to see the widget. Left area - left side, Right area - right side. When you selected a side you need to click Add section button, on click it will open you a list of all our widgets where you need to select Product upsell widget and click Add button.



Product upsell widget consist of five main elements, each of those elements have their own settings and options. The main elements are:
Title
Product options
Discount
Timer
Buttons

1️⃣Title



1. Offer name



After adding the Product upsell widget in the page builder, first we’ll have to give this offer a name. This is an internal name, your customers will not see it.

2. Widget title



Here you can give your widget a specific name.

3. Display offer title



You can align the title position as you need:
Above the entire widget
Below the entire widget

4. Background of the title



Here you can select color of the background by using color picker or entering RGBA code.



2️⃣Product options



1. Select product



After giving a name to the offer we’ll have to select which product to display. There are 8 options available:
Most expensive product purchased - will dynamically display the most expensive product purchased for each order
Wiser recommendations - will dynamically display personalized product recommendations using Wiser proprietary algorithm
Personalized Recommendations - will dynamically display personalized product recommendations using Personalized Recommendations proprietary algorithm
Rebuy intelligent cross sell - will dynamically display personalized product recommendations using Rebuy proprietary algorithm
Recomatic recommendations - will dynamically display personalized product recommendations using Recomatic proprietary algorithm
Shopify product recommendation - will dynamically display related product by Shopify
Cheapest product purchased - will dynamically display the cheapest product purchased for each order
Specific product - you can choose specific product to display



⚠️ WARNING: Wiser recommendations, Personalized Recommendations, Rebuy Intelligent cross sell and Recomatic recommendation will only work if you have these apps installed in your store

📝NOTE: For Wiser recommendations, Personalized Recommendations, Rebuy Intelligent cross sell, Recomatic recommendation, Shopify recommendation available Loader text option. Product recommendations might take time to load. Use this text box to display a message while loading.

When selecting one of the 8 available options you can add "exclusion tags" - select tags that in case the product is tagged with, it will not be displayed. In case the product is tagged with an exclusion tag you can choose to either hide the featured product or to display an alternative product, if you choose to display an alternative product, you can select it manually.



Specific product: this option allows you to choose a specific product from your store and display it on the thank you page. When selecting this option, a new button will show up enabling you to select the desired product.

You can also choose what happens in case the selected product was already purchased. You can choose to either hide the product, display it anyway, or display an alternative product.

In case you choose to display an alternative product, another box will open in order for you to select the alternative product.



📝NOTE: If you selected to display alternative product but didn't choose which one exactly, widget will not be displayed if specific product was in original order

2. Layout



Here we will select the size of the widget:

📐Large size



📐Medium size



📐Small size



3. Product title



After selecting what product to display, the next stage is to configure the product title settings.

You can either leave the text box empty, in this case the default product title will be displayed, or you can use the free text box to use a custom title.

Below the product title text box, a drop-down will allow you to choose whether to display the product title above or below the product image.

📝NOTE: Title position can be changed only in Large size widget.



4. Product description



Check “Display product description” checkbox if you’d like the product description to be displayed, and uncheck it if you’d like it to be hidden (by default, product description is hidden).

In case you choose to display the product description, another free text box will appear. Keep it empty if you’d like to use the default product description (not recommended if you have long product descriptions), if you’d like to create a custom product description, write it down in the free text box.



5. Main and Secondary images



In main product section you can select one of 2 option:
Display main product image
Display custom product image



You can select one of 3 options for the secondary images:
The first option is to hide secondary images, in this case only the main image will be displayed (when selecting a variant with a different image, the variant image will still be displayed).
The second option is to display the secondary images below the main image. 3 images will be shown at a time, if there are more than 3 images, the customer will be able to scroll between images.
The third option is to enable a slideshow, only the main image will be shown, but customers will be able to scroll left and right to see other product images.



📝NOTE: Additional images available only in Large size widget

6. Product options



Display quantity picker - if checked, customers will be able to purchase multiple units of the featured product. When enabling the quantity option a small window will open, enabling you to change the text for the quantity picker title.

📝NOTE: Quantity picker is unavailable in Small size widget

Enable variant selection - if checked, the customer will be able to choose variants from a drop down menu for each variant type (color/size etc.).



If unchecked, a drop down menu will open with all the product variants, and you can select which product variant you’d like to display to the customer. The variant you select will be included in the product title so that the customer will know what variant he’s purchasing.

Example:

Product title: Apple
Available Color: Red / Green
Available Sizes: S / M / L

Let’s say you chose to disable variant selection and let the customers only purchase "Seaside" variant because you have too many in stock.
The title that will be displayed to the customer will be: “Seaside”



Display / hide vendor - here you can add the option to display or hide the product vendor



📝NOTE: Display / hide vendor option available only in Large size widget.

Star reviews - here you can add the star review integration, here a tutorial on how to set this How to display product reviews on your thank you page



⚠️ WARNING: In order to display review stars, you must have one of the applications installed: Judge.me, Loox, Rivyo, Stamped.io or Ali Reviews

3️⃣Discount



1. Discount settings


You can choose to attach a discount to the featured product to make it more attractive to the customer, the discounts will automatically apply to the new order.

You can use a pre-made coupon you’ve created through your Shopify admin discounts page (Note: if you use a pre-made discount the customer will be redirected to the customer information page and not to the payment page).



You can also use an automatic discount that ReConvert will generate for you, if you use an automatic discount the customer will be redirected directly to the payment page on the checkout process (Skip the cart, customer information and shipping method).

When selecting an automatic discount, you’ll have to choose one of 4 options:

Free shipping
Percentage discount - will take X% off the new order, when selecting this option you’ll have to define the amount of percentage to offer the customer. (you can also apply free shipping in case you'd like to add that to the featured product offer)
Fixed amount per unit - will take $X off the new order for every unit he orders. When selecting this option you’ll have to define the discount amount to offer the customer. In this case if the customer purchase 2 units of the featured product, the customer will get twice the discount. (you can also apply free shipping in case you'd like to add that to the featured product offer)
Fixed amount per order - will take $X off the new order, no matter how many items the customer purchase. When selecting this option you’ll have to define the amount of percentage to offer the customer. In this case if the customer purchase 2 units of the featured product, the discount will be applied once for the entire order. (you can also apply free shipping in case you'd like to add that to the featured product offer)

Here you can also set such settings:
Discount type
Discount value
The price when the discount must be applied
Discount prefix
Apply or not a free shipping to a new order



📝NOTE: "Also apply free shipping" option will be available only if you selected to create new order in Settings --> General settings --> Order settings

2. Price settings


The prices options are kind of tricky. We've added the option to display any combination of 3 different options, for each of them you can control the price color and size. By default, only the lowest price won't have strike-through:

Product compare price - will display the original compare to price from your Shopify store.
Product price - will display the original product price from your Shopify store.
Product price including discount - will display the product price after applying the discount you set up in the previous section (only apply for automatic discounts).

💡 TIP: Example: you chose a discount of 20% and the product costs $100 before the discount. On the thank you page the customer will see a price of $80.



4️⃣Timer



1. Timer settings



By default, when you added the Product Upsell widget, the timer is already enabled, and by default it is set to 5 minutes.
If you do not need a timer, you can turn it off at any time, just uncheck "Add timer".



2. Text area



You can write whatever you want here. For example: the offer will expire or the time will expire.



3. Display timer



There are 3 options:
On every impression - the timer will load every time the thank you page will load (can be multiple times per order)
Once per order - this means that if the client, while on the thank you page, accidentally reloads it, the timer will continue to count down where it left off. The same will happen if the client left the thanks page before the timer finished counting down, but then returned again, then the timer will continue counting from where it left off. This will happen every time a customer order is placed.
Once per customer - this is the same as once per order with the only difference that after the time has expired, the timer will no longer appear for the client.



4. Duration



Choose for how long your timer will expire. There are 4 options: days, hours, minutes and seconds.

📝NOTE: Minutes & seconds will always be displayed, if days and hours are empty they won't be displayed, if only days is empty, days won't be displayed.



5. Timer design & position



You are offered a choice of 4 different styles, each style has its own settings and the ability to display text in a specific area.
Here are these 4 styles:



Timer positions and Text positions

📝NOTE: Text position cannot be changed in 4th style, due to timer style. In the 4th style, only the position of the timer itself can be selected.



6. Text



Here you can write, shorten or translate into another language days, hours, minutes and seconds.

📝NOTE: If you keep all text fields empty we'll display a ":" sign between the days, hours, minutes and seconds



7. Expiry settings



You have to decide what to do when your offer expires. You are offered several options:
Do nothing - nothing will happen, the text you wrote will appear, and the timer will simply disappear, but the product will still be available with a discount.
Remove discount - the discount will simply be removed and the product will be displayed at the regular price.
Hide widget - after the time expires, the widget will just disappear.
Grey out of widget - the widget will become slightly transparent and cannot be clicked on.

📝NOTE: There is also a field for a message that your customers will see when the time expires. And the Preview Live / Expired Offer button, depending on what you click.



5️⃣Buttons



Button settings



You can easily control the buy button text, text color, and background color.



That's it, you're ready to go with a beautiful and powerful product upsell on your thank you page. Just don't forget to hit save

🏁Well, that’s a wrap!


If this article did not solve your issue, our support is available for you 24/7, just hit the live chat button at the 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 🙏

Updated on: 23/09/2022

Was this article helpful?

Share your feedback

Cancel

Thank you!