Product variant not displaying when there is only 1 option

Crystal_B
Shopify Partner
12 0 0

We sell shoes and many times our inventory gets down to just one size and we want to have that size show up like it would if there were multiple options available. That way the customer will know what size is available for purchase. For now I've added the size to the description but would prefer not to do this.

store: http://elfstones.myshopify.com/

pass: studioopal

product example: http://elfstones.myshopify.com/collections/womens-chie-mihara-shoes/products/osmo

 

Replies 5 (5)
Jamie
Shopify Staff (Retired)
5711 0 159

Sorry bradcr, I don't understand your question....

What should that product page look like?

http://shopifyplus.com ::: http://twitter.com/bacchus
Crystal_B
Shopify Partner
12 0 0

This product has the drop-down with the sizes available. 

http://elfstones.myshopify.com/collections/frontpage/products/red-classic-canvas-womens

 

Even though there is only one size for this product I would still like it to show the size like it does on the above product. 

http://elfstones.myshopify.com/collections/womens-chie-mihara-shoes/products/osmo

Jamie
Shopify Staff (Retired)
5711 0 159

So it looks like you are using Minimo. You will have to do a little minor brain surgery on your theme, so roll up your sleeves and break out the ether.

Step 1) Back up theme! Go to theme manager and download a back-up of your theme.

Step 2) Go to the theme editor and bring up your product.liquid into the editor window.

Step 3) Find this bit:

 

		<!-- Begin options -->
		<div id="options">
			<form method="post" action="/cart/add">
			{% if product.variants.size > 1 %}
				
				<!-- Begin variants -->
				<div id="variants">
					<div class="border">
						<select name="id" id="id">{% for variant in product.variants %}{% if variant.available %}
							<option value="{{ variant.id }}">{{ variant.title | escape }} ({{ variant.price | money }})</option><br />{% else %}
							<option value="{{ variant.id }}" disabled="disabled">{{ variant.title | escape }} ({{ variant.price | money }}) - SOLD OUT</option>{% endif %}{% endfor %}
						</select>
					</div>
				</div>
				<!-- End variants -->
				
				{% else %}
				
				<input type="hidden" name="id" value="{{ product.variants.first.id }}" />
				
				{% endif %}
				
				<!-- Begin buy-->

 

 

Replace with this bit:

 

		<!-- Begin options -->
		<div id="options">
			<form method="post" action="/cart/add">

				
				<!-- Begin variants -->
				<div id="variants">
					<div class="border">
						<select name="id" id="id">{% for variant in product.variants %}{% if variant.available %}
							<option value="{{ variant.id }}">{{ variant.title | escape }} ({{ variant.price | money }})</option><br />{% else %}
							<option value="{{ variant.id }}" disabled="disabled">{{ variant.title | escape }} ({{ variant.price | money }}) - SOLD OUT</option>{% endif %}{% endfor %}
						</select>
					</div>
				</div>
				<!-- End variants -->				
				<!-- Begin buy-->

We are removing the conditional logic that determines when to show a dropdown and making the template always show the dropdown.

HTH Crystal!

 

 

http://shopifyplus.com ::: http://twitter.com/bacchus
Crystal_B
Shopify Partner
12 0 0

That worked! Thanks for the help, Jamie.

I made one small change to remove the product price from displaying next to the size in the drop down. (it was only showing the price on products that had just one size available. thought that was kinda odd.)

I removed this: ({{ variant.price | money }})

That removed the price and didn't seem to mess up anything else. Is there any reason why I shouldn't have done that?

HEZ
New Member
3 0 0

i have the same issue and i am using fashionoplism theme. Will the code still work on this theme?