how do i increase the number of columns in our catgeory view when in grid mode...right now we hve 2 but i want them to have 5 products in each row so that means i need to increase the number of columns from 2 to 5...any pointers ?
Depending on what version of Magento you’re using there are two ways to do this. To determine which way you should use, open your theme’s template/catalog/product/list.phtml file and search for “columnCount”. If the search yields results, follow these steps:
1. Open your theme’s layout/catalog.xml file in a text editor.
2. Find the layout handle catalog_category_layered and look for an element whose opening tag looks thus:
4. Open your theme’s css/boxes.css file. Search for “.listing-type-grid li.item”. Adjust the width property within this declaration so that the columns can fit within the .col-main area without breaking onto multiple lines.
5. As a finishing touch, change the size of the product images. To do this, open your theme’s template/catalog/product/list.phtml file; then, search for “Grid Mode”. Once you’ve found that point in the file, search for “resize”. Change the dimensions specified within the parenthesis so that the images can fit within your new column width. Also, remember change the width and height attributes to reflect your new image size. Save the file once you’ve made your changes.
If the search yields no results, replace steps 1-3 with these steps:
1. Open your theme’s template/catalog/product/list.phtml file.
2. Search for “Grid Mode”. Once you’ve found that point in the file, find a line that looks similar to
<?php if($i++%3==0): ?>
and change the number (3) to your desired column count (5):
Sorry, I must be getting tired; I left out the “catalog” part of the path. It should be: app/design/frontend/default/default/template/catalog/product/list.phtml. Again, sorry about that. (I’ve now edited the posts.)
In catalog.xml you should add the snippet following the instance that comes after <catalog_category_layered>.
jkragh.......duuuuuudddddeeee u r god !!!! thxs it worked like a charm....men people like jkragh need to be worshipped ok let me get a hold of my freaking sef here...i still got a few other things i need help with but jkragh u da man!!!! hope u r a dude...if u r a chic i will just edit this post !!!
which creates the grey divider between products and would need to be updated, so when applying the above technique and viewing a category with only product is gives the impression that the fix hasn’t worked
Hi, I hope somebody out there can help me with this. I followed the steps in this thread, but my list.phtml file looks different than described. I have 4 columns in my grid view and would like to go back to 3. Rather than a number in the columnCount, I have a $ symbol.
<?php if ($i++%$_columnCount==0): ?>
Right now it looks crowded, and the columns need more space between them. I attached a picture so you can see what it currently looks like. Here’s a snippet of the Grid code. And I’m using the modern theme.
<?php // Grid Mode ?> <div class="listing-type-grid catalog-listing padder"> <!-- the class name will change to .listing-type-cell if viewing in list mode --> <?php $_collectionSize = $_productCollection->count() ?> <table cellspacing="0" class="generic-product-grid" id="product-list-table"> <?php $_columnCount = $this->getColumnCount(); ?> <?php $i=0; foreach ($_productCollection as $_product): ?> <?php if ($i++%$_columnCount==0): ?> <tr> <?php endif ?> <td> <p class="product-image"> <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>"> <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(170, 170); ?>" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" title="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" /> </a> </p>
Any help would be appreciated. I’ve been searching for a solution for this for hours. Thank you.
Well, not quite. You’ve followed the steps which apply to old versions of Magento. From the way your list.phtml file looks I can infer that you need to follow the topmost steps, i.e.,
1. Open your theme’s layout/catalog.xml file in a text editor.
2. Find the layout handle catalog_category_layered and look for an element whose opening tag looks thus:
Thanks for your response. All these different versions get confusing. I did what you said and didn’t get any change. Here’s that part of the code from my catalog.xml file: