Problem with Column Layout Grid for Product Listing 1.3.0.2

[mmmfruit]

I've seen this question asked a few times but haven't found an answer.

I'm using the "Column Layout Grid for Product Listing" (1.3.0.2) and wanted three columns, but this keeps happening:



No matter how many columns I tell ZenCart I want, it does this.. if I say 4 columns, then the first three columns show, and the object in the 4th shows up in a second row (and empty space where the 4th column should be).

Thanks in advance for any help.

[kobra]

Each item consumes a specific width and it appears that you do not have enough width to display what you are calling out. I think that there is some re-sizing when additionals are requested but it is attempting to fit it into say 450px and there is not 450 to work with.

Try as a test, changing the shop width in the css in mainwrapper and up this # by say 50 or 60px and see if this corrects it or not. You could then also look at the left & right column widths and box widths in the admin to see what they are and subtract this from what you found in the css for the overall width to see what you have to work with.

[mmmfruit]

Nope, that doesn't seem to be the problem.

The original width is 750px. I changed it to 800px, so there was 50px more room, and the problem is still occuring. I then changed it to 1000px to give it an extra 250px as a test, and it is still doing it.

It doesn't seem to be a problem of space not being there, because if I set it to 5 columns at 750px, four can fit, and the 5th one drops. If I set it to 2 columns, then one fits at the top, and the second column drops.

The problem appears that no matter how many columns I set, and no matter what the width is, the last column drops down to a second row.

Here are some more screenshots of the different category pages with the following settings: 5 Columns, 750px (I want to use 3 columns in my final layout, but I set it to five to show that up to four can actually fit in the layout). The screenshots below demonstrate the problem occuring on various category pages, each with different number of total items.



Here's the HTML for the table from the page with only 2 items. I don't understand why it is splitting the column. The html tells the table to be 100% of the space it is placed in, with each column at 50%, and it should fit!

<table width="100%" border="0" cellspacing="0" cellpadding="0" id="cat2Table" class="tabTable">
  <tr >
   <th class="centerBoxContentsProducts centeredContent back" style="width:50%;" scope="col" id="listCell0-0"><a href="http://shop.mmm-fruit.com/index.php?main_page=product_info&amp;cPath=2&amp;products_id=6"><img src="images/sushi/californiaroll_01.jpg" alt="California Roll Set" title=" California Roll Set " width="100" height="60" /></a><br><h3 class="itemTitle"><a href="http://shop.mmm-fruit.com/index.php?main_page=product_info&amp;cPath=2&amp;products_id=6">California Roll Set</a></h3><div class="listingDescription"></div><br>$25.00<br /><br />Add: <input type="text" name="products_id[6]" value="0" size="4" /><br /><br /></th>
   <th class="centerBoxContentsProducts centeredContent back" style="width:50%;" scope="col" id="listCell0-1"><a href="http://shop.mmm-fruit.com/index.php?main_page=product_info&amp;cPath=2&amp;products_id=7"><img src="images/sushi/su****ogo_01.jpg" alt="Sushi to Go Set" title=" Sushi to Go Set " width="100" height="60" /></a><br><h3 class="itemTitle"><a href="http://shop.mmm-fruit.com/index.php?main_page=product_info&amp;cPath=2&amp;products_id=7">Sushi to Go Set</a></h3><div class="listingDescription"></div><br>$25.00<br /><br />Add: <input type="text" name="products_id[7]" value="0" size="4" /><br /><br /></th>

  </tr>
 
</table>

[kobra]

I was hoping that the author of this mod might chime in with some assistance. This is a strange representation of this. You have attempted several settings with varying results and some are not at all expected. As this requires a sql patch to enable I am not positive of how to back it out so that one could start over and re-install.

Thank you for trying the width adjustment, sorry that this was not the issue.

Having used this personally several times(not 1.3.0.2 yet) I would venture to say that there is something that is not set/installed correctly. 1.3.0.2 I do not think has altered the code areas that this uses so the 1.3.x contribution should work correctly.

[DrByte]

I just installed the v1.3.0.2 version of this contribution on a fresh v1.3.0.2 install and cannot reproduce the problem, either with classic or template_default templates.

I recall seeing one other person report similar problem several months ago. I don't recall the exact resolution.


As to the SQL for install/uninstall, there's no harm in leaving the SQL changes in the database. They are just a couple switches used to control column vs row format. Very easy to install/uninstall this mod.

[DrByte]

A URL where we can see this in action might be helpful...

[mmmfruit]

The url for my shop is here: http://shop.mmm-fruit.com/index.php

I apologize if it loads slowly... I noticed after my new install of ZenCart, anything related to the store runs extremely slowly. Admin, the actual website, everything takes so long to load (I've tried it on both DSL and Cable internet in two different locations); but the rest of my website (not run by ZenCart) loads instantly.

I've used the version for ZenCart 1.2 and it has worked fine.

[goodmorning]

I am also having this problem. The site I am working on is here: http://www.modtomodern.com/shop

In Internet Explorer it loads fine, all four products per row in the product listing, but in Firefox the last product in the first row is split from the rest. I'm not sure why it is doing this! I also changed the width and right/left columns as mmmfruit did, but it did not resolve the problem.

[DrByte]

I think you can "fix" this by making two small edits to the customized product_listing.php module used in the grid-layout mod:

approx line 95 starts with:

  // Used for Column Layout (Grid Layout) add on module
  $column = 0;    
  if (PRODUCT_LISTING_LAYOUT_STYLE == 'columns') {
    if ($num_products_count < PRODUCT_LISTING_COLUMNS_PER_ROW || PRODUCT_LISTING_COLUMNS_PER_ROW == 0 ) {
      $col_width = floor(100/$num_products_count)-1;
    } else {
      $col_width = floor(100/PRODUCT_LISTING_COLUMNS_PER_ROW)-1;
    }
  }
  // Used for Column Layout (Grid Layout) add on module 

replace with:

  // Used for Column Layout (Grid Layout) add on module
  $column = 0;    
  if (PRODUCT_LISTING_LAYOUT_STYLE == 'columns') {
    if ($num_products_count < PRODUCT_LISTING_COLUMNS_PER_ROW || PRODUCT_LISTING_COLUMNS_PER_ROW == 0 ) {
      $col_width = floor(100/$num_products_count)-0.5;
    } else {
      $col_width = floor(100/PRODUCT_LISTING_COLUMNS_PER_ROW)-0.5;
    }
  }
  // Used for Column Layout (Grid Layout) add on module 

Basically, just subtracting 0.5% from the width of each cell, causing FF to render more consistently.

[seethrou]

@ DrByte

Will it something related or not?

Another user had similar probelm but in the index page and in the Freature Products Box. Problem had solved and just for reference.
Please refer to the following link the details
Template Help

.