1

How to change the Category page's layout from 4 columns to 3 columns?

4
  • You mean you have to display product in 3 column? Commented Jun 19, 2018 at 7:09
  • Yes, how can I do this? Commented Jun 19, 2018 at 7:11
  • Check my answer. Commented Jun 19, 2018 at 7:15
  • I don't think that 4 columns layout is available at magento,So you have create own layout?
    – Amit Bera
    Commented Jun 19, 2018 at 7:23

2 Answers 2

1

Simple you can achieve this using CSS, you can set layout with based on your requirement.

Cureent CSS

@media (min-width: 1024px), print
.page-products .products-grid .product-item {
   margin-left: calc((100% - 4 * 24.439%) / 3);
   padding: 0;
   width: 24.439%;
}

To replace with below

@media (min-width: 1024px), print
.page-products .products-grid .product-item {
   margin-left: calc((100% - 4 * 24.439%) / 3);
   padding: 0;
   width: 32.333333%;
}

Note : Adjust with based on your layout.

2
  • Thanks but I knew this already, is there any other option with .xml file ? Commented Jun 19, 2018 at 7:24
  • May be other way is possible but this is a easiest way. Commented Jun 19, 2018 at 8:57
-2

Please refer to this link below:

https://www.templatemonster.com/help/magento-how-to-set-number-of-columns-in-category-listing.html

1
  • that article is for Magento 1 not Magento 2 Commented Jun 17, 2019 at 10:59

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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