Product Modifiers

Question

I'm trying to loop on product modifiers though I can't seem to do it, can someone tell me why I'm being dumb?

This page suggests I can do it with the product-tag: https://www.exp-resso.com/docs/product_tag.html

This one suggests I can do it with the product-form-tag: https://www.exp-resso.com/docs/product_form_tag.html

Neither seems to work and when I copy/pasta the example code it just hard codes this in my template:

{modifiers}
<p>
  <label>{modifier_name}</label><br />
  {if modifier_instructions}<small>{modifier_instructions}</small><br />{/if}
  {if modifier_type == 'var' OR modifier_type == 'var_single_sku'}
    <select name="{modifier_input_name}">
      {modifier_options}
        <option value="{option_id}">
          {option_name}
          {if price_mod_val} ({price_mod}) {/if}
        </option>
      {/modifier_options}
    </select>
  {if:else}
    <input type="text" name="{modifier_input_name}" />
  {/if}
</p>
{/modifiers}

This Stack Exchange post suggests you cannot use it in the product tag unless its wrapped in product form tag (which I have also tried):

However, you can't access the modifiers that way (there is no way for the fieldtype to return variable loops).

Outputting Exp-resso Store modifier-options without form-tag

Here is a screenshot of my entry in the backend of EE:

Answer 1

This should work fine and while the code you've provided looks OK just double-check all your tags in that template are all closed properly as this is a common mistake that doesn't get caught properly by EE with an error.

Answer 2

You should be able to use the following:

{exp:channel:entries channel="products" limit="1"}
 {exp:store:product entry_id="{entry_id}"}
  {price} - {title}

 {modifiers}
  <p>
   <label>{modifier_name}</label><br />
   {if modifier_instructions}<small>{modifier_instructions}</small><br />{/if}
   {if modifier_type == 'var' OR modifier_type == 'var_single_sku'}
    <select name="{modifier_input_name}">
      {modifier_options}
        <option value="{option_id}">
          {option_name}
          {if price_mod_val} ({price_mod}) {/if}
        </option>
      {/modifier_options}
    </select>
   {if:else}
    <input type="text" name="{modifier_input_name}" />
   {/if}
  </p>
  {/modifiers}

 {/exp:store:product}
{/exp:channel:entries}

This assumes that your products channel is called products and that you are on a single entry page.

Also with your data above you would normally assign multiple options per variation. So something along the lines of Yes or No for TEST instead of just a single variation as you have. Basically you are trying to output a dropdown list with only 1 option at the moment.

The product_form tag is a wrapper for the product tag that you would only need/want to use if you were trying to create a single form that allowed you to add multiple items to the page with a single submit. I often use it to allow a user to add multiple add-on type items after they have added a the main item to their cart. Think along the lines of add an iPhone to the cart I might present them the option to add a case, screen protector, and/or charger to the cart with a single submit button.