> 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/customize-design/settings-overview.md).

# Settings overview

Use **Settings** to change how OPTIS options look and behave on your whole store. Settings has three tabs: **General Settings**, **Design Settings** and **Translation Texts**. On wide screens a **Preview** next to the form shows your changes (product page options, cart or checkout). Click **Save** to apply your changes or **Discard** to cancel them.

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2F5WCMAoCGmYiKQkhQs6GY%2Fimage.png?alt=media&amp;token=48079c80-a962-43a7-acc4-45d736a54696" alt=""><figcaption></figcaption></figure>

{% hint style="warning" %}
Settings are locked on the Free plan. Upgrade to the **Advanced** plan or above to edit them. See [Plans and feature availability](/product-options/getting-started/plans-and-features.md).
{% endhint %}

## General Settings

### Option type setting

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FNn81sSHdw6kWwT25XSwq%2Fimage.png?alt=media&amp;token=bc222ed4-f337-46e3-8f1e-73dd229f93a5" alt=""><figcaption></figcaption></figure>

| Setting                                       | Choices (default in bold)                                       | Learn more                                                                                                                          |
| --------------------------------------------- | --------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------- |
| **Add-on display**                            | **After selecting option values**, or **Next to option values** | [Manage add-on](/product-options/advanced-setup/manage-add-on-additional-fee-for-option.md)                                         |
| **Text input > Character count for text box** | **On** or off                                                   | [Limit Characters for Text Input](/product-options/faq/limit-characters-for-text-input.md)                                          |
| **Swatches > Shape**                          | **Square** or **Circle**                                        | [Display color swatch element in a round shape](/product-options/customize-design/display-color-swatch-element-in-a-round-shape.md) |
| **Swatches > Show swatch tooltip**            | **On** or off                                                   | [Show the swatch tooltip as an image](/product-options/customize-design/show-the-swatch-tooltip-as-an-image.md)                     |
| **Swatches > Hover display**                  | **Text only**, **Image only** or **Text & image**               | [Show the swatch tooltip as an image](/product-options/customize-design/show-the-swatch-tooltip-as-an-image.md)                     |
| **File upload display**                       | **1 file per row** or **Multiple files per row**                | [File Upload](/product-options/20-option-types/others/file-upload.md)                                                               |

### SKU setting

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FLVcwbHAaPO4wUugHHgMl%2Fimage.png?alt=media&amp;token=22fcd7d6-6c5b-4caf-b492-b8880c20fc10" alt=""><figcaption></figcaption></figure>

* **SKU Type**: **Both variants and OPTIS options** (default), **Only OPTIS options** or **Only variants**.
* **SKU Separators**: the character that joins the variant SKU and the option SKUs (default `-`).

See [How does Product Option SKU works?](/product-options/customize-design/how-does-product-option-sku-works.md).

### Widget position

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FbhjpEJyFyH88Zhcpzs67%2Fimage.png?alt=media&amp;token=e46181d0-5b70-4bf3-85f7-0540cdabebb2" alt=""><figcaption></figcaption></figure>

Click **Change widget position** to open your Shopify theme editor with the OPTIS block ready to place on the product page, or click **Tutorial**. See [Change option set position on product page](/product-options/faq/change-option-set-position-on-product-page.md).

### Widget setting

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FooXpYkfzmxfdE7s9a5O3%2Fimage.png?alt=media&amp;token=f761e01b-e646-4b8a-91c0-1df8cc2f8911" alt=""><figcaption></figcaption></figure>

* **Widget height** - tick **Set widget height limit** to give the options area a maximum height in pixels (200 by default; enter 200 or more). When the options are taller than that, a scrollbar appears inside the options area. It is off by default.
* **Alignment** - **Left** (default), **Middle** or **Right**.
* **Option value & message**:
  * **Show selected option value next to title** - shows the value the customer selected (for example a swatch) next to the option name (off by default).
  * **Scroll to first message error** - when a customer clicks **Add to cart** or **Buy it now** with a missing or invalid option, the page scrolls to the first error (on by default).

## Design Settings

The **Design Settings** tab has three sections. Each one has a **Reset** button to go back to the default look.

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FX9YZjFdQhFbBURyq2K4L%2Fimage.png?alt=media&amp;token=3f6796ca-0a35-4db8-86a4-c1e3dd7043aa" alt=""><figcaption></figcaption></figure>

* **Color** - the colors of option titles, values, required character, error messages, help text, text inputs, dropdowns, checkbox/radio, switches, buttons and swatches. See [Change the color for options](/product-options/customize-design/change-the-color-for-options.md).

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FVgA0jrocvJXsQKxDREUe%2Fimage.png?alt=media&amp;token=0f2f2ddc-17e4-4317-8364-ed6f116709cc" alt=""><figcaption></figcaption></figure>

* **Border** - **Border size** and **Border radius** for text inputs, buttons, dropdowns, swatches, quantity buttons and edit buttons.

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FbonMtuzgug1BsbAsURFh%2Fimage.png?alt=media&amp;token=72f387d7-8d21-4670-b5c8-e633bb9546af" alt=""><figcaption></figcaption></figure>

* **Size** (**Text & option size**) - the text size and weight of option titles, values, add-on messages, help text and tooltips and error messages, and the size of text inputs, text areas, buttons, dropdowns, thumbnails, checkbox/radio, switches and swatches. See [Set up the text & option size](/product-options/customize-design/set-up-the-text-and-option-size.md).

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2F7iybVuwAYOufFYv2DCi0%2Fimage.png?alt=media&amp;token=4402ad28-359c-4093-a8d4-91ccc1aeb188" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FXO0iZjvj38Fqg9liRPCl%2Fimage.png?alt=media&amp;token=0eca0a4f-f898-469f-a86e-9538ae10b291" alt=""><figcaption></figcaption></figure>

## Translation Texts

Change the built-in texts of OPTIS and translate your option sets into other languages. See [Translate your option sets and default texts](/product-options/advanced-setup/translate-your-option-sets-and-default-texts.md).

<figure><img src="https://1821185975-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FRFiuDpHWm2HwzxPH4lfM%2Fuploads%2FtCSDPbhkPXysSm5vYLye%2Fimage.png?alt=media&amp;token=467d81c8-759d-4b2f-8b55-2cf1884162a7" alt=""><figcaption></figcaption></figure>