28 Apr

Magento Icon Logo

Change the product per rows in Magento

I recently had to takeover a Magento website which had layout issues. The problem related to the number of products per page. The layout of the page had been changed but not the number of products per row - see below. I am using the default Installation of Magento for this example.

Magento 01

Step 1.

So the first thing to do was sort the results to show 4 products per row.

Open the following file (it could also be in your custom template) app/design/frontend/base/default/layout/catalog.xml

And find all the instances of: -

<action method="addColumnCountLayoutDepend"><layout>empty</layout>

And before each add this code:

<action method="setColumnCount"><columns>4</columns></action>

Step 2.

This now leaves a problem with the results being shown. 3 are missing of the bottom row and I know there are more products. The problem relates to the 'Show Per 9 Page' which needs to be changed to 12.

Magento 02

Step 3.

Go into admin and choose System->Configuration. Then on the left goto Catalog->Catalog. The page should now show the Grid only for 'List Mode'. For this example I choose to place in 12,24,36 for 'Page on Grid Allowed Values' and 12 for 'Products per Page on Grid Default Value'.

Magento 03

This will sort the layout issue with the products categories pages.

Magento 04

This is great, but you may have to do the same to your search categories results page depending on its layout, so if you need to change it do the same as above but open the file located at


Hope this helps anyone having the same problem.

Posted in: < eCommerce >
me@grafxflow avatar


I am a Full-stack Developer who also started delving into the world of UX/UI Design a few years back. I blog and tweet to hopefully share a little bit of knowledge that can help others around the web. Thanks for stopping by!

Visitors also viewed these posts

4 Thoughts

  1. 26 Sep



    Not working ;(
  2. 26 Sep



    I have had the same issues but it's usually when I get a Magento website where a developer has changed the system code (Bad Practise) or added custom code. If this is the case it's best to (unfortunately) go through the time consuming process of checking the code against the default magenta download source code. Or the very last option of doing a complete installation from scratch!
  3. 28 Nov



    Hi , Please let me know how to change the number of PRODUCTS in a rows on home page for in TATVAASOFT extension configuration.An early response will be helpful.

  4. 28 Nov



    I am unsure since I have never used this extension but I have searched the web and found this. Not sure if it answers your question?

    You have to overwrite the defaultColumnCount value. One way to do is modify the template file app/design/frontend/base/default/template/catalog/product/list.phtml.

    Here you have to find the row under the comment "Grid mode" (about the row 90 - 95):

    getColumnCount(); ?>

    and change it to:

    _defaultColumnCount = 4; $_columnCount = $this->getColumnCount(); ?>

Add comment

Add comment