Custom field not adding anything to cart

Topic summary

A user encountered an issue where a custom field for product customization (“Do you want customization?”) stopped working when migrating from Shopify’s Debut theme to the Dawn theme. The field wasn’t adding properties to the cart despite other custom fields functioning correctly.

Key Details:

  • The code included a dropdown select field and conditional JavaScript to show/hide a text input based on selection
  • Another user suggested this might be a broader Shopify platform issue affecting multiple stores since Saturday morning, linking to a related thread about cart locale parameters

Resolution:
The original poster found working code that resolved the issue, though it still needs CSS styling adjustments.

Alternative Solution:
A community member recommended the Easify Product Options app (free plan available) as a no-code alternative for creating custom product fields, providing screenshots demonstrating the setup process and cart display.

Summarized with AI on November 5. AI used: claude-sonnet-4-5-20250929.

Hello, I used to use a custom field in the debut theme; for some reason, on the Dawn theme, this code doesn’t add anything to the cart.

I have other custom fields that work perfectly. What might be the reason for that?

If you have any idea how to fix it, I would be grateful :slightly_smiling_face:

<p class="line-item-property__field" style="margin-left: 5px; !important;">
   <label>Do you want customization?</label>
   <select id="custom" name="properties[Do you want customization?]">
       <option value="No">No</option>
       <option value="Yes">Yes</option>
   </select>
</p>
<p class="line-item-property__field" id="customName" style="margin-left: 5px !important;">
   <label for="NAME">Names:</label>
   <input class="required" id="Customization" type="text" name="properties[Customization]">
</p>
<script>
  const customField = document.querySelector('#custom');
  const customName = document.querySelector('#customName');
  const personalizacijaInput = document.querySelector('#Customization');

  customName.style.display = "none";
  personalizacijaInput.required = false;

  customField.addEventListener('change', function() {
    if (this.value == "Yes") {
      customName.style.display = "block";
      personalizacijaInput.required = true;
    } else {
      customName.style.display = "none";
      personalizacijaInput.required = false;
      personalizacijaInput.value = ''; // Clear the input value when not required
    }
  });
</script>
1 Like

Several stores are watching a similar issue that could be a problem on the Shopify side and not necessarily your custom theme. The problem over on this other post started Saturday morning: https://community.shopify.com/topic/2743030

Give it a like and response (it might help escalate the issue)

1 Like

Hello, I have found the code that works. Needs just some CSS on it and we good. :slightly_smiling_face:


   
   

   
   

Hi @Vyk ,

For future reference, you might find the Easify Product Options app (free plan available) really helpful for creating custom fields without any coding. Here’s a quick example of how you can set it up:

  • Product page:

  • Simple settings:

If you want to give it a try, just let me know!