Enhance your online store with the power of intelligent product recommendations! This step-by-step guide explores various methods for setting up Frequently Bought Together Recommendations for Shopify product page with SF Product Recommendations. Learn how to personalize recommendations, track performance, and gain valuable customer insights while unlocking a more profitable and user-friendly shopping experience.
Step 1: Select a page to display FBT recommendations
- Install the SF Product Recommendations.
- Navigate to Apps > SF Product Recommendations.
- Click on Create new recommendation.
- Select the Product page to display the Upsell recommendations. Frequently Bought Together recommendations are also available on Cart pages.
- Under the recommendation type, choose Frequently Bought Together .
The application enables you to display recommendations on product pages and cart pages.
- FBT for Product page –Recommendations will be generated based on the product that the customer is currently viewing.
- FBT for Cart page – Recommendations will be generated based on the last product added to the cart.
Step 2: Set up FBT recommendation methods
There are a total of 4 methods to display frequently bought together recommendations.
- Manual recommendations (Priority 1): Set custom FBT recommendations for any product from the store of your choice.
- Automatic recommendations (Priority 2)- FBT recommendations based on each product’s purchase history and other parameters.
- Global recommendation (Priority 3)- FBT recommendations displayed for all products in the store.
- Random recommendations (Priority 4) – FBT recommendations display random products from the same category, collection, or type. This method is used as a fallback if there aren’t enough products available from other methods.
If only one of these methods is active at a time, the recommendations will be displayed as mentioned. However, if multiple recommendation methods are enabled or configured simultaneously, the recommendations will be displayed based on priority.
Example:
The maximum number of products that can be displayed inside the FBT recommendations is 5 (this number is adjustable based on visual preferences).
Scenario 1:
- All four recommendation methods are enabled.
- Two manual recommendations are configured for Product A.
- The automatic recommendation has identified only two eligible products for FBT.
- Three products are configured as global recommendations for promotional purposes.
- Random recommendation is set to display random products from the same collection.
In this scenario, in the FBT recommendation widget for the product page of Product A, the following format will be followed:
- The two products from manual recommendations first, as they have the highest priority.
- Then, the two products identified by automatic recommendation will follow.
- Next, although there are three products in the global recommendation configuration, only one will be added to the list due to the limit of displaying a maximum of five products.
- No products from random recommendations will be displayed.
Scenario 2:
- All recommendation methods except global recommendations are enabled.
- No manual recommendations are configured for Product B.
- The automatic recommendation has identified only two eligible products for FBT.
- Global recommendations are not set.
- Random recommendation is set to display random products from the same collection.
In this scenario, in the FBT recommendation widget for the product page of Product B, the following format will be followed:
- Since no manual recommendations are available for Product B, the two products identified by automatic recommendation will be displayed first.
- Next, the remaining three positions will be filled by random recommendations.
Method 1: Manual recommendations
Manual recommendations enable the setting up of custom FBT recommendations for any product in the store.
- To set it up, click on Set recommendation.
- From the upcoming page, click on Add new bundle.
- From the pop-up window, select the product you want to display the custom recommendations and click Select.
- Select the products you would like to display as the FBT products. You can select a maximum of 4 products. To create the custom recommendation, click on Add.
The custom bundle will be listed under manual recommendations, as shown below. You have the option to edit, delete, or add more custom recommendations from this location as desired.
Method 2: Automatic recommendations
Automatic recommendations are generated using an algorithm that considers purchase history and other sales data for each product to suggest frequently bought-together products. Enable the checkbox to add automatic recommendations to your store.
Method 3: Global recommendations
Global recommendations allow any product in the store to be featured as a common recommendation for all products, regardless of category or collection. The selected product under global recommendations will be displayed as FBT (Frequently Bought Together) recommendation for all products in the store.
- To set it up, click on Set recommendation.
- From the upcoming page, click on Add recommendation.
- Select the products you would like to display from the popup window. You can select a maximum of 5 products. To create the custom recommendation, click on Add.
Now, the selected products will be listed under global recommendations. From this location, you have the option to delete or add more custom recommendations.
Method 4: Random recommendations
Random recommendations are more like a fallback. Once you enable the method, if the application cannot find any FBT recommendation from other methods, the widget will display products from the same collection, category, or type based on your choice.
- To set it up, Enable the method and click on Set recommendation.
- Select what product to display as FBT recommendations. You can display products from the same collection, category, or type.
Step 3: Set up a title
Once you configure the recommendation methods as required, enter a title for the recommendation widget to display on the front end under the Widget title.
Step 4: Customise widget appearance
Next, to customize the appearance of the recommendation widget, click on Customize under Customise widget appearance
You have various options to customize the widget’s look and feel. These include limiting the number of products displayed, selecting a display layout, customizing various types of text, buttons, and alignments, and much more. For additional information on customization options, refer to the setup guide.
The Visual preference window will provide a wide range of customization options and a live preview of how the widget will appear on the store.
- Customization options – The sidebar contains many customization options for customizing the widget’s appearance.
- Preview – The preview provides a clear idea of how the recommendation widget will appear on the store based on the customization options applied, in live time.
- Preview mode – Preview option for different devices. The preview will change based on the device type selected. The available preview options are:
- Desktop
- Tablet
- Mobile
Customization options
The customization options are divided into three sections.
- Widget layout – Customize the layout number of products to display, display style, and more.
- Product info – Customize product info content, including price, title alignment, font color, and more.
- Action button – Customize the Add to Cart button’s display, text, action, background color, and font color.
- Discount – Customize the discounts related to texts and background properties.
Once configuring the widget appearance as needed, click the back button to return to the FBT configuration window.
Step 5: Set up display rules
In the Display rule section, set conditions to determine when the recommendation widget appears in the store.
You can specify that the recommendation widget only displays for selected Categories, Collections, Products, Tags, User roles, users viewing the recommendation on specific dates, or products within a designated price range. If no conditions are specified, the recommendations will always be visible.
For this instance, we’ll display the recommendations for all products under any conditions, so there will be no specific selections.
Step 6: Set up a bundle discount
Finally, you have the option to set a discount for customers who choose to purchase the whole FBT bundle displayed.
Under the Discount tab, choose a discount type and specify the value as shown below. You can either provide a percentage discount or a flat rate discount on the total value of the product bundle.
Finally, click on the Create widget to generate the recommendation.
Step 7: Generate the widget
If App embed functionality is enabled for SF Product Recommendations, the recommendation will automatically be added to the store. Otherwise, you have to install the widget manually in your store. To know more about manual widget installation, refer to the article, How to install a recommendation widget on the store manually.
Once you complete all the configurations mentioned, your store will have an FBT product recommendation as shown below.
