719-286-0751 info@cadence-labs.com

Magento 2: Fix Bug When Changing Attribute Catalog Input Type From Swatch to Dropdown

Magento 2’s swatch module is a great addition to the core codebase (one that was frustratingly missing for most of Magento 1.x). The new swatch module allows a merchant to show their configurable attribute options in one of three ways:

  • Text Swatch
  • Visual Swatch (Image thumbnail)
  • Dropdown (your typical <select> input)

The Magento 2 admin panel lets you select the input type in

Stores -> Attributes -> Products -> {your attribute} -> *Catalog Input Type*

However, you may have run into a strange bug. After changing from a Visual Swatch or Text Swatch back to Dropdown, swatches continue to show up! You are forever locked into using swatches.

The internals of this Magento 2 bug are quite complex, and still present in Magento 2.3.x. Again, it’s fairly involved but I’ll give a quick run down:

  • The field value for “Catalog Input Type” is stored as part of a serialized php array in the eav_attribute table.
  • When you change the value of the input type, the serialized data is changed.
  • On the frontend Magento 2 determines if swatches are in use by looking for values in the eav_attribute_option_swatch table.

This is clearly a bug that was missed in testing – if the frontend method looks at the _swatch table, those values need to be cleared when the Catalog Input Type is changed.

Luckily, you can easily run some SQL in your database to clean out values from these tables for the attributes that you want to appear as dropdowns.

*Warning* The below SQL will delete option swatch values by attribute_code, make *sure* you have the right attribute codes in the list:

DELETE s.* FROM eav_attribute_option_swatch s
INNER JOIN eav_attribute_option o on o.option_id = s.option_id
INNER JOIN eav_attribute a on a.attribute_id = o.attribute_id
WHERE a.attribute_code IN ('size', 'color');

When you run this, you will need to change “size” and “color” to the attribute codes you’re trying to change to a dropdown.

You then need to clear the cache.

php bin/magento cache:flush

So to recap:

  1. Run the delete SQL with the correct attribute codes.
  2. Flush the magento cache

That’s it! You should now see your swatches changed to dropdowns on the frontend!

Alan Barber is the Lead Web Developer at Cadence Labs and a Magento Certified developer.

Need help with Magento 2 Attributes?

We’ve had a lot of experience fixing problems with Magento 2. If you need help, head over to the Cadence Labs contact page, or email us at info@cadence-labs.com. We offer affordable rates for our Magento development services. 

1 Comment

  1. Kay

    Tanks for this workaround.
    I saw this hint in github and for me it worked to truncate the eav_attribute_option_swatch and flush the cache.

    Reply

Submit a Comment

Your email address will not be published. Required fields are marked *

Install our webapp on your iPhone! Tap and then Add to homescreen.
Share This