How do I add a unique css class (or html id) to product listing items?
I'm using the grid layout and want to add a unique class or id to the product listing div on a category page.. I've tried editing product_listing.php but I can't figure it out. I am an html/css expert, but a total hack when it comes to php and scripting.
This code is from my product_listing.php
Code:
// Following code will be executed only if Column Layout (Grid Layout) option is chosen
if (PRODUCT_LISTING_LAYOUT_STYLE == 'columns') {
$lc_text = implode('<br />', $product_contents);
$list_box_contents[$rows][$column] = array('params' => 'class="centerBoxContentsProducts back"' . ' ' . 'id="I want to add a unique ID here but need help!!!!!"' ,
'text' => $lc_text);
$column ++;
if ($column >= PRODUCT_LISTING_COLUMNS_PER_ROW) {
$column = 0;
$rows ++;
}
}
// End of Code fragment for Column Layout (Grid Layout) option in add on module
my site:
http://www.cynthiadesser.com/store/i...2rkumus5llf512
Any help would be greatly appreciated!!! Thanks!
Re: How do I add a unique css class (or html id) to product listing items?
Please be more specific about exactly what you are trying to acheive
Re: How do I add a unique css class (or html id) to product listing items?ftp://ftp.a
Thanks,
I want to add a class or id to the div that contains the product image and info on the product listing (category) page. Please see the picture below. It shows the div I'd like to be able to target with css. To do this I'd like to have a unique class or ID be attributed to each div.
Currently the div looks like this:
Code:
<div class="centerBoxContentsProducts back" id="">
what I want is something like this:
Code:
<div class="centerBoxContentsProducts back" id="A_Unique_ID">
The ID (or class) needs to be unique for each div, so it should probably come from the products_id? I just don't know how to make it happen with PHP.
Hope this helps! Thanks!!!
B
http://atlanticdesignsolutions.com/images/shoter.png
Re: How do I add a unique css class (or html id) to product listing items?ftp://ftp.a
Code:
<div class="centerBoxContentsProducts back" id="<?php echo $listing->fields['products_id'] ?>">
Re: How do I add a unique css class (or html id) to product listing items?
As ID tokens should start with a letter, I recommend tweaking the above to
Code:
<div class="centerBoxContentsProducts back" id="p<?php echo $listing->fields['products_id'] ?>">
Re: How do I add a unique css class (or html id) to product listing items?
Thanks for your help.. Its still not working. I'm editing the file product_listing.php.. the code I'm editing is on line 240. When I try to add the PHP it messes up and no products load.
Here's the code in its entirety
Code:
<?php
/**
* product_listing module
*
* @package modules
* @copyright Copyright 2003-2007 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: product_listing.php 6787 2007-08-24 14:06:33Z drbyte $
* UPDATED TO WORK WITH COLUMNAR PRODUCT LISTING For Zen Cart v1.3.6 - 10/25/2006
*/
if (!defined('IS_ADMIN_FLAG')) {
die('Illegal Access');
}
// Column Layout Support originally added for Zen Cart v 1.1.4 by Eric Stamper - 02/14/2004
// Upgraded to be compatible with Zen-cart v 1.2.0d by Rajeev Tandon - Aug 3, 2004
// Column Layout Support (Grid Layout) upgraded for v1.3.0 compatibility DrByte 04/04/2006
//
if (!defined('PRODUCT_LISTING_LAYOUT_STYLE')) define('PRODUCT_LISTING_LAYOUT_STYLE','rows');
if (!defined('PRODUCT_LISTING_COLUMNS_PER_ROW')) define('PRODUCT_LISTING_COLUMNS_PER_ROW',3);
$row = 0;
$col = 0;
$list_box_contents = array();
$title = '';
$max_results = (PRODUCT_LISTING_LAYOUT_STYLE=='columns' && PRODUCT_LISTING_COLUMNS_PER_ROW>0) ? (PRODUCT_LISTING_COLUMNS_PER_ROW * (int)(MAX_DISPLAY_PRODUCTS_LISTING/PRODUCT_LISTING_COLUMNS_PER_ROW)) : MAX_DISPLAY_PRODUCTS_LISTING;
$show_submit = zen_run_normal();
$listing_split = new splitPageResults($listing_sql, $max_results, 'p.products_id', 'page');
$zco_notifier->notify('NOTIFY_MODULE_PRODUCT_LISTING_RESULTCOUNT', $listing_split->number_of_rows);
$how_many = 0;
// Begin Row Layout Header
if (PRODUCT_LISTING_LAYOUT_STYLE == 'rows') { // For Column Layout (Grid Layout) add on module
$list_box_contents[0] = array('params' => 'class="productListing-rowheading"');
$zc_col_count_description = 0;
$lc_align = '';
for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
switch ($column_list[$col]) {
case 'PRODUCT_LIST_MODEL':
$lc_text = TABLE_HEADING_MODEL;
$lc_align = '';
$zc_col_count_description++;
break;
case 'PRODUCT_LIST_NAME':
$lc_text = TABLE_HEADING_PRODUCTS;
$lc_align = '';
$zc_col_count_description++;
break;
case 'PRODUCT_LIST_MANUFACTURER':
$lc_text = TABLE_HEADING_MANUFACTURER;
$lc_align = '';
$zc_col_count_description++;
break;
case 'PRODUCT_LIST_PRICE':
$lc_text = TABLE_HEADING_PRICE;
$lc_align = 'right' . (PRODUCTS_LIST_PRICE_WIDTH > 0 ? '" width="' . PRODUCTS_LIST_PRICE_WIDTH : '');
$zc_col_count_description++;
break;
case 'PRODUCT_LIST_QUANTITY':
$lc_text = TABLE_HEADING_QUANTITY;
$lc_align = 'right';
$zc_col_count_description++;
break;
case 'PRODUCT_LIST_WEIGHT':
$lc_text = TABLE_HEADING_WEIGHT;
$lc_align = 'right';
$zc_col_count_description++;
break;
case 'PRODUCT_LIST_IMAGE':
$lc_text = TABLE_HEADING_IMAGE;
$lc_align = 'center';
$zc_col_count_description++;
break;
}
if ( ($column_list[$col] != 'PRODUCT_LIST_IMAGE') ) {
$lc_text = zen_create_sort_heading($_GET['sort'], $col+1, $lc_text);
}
$list_box_contents[0][$col] = array('align' => $lc_align,
'params' => 'class="productListing-heading"',
'text' => $lc_text );
}
} // End Row Layout Header used in Column Layout (Grid Layout) add on module
///////////// HEADER ROW ABOVE /////////////////////////////////////////////////
$num_products_count = $listing_split->number_of_rows;
if ($listing_split->number_of_rows > 0) {
$rows = 0;
// 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;
}
}
// Used for Column Layout (Grid Layout) add on module
$listing = $db->Execute($listing_split->sql_query);
$extra_row = 0;
while (!$listing->EOF) {
if (PRODUCT_LISTING_LAYOUT_STYLE == 'rows') { // Used in Column Layout (Grid Layout) Add on module
$rows++;
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"');
}
$cur_row = sizeof($list_box_contents) - 1;
} // End of Conditional execution - only for row (regular style layout)
$product_contents = array(); // Used For Column Layout (Grid Layout) Add on module
for ($col=0, $n=sizeof($column_list); $col<$n; $col++) {
$lc_align = '';
switch ($column_list[$col]) {
case 'PRODUCT_LIST_MODEL':
$lc_align = '';
$lc_text = $listing->fields['products_model'];
break;
case 'PRODUCT_LIST_NAME':
$lc_align = '';
if (isset($_GET['manufacturers_id'])) {
$lc_text = '<h3 class="itemTitle"><a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . (($_GET['manufacturers_id'] > 0 and $_GET['filter_id']) > 0 ? zen_get_generated_category_path_rev($_GET['filter_id']) : ($_GET['cPath'] > 0 ? zen_get_generated_category_path_rev($_GET['cPath']) : zen_get_generated_category_path_rev($listing->fields['master_categories_id']))) . '&products_id=' . $listing->fields['products_id']) . '">' . $listing->fields['products_name'] . '</a></h3><div class="listingDescription">' . zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION) . '</div>' ;
} else {
$lc_text = '<h3 class="itemTitle"><a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . (($_GET['manufacturers_id'] > 0 and $_GET['filter_id']) > 0 ? zen_get_generated_category_path_rev($_GET['filter_id']) : ($_GET['cPath'] > 0 ? zen_get_generated_category_path_rev($_GET['cPath']) : zen_get_generated_category_path_rev($listing->fields['master_categories_id']))) . '&products_id=' . $listing->fields['products_id']) . '">' . $listing->fields['products_name'] . '</a></h3><div class="listingDescription">' . zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION) . '</div>';
}
break;
case 'PRODUCT_LIST_MANUFACTURER':
$lc_align = '';
$lc_text = '<a href="' . zen_href_link(FILENAME_DEFAULT, 'manufacturers_id=' . $listing->fields['manufacturers_id']) . '">' . $listing->fields['manufacturers_name'] . '</a>';
break;
case 'PRODUCT_LIST_PRICE':
$lc_price = zen_get_products_display_price($listing->fields['products_id']) . '<br />';
$lc_align = 'right';
$lc_text = $lc_price;
// more info in place of buy now
$lc_button = '';
if (zen_has_product_attributes($listing->fields['products_id']) or PRODUCT_LIST_PRICE_BUY_NOW == '0') {
$lc_button = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . (($_GET['manufacturers_id'] > 0 and $_GET['filter_id']) > 0 ? zen_get_generated_category_path_rev($_GET['filter_id']) : ($_GET['cPath'] > 0 ? $_GET['cPath'] : zen_get_generated_category_path_rev($listing->fields['master_categories_id']))) . '&products_id=' . $listing->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>';
} else {
if (PRODUCT_LISTING_MULTIPLE_ADD_TO_CART != 0) {
if (
// not a hide qty box product
$listing->fields['products_qty_box_status'] != 0 &&
// product type can be added to cart
zen_get_products_allow_add_to_cart($listing->fields['products_id']) != 'N'
&&
// product is not call for price
$listing->fields['product_is_call'] == 0
&&
// product is in stock or customers may add it to cart anyway
($listing->fields['products_quantity'] > 0 || SHOW_PRODUCTS_SOLD_OUT_IMAGE == 0) ) {
$how_many++;
}
// hide quantity box
if ($listing->fields['products_qty_box_status'] == 0) {
$lc_button = '<a href="' . zen_href_link($_GET['main_page'], zen_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $listing->fields['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT, 'class="listingBuyNowButton"') . '</a>';
} else {
$lc_button = TEXT_PRODUCT_LISTING_MULTIPLE_ADD_TO_CART . "<input type=\"text\" name=\"products_id[" . $listing->fields['products_id'] . "]\" value=\"0\" size=\"4\" />";
}
} else {
// qty box with add to cart button
if (PRODUCT_LIST_PRICE_BUY_NOW == '2' && $listing->fields['products_qty_box_status'] != 0) {
$lc_button= zen_draw_form('cart_quantity', zen_href_link(zen_get_info_page($listing->fields['products_id']), zen_get_all_get_params(array('action')) . 'action=add_product&products_id=' . $listing->fields['products_id']), 'post', 'enctype="multipart/form-data"') . '<input type="text" name="cart_quantity" value="' . (zen_get_buy_now_qty($listing->fields['products_id'])) . '" maxlength="6" size="4" /><br />' . zen_draw_hidden_field('products_id', $listing->fields['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT) . '</form>';
} else {
$lc_button = '<a href="' . zen_href_link($_GET['main_page'], zen_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $listing->fields['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT, 'class="listingBuyNowButton"') . '</a>';
}
}
}
$the_button = $lc_button;
$products_link = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . ( ($_GET['manufacturers_id'] > 0 and $_GET['filter_id']) > 0 ? zen_get_generated_category_path_rev($_GET['filter_id']) : $_GET['cPath'] > 0 ? zen_get_generated_category_path_rev($_GET['cPath']) : zen_get_generated_category_path_rev($listing->fields['master_categories_id'])) . '&products_id=' . $listing->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>';
$lc_text .= '<br />' . zen_get_buy_now_button($listing->fields['products_id'], $the_button, $products_link) . '<br />' . zen_get_products_quantity_min_units_display($listing->fields['products_id']);
$lc_text .= '<br />' . (zen_get_show_product_switch($listing->fields['products_id'], 'ALWAYS_FREE_SHIPPING_IMAGE_SWITCH') ? (zen_get_product_is_always_free_shipping($listing->fields['products_id']) ? TEXT_PRODUCT_FREE_SHIPPING_ICON . '<br />' : '') : '');
break;
case 'PRODUCT_LIST_QUANTITY':
$lc_align = 'right';
$lc_text = $listing->fields['products_quantity'];
break;
case 'PRODUCT_LIST_WEIGHT':
$lc_align = 'right';
$lc_text = $listing->fields['products_weight'];
break;
case 'PRODUCT_LIST_IMAGE':
$lc_align = 'center';
if ($listing->fields['products_image'] == '' and PRODUCTS_IMAGE_NO_IMAGE_STATUS == 0) {
$lc_text = '';
} else {
if (isset($_GET['manufacturers_id'])) {
$lc_text = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . (($_GET['manufacturers_id'] > 0 and $_GET['filter_id']) > 0 ? zen_get_generated_category_path_rev($_GET['filter_id']) : ($_GET['cPath'] > 0 ? zen_get_generated_category_path_rev($_GET['cPath']) : zen_get_generated_category_path_rev($listing->fields['master_categories_id']))) . '&products_id=' . $listing->fields['products_id']) . '">' . zen_image(DIR_WS_IMAGES . $listing->fields['products_image'], $listing->fields['products_name'], IMAGE_PRODUCT_LISTING_WIDTH, IMAGE_PRODUCT_LISTING_HEIGHT, 'class="listingProductImage"') . '</a>';
} else {
$lc_text = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'cPath=' . (($_GET['manufacturers_id'] > 0 and $_GET['filter_id']) > 0 ? zen_get_generated_category_path_rev($_GET['filter_id']) : ($_GET['cPath'] > 0 ? zen_get_generated_category_path_rev($_GET['cPath']) : zen_get_generated_category_path_rev($listing->fields['master_categories_id']))) . '&products_id=' . $listing->fields['products_id']) . '">' . zen_image(DIR_WS_IMAGES . $listing->fields['products_image'], $listing->fields['products_name'], IMAGE_PRODUCT_LISTING_WIDTH, IMAGE_PRODUCT_LISTING_HEIGHT, 'class="listingProductImage"') . '</a>';
}
}
break;
}
$product_contents[] = $lc_text; // Used For Column Layout (Grid Layout) Option
if (PRODUCT_LISTING_LAYOUT_STYLE == 'rows') {
$list_box_contents[$rows][$col] = array('align' => $lc_align,
'params' => 'class="productListing-data"',
'text' => $lc_text);
}
}
// add description and match alternating colors
//if (PRODUCT_LIST_DESCRIPTION > 0) {
// $rows++;
// if ($extra_row == 1) {
// $list_box_description = "productListing-data-description-even";
// $extra_row=0;
// } else {
// $list_box_description = "productListing-data-description-odd";
// $extra_row=1;
// }
// $list_box_contents[$rows][] = array('params' => 'class="' . $list_box_description . '" colspan="' . $zc_col_count_description . '"',
// 'text' => zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION));
//}
// Following code will be executed only if Column Layout (Grid Layout) option is chosen
if (PRODUCT_LISTING_LAYOUT_STYLE == 'columns') {
$lc_text = implode('<br />', $product_contents);
$list_box_contents[$rows][$column] = array('params' => 'class="centerBoxContentsProducts back"' . ' ' . 'id="'echo $listing->fields['products_id']'"' ,
'text' => $lc_text);
$column ++;
if ($column >= PRODUCT_LISTING_COLUMNS_PER_ROW) {
$column = 0;
$rows ++;
}
}
// End of Code fragment for Column Layout (Grid Layout) option in add on module
$listing->MoveNext();
}
$error_categories = false;
} else {
$list_box_contents = array();
$list_box_contents[0] = array('params' => 'class="productListing-odd"');
$list_box_contents[0][] = array('params' => 'class="productListing-data"',
'text' => TEXT_NO_PRODUCTS);
$error_categories = true;
}
if (($how_many > 0 and $show_submit == true and $listing_split->number_of_rows > 0) and (PRODUCT_LISTING_MULTIPLE_ADD_TO_CART == 1 or PRODUCT_LISTING_MULTIPLE_ADD_TO_CART == 3) ) {
$show_top_submit_button = true;
} else {
$show_top_submit_button = false;
}
if (($how_many > 0 and $show_submit == true and $listing_split->number_of_rows > 0) and (PRODUCT_LISTING_MULTIPLE_ADD_TO_CART >= 2) ) {
$show_bottom_submit_button = true;
} else {
$show_bottom_submit_button = false;
}
if ($how_many > 0 && PRODUCT_LISTING_MULTIPLE_ADD_TO_CART != 0 and $show_submit == true and $listing_split->number_of_rows > 0) {
// bof: multiple products
echo zen_draw_form('multiple_products_cart_quantity', zen_href_link(FILENAME_DEFAULT, zen_get_all_get_params(array('action')) . 'action=multiple_products_add_product'), 'post', 'enctype="multipart/form-data"');
}
?>
and here's just the section I am editing:
Code:
// Following code will be executed only if Column Layout (Grid Layout) option is chosen
if (PRODUCT_LISTING_LAYOUT_STYLE == 'columns') {
$lc_text = implode('<br />', $product_contents);
$list_box_contents[$rows][$column] = array('params' => 'class="centerBoxContentsProducts back"' . ' ' . 'id="'echo $listing->fields['products_id']'"' ,
'text' => $lc_text);
$column ++;
if ($column >= PRODUCT_LISTING_COLUMNS_PER_ROW) {
$column = 0;
$rows ++;
}
}
// End of Code fragment for Column Layout (Grid Layout) option in add on module
Anyone see what I'm doing wrong?? Thanks!!!
Re: How do I add a unique css class (or html id) to product listing items?
PHP Code:
$list_box_contents[$rows][$column] = array('params' => 'class="centerBoxContentsProducts back" id="prod' . $listing->fields['products_id'] . '"' ,
'text' => $lc_text);
Re: How do I add a unique css class (or html id) to product listing items?
