Grid Layout Assistance Needed

[gjh42]

.centerBoxWrapperContents table {border: 1px dotted #555555;}

Adjust as required.

You appear to have gotten the listing elements nicely centered already.

[gee38l]

.centerBoxWrapperContents table {border: 1px dotted #555555;}

Adjust as required.

You appear to have gotten the listing elements nicely centered already.

Ok i added that to the stylesheet but all that does is add a box around the entire products page not the individual products?

[gjh42]

OK... a really close look at the Dealsdirect site (faint lines!) shows that what you are after is not a solid grid, but separate boxes around each product, with space between them.

Sorry for all the running around; all you need for this is to specify the border on .centerBoxContentsProducts, as well as height and a margin:

.centerBoxContentsProducts {border: 1px solid #999999; margin: 3px; height: 260px;}

Since this will make the products add up to wider than the space available, you will need to edit a file to reduce the assigned width of products. I'll have to go look that up and get back.

[gjh42]

In your Column Grid version of /includes/modules/your_template/product_listing.php, find this section:

// 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;
    }
  } 

and change both instances of
floor(100/...) - 0.5
to
floor(100/...) - 1.5

// 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.5;
    } else {
      $col_width = floor(100/PRODUCT_LISTING_COLUMNS_PER_ROW) - 1.5;
    }
  } 

Adjust the 1.5 as required to work with the margin you want.

There are several ways you can tweak this calculation; experiment if you wish once you understand the logic.

[gee38l]

In your Column Grid version of /includes/modules/your_template/product_listing.php, find this section:

// 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;
    }
  } 

and change both instances of
floor(100/...) - 0.5
to
floor(100/...) - 1.5

// 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.5;
    } else {
      $col_width = floor(100/PRODUCT_LISTING_COLUMNS_PER_ROW) - 1.5;
    }
  } 

Adjust the 1.5 as required to work with the margin you want.

There are several ways you can tweak this calculation; experiment if you wish once you understand the logic.

Thanks for the advise can i just ask what exactly does the above do? I have been playing around with it for the past hour and i have not seen any changes :S

Also i have any question if you have a look at the picture a have attached of the new products you will see that they dont size properly how can i get them to stay the same size all the time evenly spread vertically and horizontally like the products in my categories and dealsdirect?

[gee38l]

It seems that doing the mod to product listing you mentioned above has made the products go to the left in ie7 and not firefox

[gjh42]

The calculation sets the percent width for the individual products. Changing from 0.5 to 1.5 means only a 1% change (about 5px) per item, so you might not notice it. It will probably make no difference anyway with the Column Divider Pro mod still installed; that change is needed when using the plain Column Layout Grid mod.

The product varying width issue may be due to modifying the CDP code. I don't know how that code works in detail, so can't advise on it. If you still want to use that mod, I suggest you post in its support thread for help; otherwise, uninstall it and install just Column Grid, and see if that clears up the problem. It will give you smaller gutters between the products, at any rate.