Cross-sells
Use this section to recommend complementary products and increase order value.
In case you are looking to increase your store’s average order value (AOV), the Cross-sells (Frequently Bought Together) section should be at the top of your list. You can enable this section below the main product on the product page, but it also works perfectly on other pages, such as your homepage.
Customers benefit as well, since you can offer discounts when multiple products are purchased together.
1. Add the section
By default, this section is already present on the product page. If it’s not, simply click Add section from the list of sections on the left and select Cross-sells. As mentioned earlier, you can also add this section to any other page in your Shopify store.
2. Configure it
In addition to the general settings, like the section title or description—which you can intuitively change—there are a few key settings worth explaining:
Product – Select a product to act as the main product for this section. If you are configuring the section on a product page, you don’t need to select one, as the page’s main product will automatically be used.
Metafield namespace/key – This is critical because it determines which products are shown alongside the main product. See Step 3 below for instructions on creating the metafield. Enter the exact namespace/key you used when creating it.
Discount – Select the discount to apply if customers add the selected products from this section to their cart. Note: You must create the discount (Step 5) for it to apply at checkout.
Minimum items to apply discount – Set the minimum number of items a customer must select to activate the discount. For example, if you set this to 3, the customer must select at least 3 products from the section to see the discounted price. Otherwise, the total will show the regular price.
3. Create the metafield
From your Shopify admin, navigate to: Settings → Metafields and metaobjects → Products
Create a new metafield with the following settings:
Type: Product → List of values
Namespace and key: You may choose a custom value if you wish (as shown in the screenshot below), but it must match the value set in the section settings.
The Cross-sells section relies on this namespace/key to function correctly, so both values must be identical.
4. Select complementary products
Now that you have created the metafield, you need to select the complementary products for each item you want this section to appear on.
To do this:
From your Shopify admin, open any product and scroll down to Metafields.
Find the Cross-sells metafield you created earlier.
Select the products you want to appear as complementary.
Important notes:
If you leave this field empty, the Cross-sells section will not appear for that product. This is useful if you only want the section to show for specific products.
You do not need to select the current product—only the complementary products. The first product in this section will always be the main product.
5. Create the discount
As mentioned above, for the discount you specified to take effect in the customer’s cart, you must create an Automatic discount.
To create an automatic discount:
From your Shopify admin, go to Discounts.
Click Create discount and select Automatic discount.
Important settings Make sure the following settings match your Cross-sells configuration:
Method – Select Automatic (not manual), so customers don’t need to enter a discount code.
Discount value – Choose Percentage, and enter the same discount you selected in the Cross-sells section.
Minimum purchase requirements – Select Minimum quantity of items, and enter the same value as the Minimum items to apply discount in the Cross-sells settings.
You can adjust the remaining settings—such as applicable products, dates, or usage limits—according to your store’s needs.
Once set up correctly, customers will see the discount automatically applied in their cart when they select the relevant products from the Cross-sells section.
6. Verify the section
Visit your store’s frontend to confirm that the Cross-sells section is displaying correctly and functioning as expected. Be sure to add the products to your cart to test whether the discount you created is applied correctly.
If the section is not showing, the two most likely causes are:
The Metafield namespace/key does not match the one specified in the section’s settings.
No complementary products have been selected for the product you are testing.
Below is an example of how this section should appear on your store.
Last updated