Forums / Templates, Stylesheets, Page Layout / product listing .. each item w/ own BG_COLOR

product listing .. each item w/ own BG_COLOR

Locked

Views: 3,142

Results 1 to 11 of 11
This thread is locked. New replies are disabled.
16 May 2006, 12:14 AM
#1
sgt_why avatar

sgt_why

New Zenner

Join Date:
Sep 2005
Posts:
25
Plugin Contributions:
0

product listing .. each item w/ own BG_COLOR

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">  <a href="http://www.raindropsoap.com/index.php?main_page=product_info&cPath=1&products_id=42"> <img src="images/jasminestar.jpg" border="0" alt="Jasmine Star" title=" Jasmine Star " width="200" height="187" /> </a>   </td> <td class="productListing-data">   <a href="http://www.raindropsoap.com/index.php?main_page=product_info&cPath=1&products_id=42"> <img src="/images/names/jasmine.jpg" align="center" alt="Jasmine Star" /> </a>   </td> <td class="productListing-data"> </td> <td class="productListing-data"> </td> <td align="right" class="productListing-data">  $5.00<br /> <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> ...

Thanks,
Jeff

"If you succeed at all that you do, then you're not trying hard enough."
check out my Zencart: http://www.raindropsoap.com

16 May 2006, 12:23 AM
#2
sgt_why avatar

sgt_why

New Zenner

Join Date:
Sep 2005
Posts:
25
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

heres is a firefox screen shot ..

Thanks,
Jeff

"If you succeed at all that you do, then you're not trying hard enough."
check out my Zencart: http://www.raindropsoap.com

16 May 2006, 12:24 AM
#3
sgt_why avatar

sgt_why

New Zenner

Join Date:
Sep 2005
Posts:
25
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

and now a IE screen shot ..

Thanks,
Jeff

"If you succeed at all that you do, then you're not trying hard enough."
check out my Zencart: http://www.raindropsoap.com

16 May 2006, 3:58 AM
#4
seethrou avatar

seethrou

Totally Zenned

Join Date:
May 2004
Location:
Hong Kong
Posts:
1,156
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

Will the following give you some idea?

For Product Listings Css Problem V1.3.1

.

A New Starter again

17 May 2006, 5:09 AM
#5
sgt_why avatar

sgt_why

New Zenner

Join Date:
Sep 2005
Posts:
25
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

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.

Thanks,
Jeff

"If you succeed at all that you do, then you're not trying hard enough."
check out my Zencart: http://www.raindropsoap.com

17 May 2006, 7:25 AM
#6
seethrou avatar

seethrou

Totally Zenned

Join Date:
May 2004
Location:
Hong Kong
Posts:
1,156
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

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

A New Starter again

17 May 2006, 9:25 AM
#7
aspudden avatar

aspudden

Zen Follower

Join Date:
Dec 2004
Location:
Stockholm
Posts:
113
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

nice ..
Asp

Employing version 1.3.X

18 Jun 2006, 6:02 PM
#8
amandad avatar

amandad

New Zenner

Join Date:
Jun 2006
Posts:
10
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

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.

18 Jun 2006, 6:34 PM
#9
ajeh avatar

ajeh

Oba-san

Join Date:
Sep 2003
Location:
Ohio
Posts:
62,757
Plugin Contributions:
1

Re: product listing .. each item w/ own BG_COLOR

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

You can customize this in your stylesheet ...

Linda McGrath
If you have to think ... you haven't been zenned ...

**Did YOU buy the Zen Cart Team a cup of coffee and a donut today? Just click here to support the Zen Cart Team!!**

Are you using the latest? Perhaps you've a problem that's fixed in the latest version: [Upgrade today!]
Officially PayPal-Certified! Just click here

Try our Zen Cart Recommended Services - Hosting, Payment and more ...
Signup for our Announcements Forums to stay up to date on important changes and updates!

18 Jun 2006, 7:50 PM
#10
amandad avatar

amandad

New Zenner

Join Date:
Jun 2006
Posts:
10
Plugin Contributions:
0

Re: product listing .. each item w/ own BG_COLOR

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. :smile:

19 Jun 2006, 12:30 AM
#11
ajeh avatar

ajeh

Oba-san

Join Date:
Sep 2003
Location:
Ohio
Posts:
62,757
Plugin Contributions:
1

Re: product listing .. each item w/ own BG_COLOR

There are numerous classes and such that are in the code so that you can easily apply them to your stylesheet ...

But they are not all in the stylesheet as it would be a monster ... :smile:

Linda McGrath
If you have to think ... you haven't been zenned ...

**Did YOU buy the Zen Cart Team a cup of coffee and a donut today? Just click here to support the Zen Cart Team!!**

Are you using the latest? Perhaps you've a problem that's fixed in the latest version: [Upgrade today!]
Officially PayPal-Certified! Just click here

Try our Zen Cart Recommended Services - Hosting, Payment and more ...
Signup for our Announcements Forums to stay up to date on important changes and updates!