> For the complete documentation index, see [llms.txt](https://docs.optis.me/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.optis.me/product-options/getting-started/option-group.md).

# 📂Option Group

✨ [Demo store](https://optis-product-options-variant.myshopify.com/products/custom-backpack-option-group?_pos=1&_psq=option+group&_ss=e&_v=1.0)

## 📂What is an Option Group?

An **Option Group** is a container that holds multiple options under a single group title.

* Options inside a group can be **collapsed or expanded**
* Customers can click the group title to show or hide its options
* This is especially useful for products with many customization fields

Option Groups help structure complex option sets and improve the overall user experience.

## How Option Groups Appear on the Storefront

{% embed url="<https://jam.dev/c/0fe7df8d-427c-4221-bed5-864d011b209c>" %}

## ⚙️How to Create an Option Group

#### Step 1: Create an option group

* In the **Options** dashboard, click **Add option group**
* A popup modal will appear where you can configure the group settings

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

#### Step 2: Configure Option Group Settings

{% stepper %}
{% step %}

#### In the popup modal, you’ll see the following fields:

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

**🏷️ Group Name -** It will be displayed on the product page as a clickable header

**🔽 Display Type -** Choose how the group appears by default on page load:

* 🔓 **Expand -** The group is **open by default**, and all options inside are immediately visible.\ <mark style="color:$success;">Recommended for required or frequently used options.</mark>
* 🔒 **Collapse -** The group is **hidden by default**. Customers must click the group title to view the options.\ <mark style="color:$success;">Recommended for optional or advanced settings.</mark>

**🧠 Conditional Logic (Optional)**

* You can control when this option group is shown or hidden based on a previous selection
* This is useful for showing additional options only when certain conditions are met

Click [**here**](/product-options/getting-started/other-popular-features/how-to-set-up-conditional-logics.md) to learn How to set up conditional logic.
{% endstep %}

{% step %}

#### **Click Back to finish creating the option group**

{% endstep %}
{% endstepper %}

#### Step 3: Add Options to the Group

1. Inside the newly created group, click **Add option to this group**&#x20;
2. Select the option type you want to create (checkbox, textbox, etc.)
3. Configure the option as you normally would
4. Click **Back**

You will now see:

* The option added inside the group
* A live preview on the **right-hand side** showing how the option group expands and collapses

#### Step 4: Apply to Products & Save