> For the complete documentation index, see [llms.txt](https://cth-development.gitbook.io/store-elements-for-tebex/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://cth-development.gitbook.io/store-elements-for-tebex/features/baskets-checkout-and-gifting.md).

# Baskets, Checkout, and Gifting

Store Elements for Tebex uses Tebex baskets to manage customer purchases. Customers can add packages, review their basket, update quantities, gift supported packages and open Tebex checkout from your Wix site.

This guide explains how baskets work and what customers see during checkout and gifting.

### How baskets work

When a customer starts shopping, Store Elements for Tebex creates or resumes a Tebex basket for that visitor.

The basket is managed by Tebex, while the app stores enough browser session information to keep the customer's basket connected as they move around your Wix site.

{% hint style="info" %}
The app does not replace Tebex checkout. It prepares the basket and then uses Tebex checkout so payment and fulfilment remain handled by Tebex.
{% endhint %}

{% hint style="warning" %}
If a customer blocks required cookies or browser storage through cookie consent settings, login, basket and checkout flows may be blocked until consent is accepted; these cookies are required for the app to function properly.
{% endhint %}

### Opening the basket

Customers can open the basket using:

* Basket Button.
* Trolley Icon.
* Successful Add to Basket actions.
* Successful Gift actions.

When a package is added successfully, the basket drawer opens so the customer can immediately see the updated basket.

### Basket drawer

The basket drawer slides in from the side of the page and can show:

* Customer login status, when relevant for the store type.
* Basket line items.
* Package images or fallback package icons.
* Package names.
* Prices.
* Gift recipient information.
* Selected package variables.
* Discord information, when relevant.
* Quantity controls, when quantity changes are allowed.
* Remove buttons.
* Checkout button.

### Checkout

When the customer clicks **Checkout**, the app starts Tebex checkout for the current basket.

The Wix page is dimmed behind the checkout experience so the customer can focus on completing payment.

{% hint style="info" %}
Checkout is powered by Tebex. Store Elements for Tebex controls the store element and basket experience before checkout starts.
{% endhint %}

### Quantity controls

Some Tebex packages allow customers to change quantity in the basket. Others do not.

If you enable, in Tebex, the 'Do not allow the customer to increase the quantity of this package when purchasing' Restriction option for a particular package, the basket drawer does not show quantity controls for that line item.

### Removing packages

Customers can remove packages from the basket drawer.

The remove action uses a trash icon and updates the basket after the package is removed.

### Gifting packages

Packages can only be gifted when Tebex allows gifting for that package - two things must be true for this option to be offered:

* Gifting must be enabled in [Checkout Settings.](https://creator.tebex.io/payment-methods/settings)
* The package in question must not be excluded from gifting in package settings (Gifting).

If a package can be gifted, the customer can click the Gift button and enter the recipient details required for that store type.

### Gift recipient details

Gift recipient requirements depend on the Tebex store type.

For Minecraft stores, customers provide the recipient's Minecraft username.

For stores that use Tebex authentication links, customers provide the recipient information supported by Tebex for that store type. For Cfx.re/FiveM and RedM style gifting, the app asks for the recipient username.

### Gift details in the basket

When a package is added as a gift, the basket drawer shows gift recipient details on that specific line item.

This helps customers confirm that the correct package is being sent to the correct recipient before checkout.

### Basket errors

Most basket errors are shown as pop-up error messages in the bottom-right of the site.

### Best practices

* Add a Basket Button or Trolley Icon to every store-related page.
* Keep the basket element visible in the header or pinned area.
* Test normal purchases and gift purchases before publishing.
* Test checkout on desktop and mobile.


---

# 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 dynamically by asking a question.

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

```
GET https://cth-development.gitbook.io/store-elements-for-tebex/features/baskets-checkout-and-gifting.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

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.
