Customize Frequently Bought Together
Overview of how to customize the appearance of the Frequently Bought Together widget on the product page.
Last updated
Was this helpful?
Overview of how to customize the appearance of the Frequently Bought Together widget on the product page.
Last updated
Was this helpful?
Customize the layout and structure of the widget:
Widget layout β Choose how the upsell products are displayed (e.g., Amazon-style or stacked).
Maximum number of products displayed β Set the max number of upsell products shown in the widget. If customers want to show other products, they need to click at See more.
Control the content displayed in the upsell widget:
Total price text β Customize the label for the total price section.
Button text β Modify the text displayed on the add to cart button.
Show each item's price β Enable or disable the display of individual product prices in the widget.
Show discount amount on Add to cart button β Choose whether to display the applied discount (e.g., "20% OFF") on the button.
Customize the colors of the Frequently Bought Together upsell to match your storeβs branding.
You can select from the default widget themes to quickly apply a preset style, or customize the colors by yourself with the below options.
Widget background β Adjust the background color of the upsell widget.
Customize the colors for different text elements in the widget:
Widget title & subtitle β Customize the colors of the main title and sub-title to match your storeβs branding.
Item name β Set the color of product names displayed in the upsell widget.
Item price β Choose colors for the original price (before discount) and the discounted price to highlight savings.
Total price β Define colors for both the original total price and the discounted total price
Adjust the colors of the CTA button:
Button color β Change the background color of the βAdd bundle to cartβ button.
Button text color β Customize the color of the text inside the button.
To further adjust the placement of the Frequently bought together widget within your store's theme, click Open theme editor and position the widget as needed.