> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://support.teeinblue.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# Cross-Sell: Redirecting Product A to Product B

In this guide, I will walk you through setting up a feature that automatically redirects users to Product B after they add Product A to their cart (ATC) using metafields.

![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/crosssellproductgif-optimize_oqzzvs.gif)

|| Note: The redirect function will not work if the product has already been added to the cart before.
# Set Up a Metafield for Redirect Target
 
* In your **Shopify Admin**, go to **Settings > Custom Data > Metafields Definition > Products**.
    ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/image_13m59qc.png)

* Click the **Add definition** button.
    ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/image_nkfxvl.png)

* Under the "Name" field, enter `Cross Sell Product`. In the "Namespace and Key" section, write `custom.cross_sell_product`, set the field type to **Product**, and click **Save**.
    ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/image_1xg1er6.png)

* Return to the **Product** section, find the product you’d like to set up, and scroll down until you see the **Metafields** section.
    ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/image_6z1cx7.png)
* Set this field’s value to the product you want the customer to be redirected to after a successful ATC.

# Implement Liquid Code in Your Theme

* Navigate to **Online Store > Themes** and select **Edit Code**.
![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/image_5nptg4.png)

* Locate and open the `theme.liquid` file. Find the `</head>` tag and insert the following code **right before** it.
![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/image_w2xrkh.png)

```javascript
<script type="text/javascript">
      teeinblue = {
        ...(window.teeinblue || {}),
        onItemAdded: function(item) {
          {% if product.metafields.custom.cross_sell_product.value %}
            const crossSellHandle = "{{ product.metafields.custom.cross_sell_product.value.handle }}";
            const crossSellUrl = "{{ product.metafields.custom.cross_sell_product.value.url }}";
            fetch('/cart.js')
            .then(res => res.json())
            .then(cart => {
              const isProductInCart = cart.items.some(item => item.handle === crossSellHandle);
              if (!isProductInCart) {
                window.location.href = crossSellUrl;
              } else {
                console.log("The cross-sell product is already in the cart.")
              }
            });
          {% endif %}
        }
      }
</script>
```

* Click Save to ensure the changes take effect.

# Finally, return to the storefront and test the ATC process to ensure the redirect functions as expected.