Product Grid

A simple grid layout for the product pages of Zen Cart. This modification uses the already built in rows and columns functionality so there are no core changes needed.

Changes to number of columns can all be made in CSS through the width of the main area.

!! MOD submitted, pending approval !!

Mod is now available for download.
AV Product Grid

Hey guys,

Fantastic mod, it looks well. One question though, when I edit the CSS the grid goes from 3 columns to 2 columns as it edits the width of the outer container.

Is there any way to decrease the width of the individual product containers to let the module show 3 columns on a narrower body? Hope that makes sense!

Glad you like it and I hope it works well for you.

To make the change you are wanting change the width of the #gridProduct

#gridProduct{
border: 1px solid;
border-color: #333;
width:200px;
/* set height so text does not overlap */
height:300px;
margin:5px;
margin-left:10px;
padding:5px;
float:left;
overflow:hidden;
}

This mod is simple and looks great with plenty of CSS styling available! Alas, I do have an issue and would really appreciate any help.
After install, my products do appear as grid items, but there is an additional grid appearing at the end that contains the word "Products".
Nothing else, just the word "Products". The particulars:
Zen Cart v1.50 New Install.
Site is being built offline using easyPHP.
Site has custom footers, but the product listing files are stock.
I did carefully copy over and overwrite the AVGrid files.
I am not a complete newbie at any of this, but this one is beating me. Here is a screen shot of the random "Products" text appearing:
Attachment #10142
(I gave the class id divs some quick [and ... yes ... ugly] background colors just to see where they go)

A look at the page source code shows the word "Products":
Attachment #10143

Lastly, I believe the solution for me is located somewhere around here in the tpl_columnar_display.php file (but I could be way off base):
Attachment #10144
My knowledge of PHP is rudimentary, but growing daily. heh. No matter how much I edit this section of the PHP file I either have ALL the products disappear or I have the word "Products" disappear but the div it uses still remains.

Any suggestions would be so very appreciated. I love the simple elegance of this product grid and really hope some solution is possible!
Thank you for any effort you can make on my behalf.
Sincerely, Gregory Gray

Can you tell me the Mods you have added. I have tested this on a Zen 1.5 setup and I am not seeing that label.

tpl_columnar_display.php is not a file that this MOD uses so it is leading me to believe that something else was changed. The only files that this MOD changes are common/tpl_product_columns.php, templates/tpl_modules_product_listing.php, and CSS/stylesheet_AVgrid.css.

I would be happy to trouble shoot it with you if the store is online where I can see it.

tpl_product_columns.php still has the tpl_columnar_display.php identification in its head comments.

The "Products" is text content for the #productGrid div, which encloses all of the #gridProduct items but as they are floated left without a clearing element at the bottom it has only the height the text requires. The #gridProduct elements extend down beyond their container.

Somehow the $title variable is getting a value of 'Products' when it normally is empty or null.

Hi,

I am using the Blue Cart, from Bling Themes with Zencart Version: v1.3.9h which is a one column theme. After installing AV product Grid I get the following behavior.

Above the third column a heading for the last side-box will appear (for example "Information") and then it shoves that column down. (See attached pic) I tried tackling this problem by working with single column status and others in the side-box layout controller, but that will not work because of the single column status of this theme. It renders the box invisible if I change those settings.

It seems rather obvious that my other addon would not effect this but I have Easy Populate installed.

Any ideas?

Thanks!

It's very difficult to diagnose a styling issue from a screenshot - we really need to see it live to figure out what is happening.
Blue Cart is a two-column template (main + sidebar), not single column.
A "single column" template would not have any sideboxes active; the "single column" setting in the Layout Boxes Controller is non-functional, intended for future development.

gjh42:

It's very difficult to diagnose a styling issue from a screenshot - we really need to see it live to figure out what is happening.
Blue Cart is a two-column template (main + sidebar), not single column.
A "single column" template would not have any sideboxes active; the "single column" setting in the Layout Boxes Controller is non-functional, intended for future development.

Thanks for the reply. sorry, meant one column on the side box (thanks for correcting me). Been using Zencart some time now on multiple projects so I am pretty familiar with it, just thought maybe someone else had encountered it since this is the only thing it is doing wrong (pulling that last sidebox header name over) .

I will figure it out or not use it.

Great mod, thanks alot!
I'd like to have the same mod on the specials page as well, is that possible somehow?
http://webbhjalpen.com/kund/billyandi/index.php?main_page=index&cPath=1&zenid=t31s307v27dc7jec5vdbk3gqi5 - Category overview with AV Product Grid.
http://webbhjalpen.com/kund/billyandi/index.php?main_page=specials - Specials page where i'd like to have AV Product Grid as well.

Specials have a sort of grid but the image sizes are wrong, it takes the sizes from Small Image.
Is it possible to switch the image sizes so it takes the size from Image - Product Listing Width/Height?

Thanks!

fwood:

Thanks for the reply. sorry, meant one column on the side box (thanks for correcting me). Been using Zencart some time now on multiple projects so I am pretty familiar with it, just thought maybe someone else had encountered it since this is the only thing it is doing wrong (pulling that last sidebox header name over) .

I will figure it out or not use it.

Not sure if you got this solved but I had the same issue. It is in tpl_product_columns.php. Simply comment out 'echo $title;' on line 20.
Change This: ```

To This: ```
<?php //echo $title; ?>

Hope it helps anyone else with this issue :)

I need some assistance...

I have installed the mod and I love it...But i would like to have more than just 1 row of products. How can I achieve this?

http://www.sarai-sarai.com/boutique/

Nevermind, fixed the last issue.

Another question. I would like the information under my products in my product categories to look how it does on my Sale/Specials page. (the font, text, and add to cart button) Any advice on how to do this?

https://sarai-sarai.com/boutique/index.php?main_page=specials

http://sarai-sarai.com/boutique/index.php?main_page=index&cPath=34

still looking for help. How can I replace the "...more info" with an add to cart button, just like my specials page. I would also like the product image to be aligned to the center, but I am having an issue figuring that out as well.

Phaylon:

Not sure if you got this solved but I had the same issue. It is in tpl_product_columns.php. Simply comment out 'echo $title;' on line 20.
Change This: ```

> To This: ```
<?php //echo $title; ?>

Hope it helps anyone else with this issue :)

Yes I have had the same problem and that is the fix.
Thanks very much