Distinguish out of stock variants in dropdown list

[lindapowers]

Hello

When you have a list of childs in a dropdown list from the customer eyes is difficult to tell which products ara available and which are out of stock.

If you see a typical example of parent/child, from this dropdown only 2 are actually in stock but for the customer is impossible to tell:



Is there a way we could alter let's say the color of the letter in the dropdown (change it to red for example) for child products with stock 0?

Or add a text - not available, out of stock etc etc

vm 3.0.8 joomla 3.4.1

[lindapowers]

Id appreciate to know if this is possible somehow even in a commercial way by any of the developers here.

Regards

[Studio 42]

This is very easy to change in the core, adding disabled when stock is 0 :

Code Select Expand

<select>
  <option value="red" disabled>red</option>
  <option value="blue">blue</option>
  <option value="black">black</option>
  <option value="white" disabled>white</option>
  <option value="yellow">yellow</option>
</select>

disabled attribute change the text color from black to gray by default and you cannot select the option in the list.

YOu can change the color in CSS

option:disabled {
  color: #FF0013;
}

--------------
Another trick is to add a class

Code Select Expand

<select>
  <option value="red" class="no-stock">red</option>
  <option value="blue">blue</option>
  <option value="black">black</option>
  <option value="white" class="no-stock">white</option>
  <option value="yellow">yellow</option>
</select>
and in CSS

option.nostock{
  color: #FF0013;
}

But on using choosen dropdown, this is more complicate to do.

[lindapowers]

Thanks for reply

I find more useful adding the class with the the red color since the first option will disable the option to check the product, not so good for SEO.

However I'm talking about adding this in the dropdown since in normal products you can just show the "notify" button even in browse view. Is in the dropdown where customers have no clue of what products are in stock and which are not.

Any way to do this for the dropdown?

Regards

[Studio 42]

Hi,

Thanks for reply

I find more useful adding the class with the the red color since the first option will disable the option to check the product, not so good for SEO.

However I'm talking about adding this in the dropdown since in normal products you can just show the "notify" button even in browse view. Is in the dropdown where customers have no clue of what products are in stock and which are not.

Any way to do this for the dropdown?

Regards

This does not changing something for SEO, the options links are not crawled, in any case because this are not real link.
If you need that the link get crawled, then you have to convert your dropdowns to A href=link