# Product Upsells

## What is Product Upsells?

Product upselling is a sales technique aimed at persuading a customer to purchase a more expensive version of an item they are interested in, or to add upgrades or premium features to that item. The goal is to increase the value of the sale and generate more revenue.

There are several common types of product upsells that sometime you might see

* **Upgrading**: This is the most common type of upsell, where a seller encourages the customer to buy a more premium or upgraded version of the product they are considering.
* **Bundling**: This technique involves grouping several products together and selling them as a package, often at a discounted price compared to buying each item individually.
* **Protection Plans and Extended Warranties**: Offering customers an extended warranty or a protection plan for their purchase is another form of upselling.

<figure><img src="/files/ewANDAZ2Yr5q9wdjAEa0" alt=""><figcaption></figcaption></figure>

We built this features for you not just trying to sell more; we are helping your customers find products that better suit their needs. When customers are presented with relevant and valuable upsell offers at the right time, it can increase their intent to purchase and boost your store's conversion rates

[**Click here to see the demo link ->**](https://library.smind.io/products/mh40-wireless?view=product-upsells-1)

## How To Install Product Upsells?

Step 1: In Shopify Admin, going to Smind Section app and find **Product Upsells 1-1** in Product Block tab of Library. Click Install and Customize it.

<figure><img src="/files/ZYg5cCagplWxhx1y1RUk" alt=""><figcaption></figcaption></figure>

Step 2: Going to Shopify Editor sidebar, choose any product page template and click Add Section -> **Product Upsells 1-1**

<figure><img src="/files/xG65KyYjJcJFkK4pY9ES" alt=""><figcaption></figcaption></figure>

Step 3: Copy the block ID. For example: smi-block-product-upsells-1

<figure><img src="/files/vjgTiAbkkiepvg5NnSqC" alt=""><figcaption></figcaption></figure>

Step 4: On the Product Detail sections, click Add Block and add Smind Block to the section.

<figure><img src="/files/0nZKGK2FsEUS5O0ooQ9r" alt=""><figcaption></figcaption></figure>

Step 5: And insert the block ID of Product Upsells to the Section ID. You can change the block name if you want.

<figure><img src="/files/e9CQ0XcT8KxvLNBH5Ecn" alt=""><figcaption></figcaption></figure>

Step 6: Now you have to change the content for this feature

* **Block ID:** This is a unique identifier for this specific block.
* **Content max-width:** This setting limits the maximum width of the content inside the block.

<figure><img src="/files/jDSCwUZUsMFl1hUk2gCA" alt=""><figcaption></figcaption></figure>

#### Product settings

This area determines which products are displayed as upsells and how they appear.

* **Products:** This allows you to manually Select specific products that you want to offer as upsells.
* **Enable dynamic product recommendations:** When this option is off, you must manually select products. If turned on, it would automatically show related products using Shopify's "Search & Discovery" app.
* **Free text price:** This lets you display custom text instead of the price after an offer is applied.
* **Image width:** This controls the width of the product images
* **Media ratio:** This sets the aspect ratio for the product images.
* **Use image corner radius from theme settings:** This is enabled, so the product images will have the same rounded corners as defined in your global theme settings, ensuring a consistent look.

<figure><img src="/files/RflZi9WiCcsZZgKvhD1a" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/FLONrRoAY2DtADmvtdQy" alt=""><figcaption></figcaption></figure>

#### Heading

These options control the title of the product upsell section.

* **Heading:** This is the text for the section's title.
* **Heading size:** This controls the font size of the heading.
* **Heading alignment:** This aligns the heading text within the block.

<figure><img src="/files/5M7eERYI8DhJmaHgJl5r" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/X7xMbdX2ovsTzqZYXff4" alt=""><figcaption></figcaption></figure>

#### Container

These settings customize the appearance of the container holding the upsell products.

* **Grid view:** This is enabled, which arranges the products in a grid format
* **Number of columns on desktop:** This sets the number of columns in the grid for desktop screens.
* **Number of columns on mobile:** This sets the number of columns for mobile devices.
* **Thickness:** This adjusts the border thickness of the container.
* **Thickness opacity:** This controls the transparency of the border.
* **Corner radius:** This rounds the corners of the container.
* **Content padding:** This is the space between the container's border and the content inside.
* **Item gap on desktop:** This sets the space between each product in the grid on desktop views.
* **Item gap on mobile:** This sets the space between products on mobile views.
* **Shadow:** This adds a shadow effect to the container.
* **Shadow opacity:** If a shadow were enabled, this would control its transparency.&#x20;

<figure><img src="/files/BysRQ3nq8Ihe7SYAKVvH" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/r1zcJWWHjDNHULeE02ZJ" alt=""><figcaption></figcaption></figure>

#### Slider

* **Auto rotate slides:** If turned on, but would make the slides change automatically.
* **Change slides every:** This would set the time between slide changes to 5 seconds.
* **Pagination:** This would set the style for the slider's navigation dots or lines.

<figure><img src="/files/byBkRu15kf6b9LmiAngz" alt=""><figcaption></figcaption></figure>

#### Checkbox

This section controls the interactive elements for selecting the upsell products.

* **Enable clickable items:** When on, customers can click anywhere on the product item to select it without redirecting to its product page.
* **Checkbox style:** This sets the visual style of the checkbox.
* **Checkbox position:** This places the checkbox to the Left/Right of the product item on the list view.
* **Use a quick Add to Cart button for the product:** This is enabled, adding an individual "Add to Cart" button for each upsell product.

<figure><img src="/files/ZrW7ptVZ96lkfcmj8fPB" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/wtOGvxixej8N9IDa4zLM" alt=""><figcaption></figcaption></figure>

#### Button

This section customizes the main call-to-action button for the upsell offer.

* **Button label:** This sets the text on the button to "Add Cart".
* **Button animation:** This determines if the button has a visual effect on interaction.&#x20;
* **Color Scheme:** This applies a pre-designed set of colors from your theme  to the button.
* **Custom color:** This toggle is off. If enabled, it would allow you to manually select a different color for the button, overriding the theme's scheme.

<figure><img src="/files/2GIq1rYtoUJ8r9gAXrbt" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/usfGG2tv2SByyICz4zIc" alt=""><figcaption></figcaption></figure>

#### Block spacing

These settings control the space around the entire product upsell section.

* **Top margin:** This adds a certain of pixel of empty space above the block, separating it from the content above.
* **Bottom margin:**&#x54;his adds a certain of pixel of empty space below the block, separating it from the content below.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.smind.io/in-app/library/product-blocks/product-upsells.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.