1

Is it possible to add color swatches on the list page and color dropdown on the product view(detail) page?.

Please check below image, I added color attribute as a dropdown: enter image description here

So by default on the product view page showing dropdown of the color attribute.

Now I need to add color swatches on product list page.

Is it possible?. If it's possible let me know how to set color swatches on the product list page.

Thank you so much.

  • check this link --- bsscommerce.com/blog/… – Mohit Patel May 26 at 6:04
  • @MohitPatel Thanks for reply. The default view page dropdown is perfect but I need color swatches only on list page. – Monark Bhawani May 26 at 6:42
  • You want to different page different styles show???.view page drop down and listing page color swatches ??? – Mohit Patel May 26 at 6:52
  • @MohitPatel yeah right. – Monark Bhawani May 26 at 7:01
2

I found a solution.

step-1: open admin > stores > attribute > product > search color and change color attribute from the dropdown to swatch.

step-2: open vendor/magento/module-swatches/Block/Product/Renderer/Configurable.php file

Replace line

const SWATCH_RENDERER_TEMPLATE = 'Magento_Swatches::product/view/renderer.phtml';

To line

const SWATCH_RENDERER_TEMPLATE = 'Magento_ConfigurableProduct::product/view/type/options/configurable.phtml';

Now, flush cache and check. You can see swatches on the Product list(category) page and dropdown on product view(detail) page.

| improve this answer | |

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.