product listing .. each item w/ own BG_COLOR

[sgt_why]

I've made changes to the product_listing.php, so each item listed has its own BGCOLOR instead of the defaults ..

.. I wasnt sure how to add variables to each item -- so I created a "manufacturer" for each BG_COLOR and assigned them to the items.

then, turned on MANUFACTURER in the product listing .. so it would show up.

heres code to stop MAN. from showing up on listing;
(if i turned it off in the admin section, i cant reference its values .. so had to turn it on, but dont want it to show on screen)

[before]
case 'PRODUCT_LIST_MANUFACTURER':
$lc_text = TABLE_HEADING_MANUFACTURER;

[after]
case 'PRODUCT_LIST_MANUFACTURER':
// $lc_text = TABLE_HEADING_MANUFACTURER;
$lc_text = ' ';

then, to display each items BG color ...

[before]
if ((($rows-$extra_row)/2) == floor(($rows-$extra_row)/2)) {
$list_box_contents[$rows] = array('params' => 'class="productListing-even"');
} else {
$list_box_contents[$rows] = array('params' => 'class="productListing-odd"');
}

[after]
$bg_color = $listing->fields['manufacturers_name'] ;

if ($bg_color)
{
if ((($rows-$extra_row)/2) == floor(($rows-$extra_row)/2))
{
$list_box_contents[$rows] = array('params' => 'class="productListing-even" style="background-color: ' . $bg_color . '" ');
}
else
{
$list_box_contents[$rows] = array('params' => 'class="productListing-odd" style="background-color: ' . $bg_color . '"');
}
}
else
{
if ((($rows-$extra_row)/2) == floor(($rows-$extra_row)/2)) {
$list_box_contents[$rows] = array('params' => 'class="productListing-even"');
} else {
$list_box_contents[$rows] = array('params' => 'class="productListing-odd"');
}
}

THAT gets the first part (NOTE: works great!!)

.. now for the text description, in my case I wanted to keep the formatted HTML .. not the default raw text.


[before]
$list_box_contents[$rows][] = array('params' => 'class="' . $list_box_description . '" colspan="' . $zc_col_count_description . '"',
'text' => zen_trunc_string(zen_clean_html(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id'])), PRODUCT_LIST_DESCRIPTION));

[after]
$bg_color = $listing->fields['manufacturers_name'] ;

if ($bg_color)
{
$list_box_contents[$rows][] = array('params' => 'class="' . $list_box_description . ' " bgcolor="' . $bg_color . '" colspan="' . $zc_col_count_description . '"',
'text' => zen_trunc_string(zen_get_products_description($listing->fields['products_id']), PRODUCT_LIST_DESCRIPTION));
}
else
{
$list_box_contents[$rows][] = array('params' => 'class="' . $list_box_description . '" colspan="' . $zc_col_count_description . '"',
'text' => zen_trunc_string(zen_get_products_description($listing->fields['products_id']), PRODUCT_LIST_DESCRIPTION));
}

--FINALLY, after all that .. the item descriptions were using the default bg's from the CSS.
unable to find a better method, I added a <div> statement as follows, to change its BG color as well ...
<div style="font-family: Papyrus;font-weight: bold;color: #A63D41;background-color: #FFE1F0; text-align: center" >

Works great in IE, but still shows an odd border in FIREFOX ...

[here is the resulting HTML ..]
<tr class="productListing-even" style="background-color: #FFE1F0" >
<td align="center" class="productListing-data">
&nbsp;<a href="http://www.raindropsoap.com/index.php?main_page=product_info&amp;cPath=1&amp;products_id=42">
<img src="images/jasminestar.jpg" border="0" alt="Jasmine Star" title=" Jasmine Star " width="200" height="187" />
</a>
&nbsp; </td>
<td class="productListing-data">
&nbsp;
<a href="http://www.raindropsoap.com/index.php?main_page=product_info&amp;cPath=1&amp;products_id=42">
<img src="/images/names/jasmine.jpg" align="center" alt="Jasmine Star" />
</a>
&nbsp;
</td>
<td class="productListing-data">
</td>
<td class="productListing-data">
</td>
<td align="right" class="productListing-data">
&nbsp;$5.00<br />&nbsp;<br />Add: <input type="text" name="products_id[42]" value=0 size="4"><br /> </td>
</tr>
<tr >
<td class="productListing-data-description-even style="background-color: #FFE1F0" colspan="5">
<div style="font-family: Papyrus;font-weight: bold;color: #A63D41;background-color: #FFE1F0; text-align: center" >
<p></p>
<p>Cleansing with this soap will leave your skin smelling of a sweet Jasmine flower.<br />
The purple in this soap is infused Eucalyptus oil, known for its deodorizing qualities.<br />
The exotic aroma has long been used in Love Potions & Aphrodesiacs. </p>
</div> </td>
</tr>


ANY suggestions ? is this just a IE / Firefox difference ? Firefox seems to ignore the BG_COLOR if set on the <TD> but uses it for <TR> ...

[sgt_why]

heres is a firefox screen shot ..

[sgt_why]

and now a IE screen shot ..

[seethrou]

Will the following give you some idea?

For Product Listings Css Problem V1.3.1


.

[sgt_why]

thanks, read through the post but im still lost ... it works fine in Internet Explorer.

Just in Firefox, its adding some odd right, left and bottom borders/padding.

(p.s. my shop is running Zen Cart 1.2.6 .. if that makes a difference)

I've went ahead and turned OFF the MAINTENANCE mode .. so now people are free to check it out for themselves.

-----------

also, wonder if it would help others if i posted my modified files I used to create the look I wanted ..

over-rode these files;
includes/modules/<my template>/product_listing.php
includes/tempaltes/<my template>/templates/tpl_product_info_display.php

used the following item variables;
- "MODEL" to hold an image name to be used in place of "ITEM NAME"
- "MANUFACTURER" is the BG_COLOR for each item

to get this to work, first created a Manufacturer "name" for each color, such as #999999 or #FFB062 ... and then assigned these to items for thier BG_COLOR

for the item names, it looks for a filename == item model name ... if found, it displays it in place of the items name .. if not found, then defaults to items name.

[seethrou]

Sorry, the above suggestion only for Zen Cart v1.3.x.

[aspudden]

nice ..
Asp

[AmandaD]

I would like to have 2 alternating colors on my product listing page. Does anyone know how to accomplish this?


Would muchly appreciate any help.

[Ajeh]

The rows are defined using:
productListing-odd
productListing-even

You can customize this in your stylesheet ...

[AmandaD]

Thanks so much for the prompt reply, Linda!


I wasn't sure where to put it, I didn't have those in my stylesheet (maybe they aren't supposed to be there to begin with) so I threw in the following code under

/*Shopping Cart Display*/


.productListing-even

{
background-color: #colorchoice;
}

.productListing-odd
{
background-color: #colorchoice;
}



and it worked like a charm. Yay.