Product Options Display Settings

Modified on Mon, 29 Apr at 3:17 AM

Overview

With SC Product Options' Display Settings, you can fully customize your dropdown menus, checkboxes, and more to match your store's branding.

Please select an option below to view more information.

Video Walkthrough


Options Title

Options title backend

  1. Add text that displays above your options.
  2. Change the text size.
  3. Add title padding (in pixels).
  4. Add/change the color of the title text's background.
  5. Add/change the color of the title text's border.
  6. Change the colour of the title text.
  7. Bold the title text.
  8. Show the full text of your options rather than abbreviating them.

Note: In the example below, the Title Text is 20px and the Title Padding is 40px.

Customize Your Product


Options Container Style

Options_Container_Style.png

  1. Adjust the background colour the option sits in front of.
  2. Change the border colour (wraps around background).
  3. Change space (padding) between text and border (in pixels).
  4. The amount of space between selectable options (in pixels).
  5. Colour of the line that separates the options (if multiple).

Options Name & Values Style

Option_Names_and_Values.png

  1. Change the colour of the text.
  2. Bold the text.
  3. Move the text to the left of the options.
  4. Change the colour of the text (dropdown option type only).
  5. Change the spacing to the left of the options (dropdown option type only).

Swatch Settings

Swatch_Settings.png

  1. Select Tooltip or Listed (changes if the swatches are displayed on one line, or above one another).
  2. Choose the Swatch size (small, medium or large).
  3. Select a Swatch Style (square, rounded, or circle).
  4. Swatch selected colour (changes the colour of the border when the swatch is selected).

Premium Option Settings

Premium_Option_Settings.png

  1. Update Total text (choose the verbiage for the extras being charged).
  2. Text can also be added to the end of the pricing (IE. Total Extras: $5.00 before tax).
  3. Choose the background colour for the extras.
  4. Choose the Border colour for this section.
  5. Change the text colour.
  6. Change the price colour.

Inventory Checking

When the Enable inventory checking option is selected, it will not allow your priced options to be sold unless there is sufficient inventory on the Shopify product page. Instead, a message of your choice can be displayed.

There is a similar option that can be selected through Shopify in regards to allowing overselling.

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article