Display # Of Products Per Row (viewcat.tpl, Viewcat.inc.php)

[Guest slysop]

Hello everyone.

I was searching the forum to find out how to select how many products I want to display per row in my view category page (viewCat.tpl)

Here is what you need to do.

Find this line in viewCat.inc.php

for ($i=0; $i<count($productResults); $i++){

Best to do a find and past the above in and do a find all + Just a note

Do not delete anything

Once you find that line add this just above it.

//this is the number of products you want to display per row.

$productsAcross=4;

Now just below for ($i=0; $i<count($productResults); $i++){

insert the below line of code right below for ($i=0; $i<count($productResults); $i++){

// Adding num of products per row if less than 4 do not do anything if there are 4 displayed

// add a CSS clear:both to delete the Float left/float right

// This will keep all your products spaced just as you want them.

if (!(($i+1) % $productsAcross)) {

$view_cat->assign("SIMP_DIV"," <br style=\"clear:both;\"/>");

} else {

$view_cat->assign("SIMP_DIV","");

}

INSIDE YOUR viewCat.tpl Do this

Here is the product code.

My Div element will look different than yours.

Just pay close attention to where I am placing the

{SIMP_DIV}

<!-- BEGIN: productTable -->

<!-- BEGIN: products -->

<div>

YOUR PRODUCT DISPLAY INFO

<div>

{SIMP_DIV}<!-- PUT THIS BELOW YOUR PRODUCT DIV. THIS PHP CODE PLACER INPUTES A BALNK VAR OR PUTS IN A CSS CLEAR BOTH-->

<!-- END: products -->

<br clear="all" />

<!-- END: productTable -->

There you have it. The code I was looking at to figure this out used tables.

When I displayed only two products they were spaced out really far. So this example keeps your products spaced out according to your CSS code.

Let me know what yall think.

Thanks

Wes Duff

[Robsta]

Or just go into Admin > General Settings and change the number of products per page.

[Guest Blue Baldur]

I can't make this work. I want 2 items per row. ( initally I only had 1 per row )

This is what i tried. What did I do wrong?

viewCat.inc.php

## repeated region

if ($productResults) {

//this is the number of products you want to display per row.

$productsAcross=2;

for ($i=0; $i<count($productResults); $i++) {

// Adding num of products per row if less than 4 do not do anything if there are 4 displayed

// add a CSS clear:both to delete the Float left/float right

// This will keep all your products spaced just as you want them.

if (!(($i+1) % $productsAcross)) {

$view_cat->assign("SIMP_DIV"," <br style=\"clear:both;\"/>");

} else {

$view_cat->assign("SIMP_DIV","");

}

viewCat.tpl

<!-- BEGIN: buy_btn -->

<input type="hidden" name="add" value="{PRODUCT_ID}" />

<input type="hidden" name="quan" value="1" /><a href="java script:submitDoc('prod{PRODUCT_ID}');" target="_self" class="txtButton">{BTN_BUY}</a><!-- END: buy_btn -->

<a href="index.php?_a=viewProd&amp;productId={PRODUCT_ID}" target="_self" class="txtButton">{BTN_MORE}</a></form></td>

{SIMP_DIV}

</tr>

<!-- END: products -->

<br clear="all" />

</table>

<!-- END: productTable -->

Thanks/

Bo

Hello everyone.

I was searching the forum to find out how to select how many products I want to display per row in my view category page (viewCat.tpl)

Here is what you need to do.

Find this line in viewCat.inc.php

for ($i=0; $i<count($productResults); $i++){

Best to do a find and past the above in and do a find all + Just a note

Do not delete anything

Once you find that line add this just above it.

//this is the number of products you want to display per row.

$productsAcross=4;

Now just below for ($i=0; $i<count($productResults); $i++){

insert the below line of code right below for ($i=0; $i<count($productResults); $i++){

// Adding num of products per row if less than 4 do not do anything if there are 4 displayed

// add a CSS clear:both to delete the Float left/float right

// This will keep all your products spaced just as you want them.

if (!(($i+1) % $productsAcross)) {

$view_cat->assign("SIMP_DIV"," <br style=\"clear:both;\"/>");

} else {

$view_cat->assign("SIMP_DIV","");

}

INSIDE YOUR viewCat.tpl Do this

Here is the product code.

My Div element will look different than yours.

Just pay close attention to where I am placing the

{SIMP_DIV}

<!-- BEGIN: productTable -->

<!-- BEGIN: products -->

<div>

YOUR PRODUCT DISPLAY INFO

<div>

{SIMP_DIV}<!-- PUT THIS BELOW YOUR PRODUCT DIV. THIS PHP CODE PLACER INPUTES A BALNK VAR OR PUTS IN A CSS CLEAR BOTH-->

<!-- END: products -->

<br clear="all" />

<!-- END: productTable -->

There you have it. The code I was looking at to figure this out used tables.

When I displayed only two products they were spaced out really far. So this example keeps your products spaced out according to your CSS code.

Let me know what yall think.

Thanks

Wes Duff

[Guest estelle]

Just a suggestion - with good CSS you wouldn't need to change any PHP code. Have a look at the CubeCart 4 KitaBlue skin, the products on the homepage can be displayed in multiple lines, and the latest products always fill 100% of the area (i.e. the spacing between the products changes when the page is resized).

[Guest Aaron-8]

I am having trouble getting this to work in Cubecart 4...I need to set it to 3 products per row then force to a next row to make 9 products a page.

For some reason the TDs are staying in one line instead of going down to the next row.

Anyone have any idea?

[Guest]

Just a suggestion - with good CSS you wouldn't need to change any PHP code. Have a look at the CubeCart 4 KitaBlue skin, the products on the homepage can be displayed in multiple lines, and the latest products always fill 100% of the area (i.e. the spacing between the products changes when the page is resized).

Excellent suggestion, Estelle. Trying to do page layout in the PHP code isn't the best approach for a number of reasons.

However, I also understand that different people think differently, and what makes sense to one person may not make sense to someone else. Having several options available to choose from gives those who think in PHP rather than CSS a direct means of customizing their shops.

As a recovering table-user, CSS has taken me a while to grasp. However, the more I learn, the more I realize that it's possible to do just about ANYTHING with good CSS.

[Guest pamelafarber]

is there any other way of doing it? i just tried it twice and it will not work on my cart it just shows errors.