Overview

Before the official installation of the product recommendation widgets across scenarios, there are a few configurations and minor adjustments that need to be done for each widget to maximize revenue generation for your store. Let’s discuss these configurations in phases as stated below.

Phase 1: Admin onboarding

To get started with AfterShip's Personalization features, follow the initial onboarding process in the admin panel. This will allow us to recommend the best upsell and cross-sell campaigns tailored to your business goals. Based on your objectives, we will suggest widgets designed to help you achieve success, along with estimated growth and performance rates. These recommendations will guide you in selecting the most effective campaigns to increase revenue and improve customer experience.

Phase 2: Required configuration for offers and widgets

Exclude certain product types from recommending

There are certain product types that we suggest not displaying in the product recommendation results due to their irrelevance to the overall campaign strategy and need to be excluded from each widget’s display settings.

Go to a Widget’s editor > Settings > Exclusions > Exclude specific products > Select products > Search test items > Confirm.

Product Type	Meaning
Test items	Search for Test products in your store and exclude them in the admin.
AfterShip Protection items (shipping insurance)	Search for Protection in your store and exclude them in the admin. The exclusion process is the same as mentioned above.
Gift cards	Search for Gift cards in your store and exclude them in the admin. The exclusion process is the same as mentioned above.
Free items	Go to your store’s All products page and sort the products from Price: Lowest to Highest. Identify all the free products (if any) and exclude them from the product recommendations in the admin.

Check out this tutorial for detailed instructions on excluding certain product types from recommendations.

Phase 3: Smart solutions configuration

AfterShip Personalization's Smart solutions offer a comprehensive set of tools and features that are designed to personalize and optimize the entire customer journey. These solutions go beyond just product recommendations; they focus on driving conversions, increasing average order value (AOV), and improving customer engagement at various touchpoints (e.g., cart, checkout, post-purchase).

1. Set up smart cart

What to do?	Where to do?	How to do it?
Access smart cart	Navigate to Smart solutions > Cart in AfterShip Personalization admin.	Click Create Cart and select a pre-built cart theme (General, Fashion, Beauty) and then click Create to access the Smart Cart editor.
Set up cart sections	Go to the AfterShip Personalization Smart solutions > Cart editor.	Customize title, padding, layout, font style, size, and weight. Add upsell offers (e.g., Subscription Upsell or Upsell Items) to increase AOV. Use AI algorithms and merchandising rules to show personalized product suggestions.
	Configure cart styles	Customize padding, border radius, and background color for the fly-out cart. Adjust CTA button text, style, and colors. Set up Tiered Progress Bar to track rewards like free shipping or gifts.
	Set checkout and advanced settings	Input cart subtotal text and checkout CTA colors. Set rules for upsells, including maximum number of items, discounts, and display options (e.g., mobile vs. desktop). Add custom icons and preselect product variants.
	Enable smart cart	Set the Status to Enabled to activate the smart cart and select Shopify themes where you want to implement the smart cart. Use Custom CSS to hide the native cart drawer if necessary.

Check out this tutorial for detailed instructions on setting up a smart cart for your Shopify store.

2. Checkout page configuration

What to do?	Where to do?	How to do it?
AfterShip Personalization checkout page settings	Go to the AfterShip Personalization Smart solutions > Checkout page editor.	Click "Edit" to enter the checkout page product recommendation widget editor
	Exclude items	Exclude items that are found in the Phase 1; Step 1. Learn more
	Adjust image ratio	Under the Display tab, find the Image aspect ratio option to adjust the image aspect ratio to better fit the product images on the widget
	Adjust discount settings	Under the Settings tab, move to the Product recommendations section. Select a predefined or set up a new recommendation strategy for the widget by clicking Edit. Move to the Offer promotion > Discount section and adjust it to meet your needs. Learn more
	Enable the offer	Under the Settings tab, set the Status to Enabled to activate the widget on the checkout page
Widget installation on Shopify admin (Guide with visuals is available on the Personalization admin)	Copy the offer ID	In the checkout editor, scroll down to the Installation section under Settings tab and click “Copy ID” in the top right corner.
	Go to the Shopify checkout editor	In the store's admin, find the Settings > Checkout. Duplicate a checkout profile, and click customize to enter the checkout editor
	Add the AfterShip Personalization app to Shopify checkout editor	Add app block Select AfterShip smart offer and enter the ID you copied in Step > Copy the offer ID. Select Include app in Shop Pay
	Adjust the AfterShip Personalization widget location	Drag and drop the widget to adjust the app location and click Save
		Recommended location: Three-page checkout: Move the checkout recommendations under Order Summary One-page checkout: Move the checkout recommendations above the Pay now button

Check out this tutorial for detailed instructions on setting up a product recommendations widget on your checkout page.

3. Post-purchase page configuration

What to do?	Where to do?	How to do it?
AfterShip Personalization post-purchase page settings	Go to the AfterShip Personalization Smart solutions > Post-purchase page editor	Click Edit to enter the post-purchase page product recommendation widget editor
	Exclude items	Exclude items that are found in the Phase 1;Step 1. Learn more
	Adjust discount settings	Under the Settings tab, move to the Product recommendations section. Select a predefined or set up a new recommendation strategy for the widget by clicking Edit. Move to the Offer promotion > Discount section and adjust it to meet your needs. Learn more
	Enable the offer	Under the Settings tab, set the Status to Enabled to activate the widget on the checkout page.
Widget installation on Shopify admin (Guide with visuals is available on the Personalization admin)	Go to Shopify settings	Select AfterShip Personalization under Post-purchase page in the Shopify checkout settings

Check out this tutorial for detailed instructions on setting up a product recommendations widget on your post-purchase page.

Phase 4: Cross-sell widgets configuration

AfterShip Personalization enables you to set up personalized product recommendation widgets for different pre and post-purchase scenarios including, the Product page, Home page, Cart page, Cart popup, Checkout page (Shopify plus), Thank you page, and Tracking page (AfterShip Tracking integration).

What to do?	Where to do?	How to do it?
AfterShip Personalization smart upsell widgets settings	Navigate to the AfterShip Personalization cross-sell widget editor	Click Cross-sell widgets and select the scenario(s) where you want to add the upsell widget
	Exclude items	Exclude items that are found in the Phase 1; Step 1. Learn more
	Adjust discount settings	Under the Settings tab, move to the Product recommendations section. Select a predefined or set up a new recommendation strategy for the widget by clicking Edit. Move to the Offer promotion > Discount section and adjust it to meet your needs. Learn more
	Enable the widget	Under the Settings tab, set the Status to Enabled to activate the widget on the selected scenario
Widget installation on Shopify admin (Guide with visuals is available on the Personalization admin)	Go to the Shopify theme editor and install the app	Cart popup: Only needs to be enabled in the AfterShip Personalization admin Cart drawer: Contact us for code-related onboarding assistance Other widgets: Add the widget of the AfterShip Personalization app to the scenario you want in the Shopify theme editor. Paste the Widget ID found in the Personalization editor under Settings to the Shopify theme editor under Apps > AfterShip Smart Offer Adjust the widget location and click Save