how to make option name on product page not mandatory for all the feilds?

here I have three options in my store for wall art, in the colors section I want it to appear if the customer pressed on framed canvas, and to be domed or disappear if the customer pressed on a premium poster or premium canvas.

can anybody help with that plz

1 Like

Use this code in js

function handleVariantChange() {
  // Get the selected variant value
  const variantSelector = document.getElementById('variant-selector');
  const selectedVariant = variantSelector.value;

  // Get the color options section
  const colorOptions = document.getElementById('color-options');

  // Check the selected variant and update visibility of the color options
  if (selectedVariant === 'framed-canvas') {
    colorOptions.style.display = 'block'; // Show the color options
  } else {
    colorOptions.style.display = 'none'; // Hide the color options
  }
}

@esraaalaidy you need customize code for that it might be like when you click on framed canvas at that time you can make colour option visible and on the click of the premium canvas or poster you can disabled the colour option or hide it.

where i should put this code

Which file should I write the customization code inside the code section?

@esraaalaidy you can create custom file for the js other wise you can write the code into theme.liquid file

i did but it didn’t work

Hi @esraaalaidy

You need to add a code in the script that listens to user’s input You might be able to hide the said element with random code but will not update when the user change the selection. To make this work as intended, you need to hire a developer who knows how to edit the code inside the script.

1 Like

Hi @esraaalaidy ,

I have a simple solution to suggest, and no coding is required.

The feature you’re looking for is called Conditional Logic, which allows you to define the relationship between your options. Fortunately, the Easify Product Options app offers this feature, and even its free version can fulfill your requirements :ok_hand: .

Here’s a quick demonstration of how you can use the app to set up what you need:

  • By setting up this conditional logic, when customers select “Framed Canvas,” the “Color” options will be displayed:

  • On the other hand, if they choose “Premium Poster” or “Premium Canvas,” the “Color” options will be hidden, just as you want.

I hope this demonstration helps you achieve your desired outcome :hugs: .