> For the complete documentation index, see [llms.txt](https://support.quizkitapp.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://support.quizkitapp.com/building-a-quiz/integrations/shopify/shopify-checkout-ui.md).

# Shopify Checkout UI

Checkout extensibility opens new ways to customize checkouts on Shopify.

{% hint style="info" %}
**Note:**

This feature is available only for **Shopify Plus** stores. If you’re on a legacy Quiz Kit plan, then this feature is available for the **Middle** plan or higher.
{% endhint %}

You can show quiz results or other products on the checkout page with Shopify's Checkout UI feature.

***

## Connecting Shopify Checkout UI to Quiz Kit

**Steps:**

1. From the Quiz Kit dashboard, click **Integrations**.
2. On the **Shopify** tab, go to **Shopify Checkout UI.**
3. Click **Settings**.
4. Click **Activate**.
5. Click **Save**.

***

## Customizing the Checkout UI

You can select which products will be shown to customers at the checkout. 

Quiz Kit has three options:

1. **Result products** - If the customer completes the quiz, then the customer's recommendation is shown on the checkout page, up to a maximum of 4 products. The user should be logged in and leave the same email while completing the quiz.
2. **Default products** - Show specific products for customers on the checkout page, even if they haven't completed the quiz. You can select up to 4 products.
3. **Personal smart recommendations** - Show smart recommendations on the checkout page. To do this, you need to activate [personalization](/advanced-settings/personalizing-your-quiz.md), enable [smart recommendations](/advanced-settings/personalizing-your-quiz.md), and add relevant sections to your online store theme. 

Checkout UI elements automatically inherit the store brand settings.

***

## Adding the extension to checkout page

**Steps:**

1. From the Shopify admin, go to **Settings** > **Checkout.**
2. Under **Configurations**, click **Customize**.
3. From the left-hand menu, click **Apps**.
4. From available app extensions select Quiz Kit upsell products.

Upsell product section can be moved to any available location on the page.

Recommended products are shown when the customer completes the quiz with their email address and are logged into their customer account with the same email address.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://support.quizkitapp.com/building-a-quiz/integrations/shopify/shopify-checkout-ui.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.