How can I disable an option?

If you want to temporarily disable an option and make it not possible to select it, you can mark the value as disabled.

On the option where you define the option values, hover over the value field,  the disable button will be made visible, click on it to disable the option value:

When an option is disabled, the button icon will show in red:

Disabled option

Disabled options will not be selectable on the product page. They are styled with a line trough to signal that the option is not available:

Image and color swatches will show greyed out with less opacity:

Sold out text

If you want to show a custom text instead of the price of the option, then you can manually add a translation as described here:  How can I translate product options?

Use the following key to provide your translation:  product.options.disabled


The text will show instead of the price of the option, the location is depending on your setting:

Hide disabled option

If you want to fully hide disabled option selections, you can apply the following style in the Custom CSS section

.cl-po--disabled {
    display:none !important;
}
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.