Product Options: Frontend Settings

Steps to Adjust

To adjust your 'frontend settings', select SettingsFrontend Settings from within Product Option's menu, and you'll find the settings shown below.

Select frontend settings from the Settings dropdown menu

 


Price Display Settings (Premium)

Note: Selecting 'Display the option price beside each priced option' will always show the additional price next to the option within the list of options.

Within the "Price Display Settings", select your desired option.

Price Display Settings

  • Default: Priced options will show below the options.
    Default
  • Class: This requires you to create a new element and place it in the theme files. It will show your priced option in your custom element, wherever you choose to display it on your page.
  • Add to Price: When a priced option is selected, the product's price will update to reflect the total price of both the product and option.
    Add to Price
  • Append to Price: The option price will display beside the product price as an additional cost.
    Append to Price

 



Dropdown Option Display Settings

Make adjustments to the way that your dropdown option type looks in terms of price display and empty value. Use the preview on the right-hand side to see your adjustments and how they'll look.
 


 

Option Help Text Display Settings

Choose what kind of help text you want to be displayed to customers when choosing their options. The text that will appear is set when you create an option.

  • Under "Option Help Text Display Settings", select Help TextTooltip or Off.

    Picture showing a section of the settings titled Option Help Text Display Settings, with three options: help text, tooltip, off

    • Help Text: Option help text will be displayed as text below the option.

      Note: 'Radio Buttons' are the type of option being used in this example. The help text may look different on your store depending on which option type you choose.

      Picture shows a Shopify store product with example help text, which says please select your size, located underneath the product's size options

    • Tooltip: Option help text will be shown as a tooltip while hovering over the option.

      Note: 'Radio Buttons' are the type of option being used in this example. The tooltip may look different on your store depending on which option type you choose.

      Picture shows a Shopify store product with an information tag that has text saying please select your size, located above the product's size options

    • Off: Option help text will not be shown.

      Picture shows a Shopify store product with the product title, product image, price, and size options 



Language Settings

Adjust the language that appears if a customer attempts to add a product to their cart without choosing a required option.

Below, the message entered in the Option Required Message was "Please select a {option}".

Note: Using {option} in your message will auto-fill the name of your option set. In this case, my option set name is "Size".

Option required message on the front end

Was this article helpful?
0 out of 0 found this helpful