Horizontal Product Display (also purchased, featured products, category images)

Hopefully this is in the right place.

Does anyone know of a way to change the way sub-categories are displayed? In one of my stores the sub-categories with images are displayed in a single column instead of rows. Here is a live link of the problem:

http://www.authenticlacrosse.com/index.php?main_page=index&cPath=23

Also... this trend of columns instead of rows continues throughout the store.

The "Customers who bought this product also purchased" section underneath the actual product displays in a single column as well, along with the featured products. Here is another example:

Also Purchased

http://www.authenticlacrosse.com/index.php?main_page=product_info&cPath=23_5&products_id=2

Featured Products

http://www.authenticlacrosse.com/index.php?main_page=index&cPath=23

Any help or suggestions would be greatly appreciated.

Thanks a lot

Have you checked in the admin section, configuration -> maximum values ? here you can chose how many columns per row each of these listings will have... if you have this set to "1!, then it will only show a single column.

Try Configuration > Product Info > Also Purchased Products Columns per Row
wounds like you want the default which is three columns per row

Also try Configuration > Images > Product Info - Number of Additional Images per Row

I was looking to change something else and when I changed this setting to zero it made my additional images line up vertically in a single row.

Thanks for the suggestions, no luck yet tho. The values were set to the defaults.

It is weird since the featured products displays correctly on the home page, it is just messed up everywhere else.

I'm pretty sure I have a problem with the stylesheet I'm using. I will play with it and post back.

Does anyone know how to change product image display in category view to display two or three horizontal columns...vs just one single column?

Seems like I used to know how to do this, but can't see it anymore.

It used to be changed like this:
Admin>Config>Product Listing>Product Listing>Layout Style>Toggle Columns or Rows!!

I'm not seeing toggle columns or rows anymore!!??

You need to install this mod:
**
http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=77**

To enable also purchased to show rows and nicely sized images i simply do this...

go into

admin -> configuration -> product info -> Also Purchased Products Columns per Row

and set the number of columns, 3 for me

admin -> configuration -> maximum values -> Also Purchased Products

to set the total number of products, 6 for me

admin -> configuration -> images -> Small Image Width

140 is nice for three in a row for me

in the css style sheet, delete .centerBoxContentsAlsoPurch from the section with the style

{
text-align: center;
clear: both;
}

and this style

.centerBoxContentsAlsoPurch {
text-align: center;
}

and it should all look reasonable as on uksportimports.com

though those pics are different heights, it works well enough to my mind

cheers, Bod

i just tried this with my theme and it doesn't work, what else has happened since the year this was started?

I just tried everything suggested here but it did not work for me either...Did anyone found the solution to displaying also purchased products in one row?...

Ms_X:

I just tried everything suggested here but it did not work for me either...Did anyone found the solution to displaying also purchased products in one row?...

This is what finally worked for me...all done i the .css file for the theme you are using and if you change templates then you must redo it to that templates stylesheet.css

find and remove:
.centerBoxContentsAlsoPurch

add below that section:

.centerBoxContentsAlsoPurch {
float:left;
}

this will make the images in the "also purchased" block be in a row.

to make new products images be in a row:

Find and remove:
.centerBoxContentsNew

** then place under that section:**
.centerBoxContentsNew
{
float:left;
}

Can't seem to get my "Customers who bought this product also purchased..." box to display Items the way i want.

All Items are showing in a column instead of a row. I've tried all the obvious settings within Admin, but none seem to work.

Any help would be appreciated!:yes: I'd like it to display 3 (maybe 4) items per ROW.

Here is a LINK to show how it's currently displaying items.

Thanks in advance!

B-G-H:

Can't seem to get my "Customers who bought this product also purchased..." box to display Items the way i want.

All Items are showing in a column instead of a row. I've tried all the obvious settings within Admin, but none seem to work.

Any help would be appreciated!:yes: I'd like it to display 3 (maybe 4) items per ROW.

Here is a LINK to show how it's currently displaying items.

Thanks in advance!

In your templates style.css file---this is what I was told to do for the naughty box:

to make new products images be in a row:

Find and remove:
.centerBoxContentsNew

** then place under that same section:**
.centerBoxContentsNew
{
float:left;
}

Thanks for the reply.

If I search for what you have described, and also ".centerBoxContentsAlsoPurch" I come up with multiple references. Am I to remove all of them? If so, where do I then add the extra code?

Also FWIW. I'm using the EZBlue templete, on the latest release of Zencart.

Thanks again.

B-G-H:

Thanks for the reply.

If I search for what you have described, and also ".centerBoxContentsAlsoPurch" I come up with multiple references. Am I to remove all of them? If so, where do I then add the extra code?

Also FWIW. I'm using the EZBlue templete, on the latest release of Zencart.

Thanks again.

good question...had to look at mine:

this is the entire section that I removed that line from in my template :

.centerBoxContents, .specialsListBoxContents, .centerBoxContentsAlsoPurch, .categoryListBoxContents,
.attribImg {
float: left;
line-height: 1.6em;
}

then I added the portion right below it to look like this:

/center subcategories/
.centerBoxContents, .specialsListBoxContents,
.categoryListBoxContents,
.attribImg {
float: left;
line-height: 1.6em;
}

.centerBoxContentsAlsoPurch {

float:left;
}

in your template it looks like this--remove the red from there then add the code I gave you directly below--so it looks like mine above:

#logo, .centerBoxContents, .specialsListBoxContents, .categoryListBoxContents, .centerBoxContentsAlsoPurch, .attribImg {
margin: 0em;
text-align: center;
padding-top: 0px;
}

of course someone will chime in if this is wrong but that is what I did in mine