All / New Product Listing - Alternating Colours

Hi,

Does anyone know how I can alternate the background colours for the all products and new products listing. As is stands, the background is white for each listing, which doesn't look too good.

Thanks.

Re: All / New Product Listing - Alternating Colours

Try adding the following to your template's stylesheet

Quote:

.productListing-even {
background-color: #CCCCCC;
}
.productListing-odd {
background-color: #FFFFFF;
}

Alter colours #CCCCCC and #FFFFFF to your own taste
:smile:

Re: All / New Product Listing - Alternating Colours

Thanks for the reply.

The code you gave alternates the colour for the product listing, but when you click to view "All Products", this doesn't have any effect, the background for all listings is white.

Re: All / New Product Listing - Alternating Colours

Unfortunately that particular page doesn't have the productListing-odd and -even styles to it. You could add a style into the table heading on tpl_modules_products_all_listing.php in your template directory and then style out the table in the template stylesheet, but from the way the page formats out, it would require some doing to get to varigate like the -odd and -even setting does.

Re: All / New Product Listing - Alternating Colours

You could try this:

/includes/templates/YOURTEMPLATE/templates/tpl_modules_products_all_listing.php
lines 22-24 have:

PHP Code:

 if ($products_all_split->number_of_rows > 0) { $products_all = $db->Execute($products_all_split->sql_query); while (!$products_all->EOF) {

change to:

PHP Code:

 if ($products_all_split->number_of_rows > 0) { $products_all = $db->Execute($products_all_split->sql_query); $row_counter = 0; while (!$products_all->EOF) { $row_counter++;

line 114 contains:

HTML Code:

<tr>

change to:

PHP Code:

 <tr class="<?php echo ((int)($row_counter/2)==($row_counter/2)) ? 'productListing-even' : 'productListing-odd'; ?>">

Re: All / New Product Listing - Alternating Colours

Quote:

You could try this:

Thanks DrByte, works fine.

Also added below, otherwise colour/s do not cover description of product.
i.e
towards bottom of /includes/templates/YOURTEMPLATE/templates/tpl_modules_products_all_listing.php
find

Code:

<?php if (PRODUCT_ALL_LIST_DESCRIPTION != 0) { ?> <tr> <td colspan="3" valign="top" class="main"> <?php echo $display_products_description; ?> </td> </tr>

Replace with

Code:

<?php if (PRODUCT_ALL_LIST_DESCRIPTION != 0) { ?> <tr class="<?php echo ((int)($row_counter/2)==($row_counter/2)) ? 'productListing-even' : 'productListing-odd'; ?>"> <td colspan="3" valign="top" class="main"> <?php echo $display_products_description; ?> </td> </tr>

Re: All / New Product Listing - Alternating Colours

That worked, excellent.

Thanks DrByte and misty.

Re: All / New Product Listing - Alternating Colours

I've manged to get this to work for me too. Sort of. I have gaps between the tables that I need to get rid of and I thought this would do it but it's not:

Code:

.productListing-even { background-color: #f0f0f0; border-collapse: collapse; }

Also I've moved my description up into a different table cell but it's repeating and I can't figure out why. All I did was move "echo $display_products_description;" to line 183 but if I remove it I get no description at all.

Here's the link

And here's the code for tpl_modules_products_all_listing.php

Code:

<?php /** * Module Template * * Loaded automatically by index.php?main_page=products_all. * Displays listing of All Products * * @package templateSystem * @copyright Copyright 2003-2005 Zen Cart Development Team * @copyright Portions Copyright 2003 osCommerce * @license http://www.zen-cart.com/license/2_0.txt GNU Public License V2.0 * @version $Id: tpl_modules_products_all_listing.php 2951 2006-02-03 07:02:51Z birdbrain $ */ ?> <table border="0" width="100%" cellspacing="2" cellpadding="2"> <tr> <td colspan="3"></td> </tr> <?php $group_id = zen_get_configuration_key_value('PRODUCT_ALL_LIST_GROUP_ID'); if ($products_all_split->number_of_rows > 0) { $products_all = $db->Execute($products_all_split->sql_query); while (!$products_all->EOF) { $row_counter++; if (PRODUCT_ALL_LIST_IMAGE != '0') { $display_products_image = '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '">' . zen_image(DIR_WS_IMAGES . $products_all->fields['products_image'], $products_all->fields['products_name'], IMAGE_PRODUCT_ALL_LISTING_WIDTH, IMAGE_PRODUCT_ALL_LISTING_HEIGHT) . '</a>' . str_repeat(' ', substr(PRODUCT_ALL_LIST_IMAGE, 3, 1)); } else { $display_products_image = ''; } if (PRODUCT_ALL_LIST_NAME != '0') { $display_products_name = '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '">' . $products_all->fields['products_name'] . '</a>' . str_repeat(' ', substr(PRODUCT_ALL_LIST_NAME, 3, 1)); } else { $display_products_name = ''; } if (PRODUCT_ALL_LIST_MODEL != '0' and zen_get_show_product_switch($products_all->fields['products_id'], 'model')) { $display_products_model = TEXT_PRODUCTS_MODEL . $products_all->fields['products_model'] . str_repeat(' ', substr(PRODUCT_ALL_LIST_MODEL, 3, 1)); } else { $display_products_model = ''; } if (PRODUCT_ALL_LIST_WEIGHT != '0' and zen_get_show_product_switch($products_all->fields['products_id'], 'weight')) { $display_products_weight = TEXT_PRODUCTS_WEIGHT . $products_all->fields['products_weight'] . TEXT_SHIPPING_WEIGHT . str_repeat(' ', substr(PRODUCT_ALL_LIST_WEIGHT, 3, 1)); } else { $display_products_weight = ''; } if (PRODUCT_ALL_LIST_QUANTITY != '0' and zen_get_show_product_switch($products_all->fields['products_id'], 'quantity')) { if ($products_all->fields['products_quantity'] <= 0) { $display_products_quantity = TEXT_OUT_OF_STOCK . str_repeat(' ', substr(PRODUCT_ALL_LIST_QUANTITY, 3, 1)); } else { $display_products_quantity = TEXT_PRODUCTS_QUANTITY . $products_all->fields['products_quantity'] . str_repeat(' ', substr(PRODUCT_ALL_LIST_QUANTITY, 3, 1)); } } else { $display_products_quantity = ''; } if (PRODUCT_ALL_LIST_DATE_ADDED != '0' and zen_get_show_product_switch($products_all->fields['products_id'], 'date_added')) { $display_products_date_added = TEXT_DATE_ADDED . ' ' . zen_date_long($products_all->fields['products_date_added']) . str_repeat(' ', substr(PRODUCT_ALL_LIST_DATE_ADDED, 3, 1)); } else { $display_products_date_added = ''; } if (PRODUCT_ALL_LIST_MANUFACTURER != '0' and zen_get_show_product_switch($products_all->fields['products_id'], 'manufacturer')) { $display_products_manufacturers_name = ($products_all->fields['manufacturers_name'] != '' ? TEXT_MANUFACTURER . ' ' . $products_all->fields['manufacturers_name'] . str_repeat(' ', substr(PRODUCT_ALL_LIST_MANUFACTURER, 3, 1)) : ''); } else { $display_products_manufacturers_name = ''; } if ((PRODUCT_ALL_LIST_PRICE != '0' and zen_get_products_allow_add_to_cart($products_all->fields['products_id']) == 'Y') and zen_check_show_prices() == true) { $products_price = zen_get_products_display_price($products_all->fields['products_id']); $display_products_price = TEXT_PRICE . ' ' . $products_price . str_repeat(' ', substr(PRODUCT_ALL_LIST_PRICE, 3, 1)) . (zen_get_show_product_switch($products_all->fields['products_id'], 'ALWAYS_FREE_SHIPPING_IMAGE_SWITCH') ? (zen_get_product_is_always_free_shipping($products_all->fields['products_id']) ? TEXT_PRODUCT_FREE_SHIPPING_ICON . ' ' : '') : ''); } else { $display_products_price = ''; } // more info in place of buy now if (PRODUCT_ALL_BUY_NOW != '0' and zen_get_products_allow_add_to_cart($products_all->fields['products_id']) == 'Y') { if (zen_has_product_attributes($products_all->fields['products_id'])) { $link = '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>'; } else { // $link= '<a href="' . zen_href_link(FILENAME_PRODUCTS_ALL, zen_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $products_all->fields['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT) . '</a>'; if (PRODUCT_ALL_LISTING_MULTIPLE_ADD_TO_CART > 0) { // $how_many++; $link = TEXT_PRODUCT_ALL_LISTING_MULTIPLE_ADD_TO_CART . "<input type=\"text\" name=\"products_id[" . $products_all->fields['products_id'] . "]\" value=\"0\" size=\"4\" />"; } else { $link = '<a href="' . zen_href_link(FILENAME_PRODUCTS_ALL, zen_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $products_all->fields['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT) . '</a> '; } } $the_button = $link; $products_link = '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>'; $display_products_button = zen_get_buy_now_button($products_all->fields['products_id'], $the_button, $products_link) . ' ' . zen_get_products_quantity_min_units_display($products_all->fields['products_id']) . str_repeat(' ', substr(PRODUCT_ALL_BUY_NOW, 3, 1)); } else { $link = '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>'; $the_button = $link; $products_link = '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>'; $display_products_button = zen_get_buy_now_button($products_all->fields['products_id'], $the_button, $products_link) . ' ' . zen_get_products_quantity_min_units_display($products_all->fields['products_id']) . str_repeat(' ', substr(PRODUCT_ALL_BUY_NOW, 3, 1)); } if (PRODUCT_ALL_LIST_DESCRIPTION != '0') { $disp_text = zen_get_products_description($products_all->fields['products_id']); $disp_text = zen_clean_html($disp_text); $display_products_description = stripslashes(zen_trunc_string($disp_text, 150, '<a href="' . zen_href_link(zen_get_info_page($products_all->fields['products_id']), 'products_id=' . $products_all->fields['products_id']) . '"> ' . MORE_INFO_TEXT . '</a>')); } else { $display_products_description = ''; } ?> <tr class="<?php echo ((int)($row_counter/2)==($row_counter/2)) ? 'productListing-even' : 'productListing-odd'; ?>"> <td width="<?php echo IMAGE_PRODUCT_ALL_LISTING_WIDTH + 10; ?>" valign="top" class="main" align="center"> <?php $disp_sort_order = $db->Execute("select configuration_key, configuration_value from " . TABLE_CONFIGURATION . " where configuration_group_id='" . $group_id . "' and (configuration_value >= 1000 and configuration_value <= 1999) order by LPAD(configuration_value,11,0)"); while (!$disp_sort_order->EOF) { if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_IMAGE') { echo $display_products_image; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_QUANTITY') { echo $display_products_quantity; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_BUY_NOW') { echo $display_products_button; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_NAME') { echo $display_products_name; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_MODEL') { echo $display_products_model; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_MANUFACTURER') { echo $display_products_manufacturers_name; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_PRICE') { echo $display_products_price; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_WEIGHT') { echo $display_products_weight; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_DATE_ADDED') { echo $display_products_date_added; } $disp_sort_order->MoveNext(); } ?> </td> <td colspan="2" valign="top" class="main"> <?php $disp_sort_order = $db->Execute("select configuration_key, configuration_value from " . TABLE_CONFIGURATION . " where configuration_group_id='" . $group_id . "' and (configuration_value >= 2000 and configuration_value <= 2999) order by LPAD(configuration_value,11,0)"); while (!$disp_sort_order->EOF) { if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_IMAGE') { echo $display_products_image; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_QUANTITY') { echo $display_products_quantity; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_BUY_NOW') { echo $display_products_button; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_NAME') { echo $display_products_name; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_MODEL') { echo $display_products_model; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_MANUFACTURER') { echo $display_products_manufacturers_name; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_PRICE') { echo $display_products_price; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_WEIGHT') { echo $display_products_weight; } if ($disp_sort_order->fields['configuration_key'] == 'PRODUCT_ALL_LIST_DATE_ADDED') { echo $display_products_date_added; } $disp_sort_order->MoveNext(); echo $display_products_description; } ?> </td> </tr> <?php if (PRODUCT_ALL_LIST_DESCRIPTION != 0) { ?> <tr class="<?php echo ((int)($row_counter/2)==($row_counter/2)) ? 'productListing-even' : 'productListing-odd'; ?>"> <td colspan="3" valign="top" class="main"> <?php ?> </td> </tr> <?php } ?> <tr> <td colspan="3"></td> </tr> <?php $products_all->MoveNext(); } } else { ?> <tr> <td class="main" colspan="2"><?php echo TEXT_NO_ALL_PRODUCTS; ?></td> </tr> <?php } ?> </table>

Thanks.

Re: All / New Product Listing - Alternating Colours

As answered questions related to this topic repeatedly in other thereads, give below cross reference for the other thread.
Hope it helps more.

Product Listed to close together

It related to Product Listing display effect and setting.

Re: All / New Product Listing - Alternating Colours

Hi,
Can please help on products_all layout ..I installed column layout mod which is really nice..But when i select all products it doesn't change to columns. Most of them told its not possible.
So anyother way to do it? or css for all products layout? is there any solution? pls help..!!!