I am trying to create basic text swatches for an attribute (instead of dropdowns). I created an attribute (for example, "size"), set the "Catalog Input Type for Store Owner" to "Text Swatch" and entered all the swatch values. I then created a configurable product with this attribute but the frontend is still showing the options in a dropdown and not in text swatches.

I have tried changing the attribute to "visual swatch" and it still shows as a dropdown.

I have reindexed and flushed the cache but it the attribute choices still show as a dropdown.

Interestingly, the text swatches are showing up in the category page but the product page is still showing the dropdown (see images below).

I am using Magento 2.2.3 and I am not running any extensions and the code has not been changed. It is almost a fresh install.

How can I get the text swatches to show up instead of a dropdown?

Please help

Product Page - options **incorrectly** showing as dropdown

Category Page - options **correctly** showing as text swatches


To change the display type to Text Swatch, navigate to

Dashboard > Stores > Attributes > Product

then find the 'size' attribute from the table. enter image description here enter image description here

Change the "Catalog Input Type for Store Owner" to Text Swatch enter image description here

You should now see a new column appear in the Manage Swatch section.

Add the values that you would like to show inside the swatches, then click Save.

All items that use the size attribute will now display a text swatch instead of a drop-down menu.

  • thank you for responding. Yes, I have done all of those steps to a new attribute I had made and the product page is still showing the options of this attribute in a dropdown instead of in text swatches
    – YWSW
    Jun 15 '18 at 5:02
  • rm -rf var/cache/ var/generation/ var/page_cache/ var/view_preprocessed/ Jun 15 '18 at 5:04
  • rm -rf pub/static/frontend/ pub/static/adminhtml/ pub/static/_requirejs/ Jun 15 '18 at 5:07
  • and let me if after running this command, it still doesn't work Jun 15 '18 at 5:08
  • I tried both commands and flushed the cache again and it still shows as a dropdown and not text swatches... this is very peculiar... what else can the issues be?
    – YWSW
    Jun 15 '18 at 5:20

Success! I disabled a certain "Pre Order" extension I had been using and now the swatches show up. The extension must have been interfering with the magento swatch rendered.

I am posting this just in case someone else runs into this issue so that they do not have to waste as much time as I did.


I solved this issue with changing "Storefront Properties" in Attribute Settings. Set "Visible on Catalog Pages on Storefront" to "Yes" and "Used in Product Listing" to "Yes". After that reindex product data again.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.