# Switch

The **Switch** option type allows users to toggle a setting on or off, typically represented by a slider or switch button on the product page. This is useful for settings or features that customers can choose to enable or disable.

👉You can check out our [Demo product](https://avis-demo.avisplus.io/products/switch-6) to see how it works

***

## **Basic** Option Settings:

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

#### **1. Option Name**

This is the internal name for the switch option within your app. It helps you organize and identify the option during setup but is not visible on the storefront.

#### **2. Label on Product**

This is the title displayed above the switch on the storefront product page. It helps customers understand what the switch controls or activates.

#### **3. Label on Cart**

This is the text shown on the cart summary, checkout, and order detail pages, next to the option value that the customer has selected. It should clearly describe the setting that was toggled.

#### **4. Required Field**

If this setting is enabled, customers must interact with the switch before proceeding to checkout. It’s useful for ensuring that customers actively make a choice.

#### **5. Hide "Label on Product"**

When enabled, this hides the label above the switch on the product page. This is useful if the label is not necessary or if the context is clear from other elements on the page.

#### **6. Add-on Product**

When enabled, this setting adds an additional charge to the product if the switch is turned on. It’s useful for optional features or upgrades that come at an extra cost.

#### **7.** One time charge

This setting allows you to modify how additional charges are applied to a specific option value. Normally, the extra charge for an option is multiplied by the quantity of the product purchased (e.g., an additional charge of $10 would become $50 if the quantity is 5). However, by enabling the "One time charge" feature, the extra charge will only be added once, regardless of the product quantity. This is useful when you want to apply a flat fee for certain options without scaling the charge with the number of items purchased.

#### **8. Switch Value**

The switch value represents the possible states of the switch (e.g., "On" and "Off"). This helps indicate to customers what the switch will enable or disable.

#### **9. Default Status**

This determines the initial state of the switch when the product page loads (e.g., "On" or "Off"). It sets the default behavior for customers, which can be altered before purchase.

#### **10. Conditional Logic**

This setting allows you to display the switch option only when certain conditions are met. It’s beneficial for creating a dynamic shopping experience, where certain options appear based on previous selections.

{% hint style="info" %}
[How to set up Conditional logic for your options](https://options-docs-v2.avisplus.io/app-features/conditional-logic-option-b-shows-if-option-a-is-selected)
{% endhint %}

***

## **Advanced** Option Settings:

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

#### **1. Tooltip**

This setting provides a brief explanation when customers hover over an information icon next to the switch. It’s helpful for offering additional context without cluttering the interface.

#### **2. Help Text**

This setting appears below the switch on the product page and provides more detailed instructions or information about the option. This is useful for ensuring customers fully understand what the switch does.

**3. Price display type**

Decide whether to **show or hide** the additional price on the slider interface.

#### **4. Class Name**

This allows you to assign a custom CSS class to the switch option, enabling you to style it according to your design preferences. It’s beneficial for maintaining a consistent visual style across your storefront.


---

# 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://options-docs-v2.avisplus.io/option-types/all-option-types/switch.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.