Using one single listing template

**yellow1912** · 12 Apr 2008, 05:15 AM

BTW, the above content is ALL that your template should have, NO MORE, NO LESS.

**CelticKatt** · 12 Apr 2008, 05:42 AM

Ouch! Thanks though, that did it! I really did try that the first time and I don't know what happened, but it didn't work. It did this time though. Thank you!

Two layout questions. If they are simple and you want to answer, super. If not, I've bugged you enough!

1. How do I get the page title back up there? It's not there at all now. Can I grab that from the old file, so it's there, above the sort order?

2. The original page, and the products_new page, has a divider in between each product and at the bottom, right below the last product description and before it says, "Displaying 1 to 10 (of 350 new products)". Is there a way to put that there also?

See the products_new page I have for examples of both:
http://accessory-avenue.com/hbhcatal...e=products_new

Thanks again!!!

**yellow1912** · 12 Apr 2008, 05:47 AM

The main purpose of this whole thing is to use 1 single layout for all listing, and that layout is in tpl_modules_product_listing.php

Any change you make to that file will be reflected through the site.

**CelticKatt** · 12 Apr 2008, 06:28 AM

Thanks for the info for that page, it's the one I needed in order to add the divider after the products and before the, "Displaying 1 to 10..." bit! Yay!

I also wanted to note, that in order to get the page title back onto the products_all page (the products_new page too, I just haven't changed that page to your coding yet!) here is the exact coding I used in the tpl_products_all_default.php page:

Code:

<?php
/**
 * Module Template
 *
 * @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_product_listing.php 3241 2006-03-22 04:27:27Z ajeh $
 * UPDATED TO WORK WITH COLUMNAR PRODUCT LISTING 04/04/2006
 */
?>
<div class="centerColumn" id="allProductsDefault">

<h1 id="allProductsDefaultHeading"><?php echo HEADING_TITLE; ?></h1>
<?php
require($template->get_template_dir('/tpl_modules_listing_display_order.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_listing_display_order.php');
    require($template->get_template_dir('tpl_modules_product_listing.php',DIR_WS_TEMPLATE, $current_page_base,'templates'). '/tpl_modules_product_listing.php');
?>
</div>

All I did was add the line with the HEADING_TITLE, and then I realized that the page doesn't have the margin set that the main listing page does, so I also pasted the div that told it to call that class, which put the margin in there. I hope all of this was ok, and correct. It looks completely right!

The only thing I haven't figured out is how to add the divider (in my case, it's actually an image divider) in between each product listed. I assumed it would be in the tpl_modules_product_listing.php, since that's where I added the divider at the bottom, but I tried adding it everywhere I could see possible and they were all wrong. *stumped*

Side note: I hope I'm not annoying you with all my customizing issues/updates. I'm trying to be thorough so others with the same issue(s) will know what to do.

**CelticKatt** · 12 Apr 2008, 08:11 AM

I went back and read the first pages again and couldn't really figure this out:

Since I got the products_all page like I want it, I copied everything over to the products_new files. I'm pretty sure I did everything right, but maybe not because both pages now look exactly the same. By that I mean, the products_all page sorts the products by name and the products_new page does too, but it's SUPPOSED to sort the products_new page in descending order, from the newest to oldest. It's even set in the admin as "Date Added desc". But it doesn't display that way (and doesn't change even if I change it in the admin to something else.) Now, I may just be tired and messed up the products_new/header_php.php file, but to my understanding I was supposed to do the same thing that was done for the products_all/header_php.php, except change the instances of "all" to "new", basically. Is that right? Here's my coding for the products_new/header_php.php:

Code:

<?php
/**
 * products_new  header_php.php
 *
 * @package page
 * @copyright Copyright 2003-2006 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: header_php.php 4261 2006-08-25 04:35:20Z ajeh $
 */

  require(DIR_WS_MODULES . zen_get_module_directory('require_languages.php'));

  $breadcrumb->add(NAVBAR_TITLE);
// display order dropdown
$disp_order_default = PRODUCT_NEW_LIST_SORT_DEFAULT;
  require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_LISTING_DISPLAY_ORDER));


  $listing_sql = "SELECT p.products_type, p.products_id, pd.products_name, p.products_image, p.products_price, p.products_tax_class_id,
                                    p.products_date_added, m.manufacturers_name, p.products_model, p.products_quantity, p.products_weight, p.product_is_call,
                                    p.product_is_always_free_shipping, p.products_qty_box_status
                             FROM " . TABLE_PRODUCTS . " p
                             LEFT JOIN " . TABLE_MANUFACTURERS . " m ON (p.manufacturers_id = m.manufacturers_id), " . TABLE_PRODUCTS_DESCRIPTION . " pd
                             WHERE p.products_status = 1
                             AND p.products_id = pd.products_id
                             AND pd.language_id = :languageID " . $order_by;

  $listing_sql = $db->bindVars($listing_sql, ':languageID', $_SESSION['languages_id'], 'integer');
 //check to see if we are in normal mode ... not showcase, not maintenance, etc
  $show_submit = zen_run_normal();

$define_list = array('PRODUCT_LIST_MODEL' => PRODUCT_LIST_MODEL,
  'PRODUCT_LIST_NAME' => PRODUCT_LIST_NAME,
  'PRODUCT_LIST_MANUFACTURER' => PRODUCT_LIST_MANUFACTURER,
  'PRODUCT_LIST_PRICE' => PRODUCT_LIST_PRICE,
  'PRODUCT_LIST_QUANTITY' => PRODUCT_LIST_QUANTITY,
  'PRODUCT_LIST_WEIGHT' => PRODUCT_LIST_WEIGHT,
  'PRODUCT_LIST_IMAGE' => PRODUCT_LIST_IMAGE);

  /*                         ,
  'PRODUCT_LIST_BUY_NOW' => PRODUCT_LIST_BUY_NOW);
  */
  asort($define_list);
  reset($define_list);
  $column_list = array();
  foreach ($define_list as $key => $value)
  {
    if ($value > 0) $column_list[] = $key;
  }
?>

Sorry to bother. Please help!

products_all:
http://accessory-avenue.com/hbhcatal...e=products_all

products_new:
http://accessory-avenue.com/hbhcatal...e=products_new

**CelticKatt** · 12 Apr 2008, 09:15 AM

Ohhhkay...

In the mentioned coding (products_new/header_php.php) change this code:

Code:

  require(DIR_WS_MODULES . zen_get_module_directory('require_languages.php'));

  $breadcrumb->add(NAVBAR_TITLE);
// display order dropdown
$disp_order_default = PRODUCT_NEW_LIST_SORT_DEFAULT;
  require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_LISTING_DISPLAY_ORDER));

to

Code:

  require(DIR_WS_MODULES . zen_get_module_directory('require_languages.php'));
  $breadcrumb->add(NAVBAR_TITLE);
// display order dropdown
  $disp_order_default = PRODUCT_NEW_LIST_SORT_DEFAULT;
  require(DIR_WS_MODULES . zen_get_module_directory(FILENAME_LISTING_DISPLAY_ORDER));
  $products_new_array = array();
// display limits
//  $display_limit = zen_get_products_new_timelimit();
  $display_limit = zen_get_new_date_range();

That made the products display in the correct order (newest to oldest) like it's supposed to.
Yellow, if I screwed up anything else on that page, please let me know!

Still... if anyone knows what file to mess with to add a divider in between each product, let me know. I think the separation would define each product better and I simply CANNOT figure out which file to edit!

**CelticKatt** · 12 Apr 2008, 09:45 AM

For the love of God, I think I figured it out!

/includes/templates/custom_1/common/tpl_tabular_display.php

(see the divider example here: http://accessory-avenue.com/hbhcatal...e=products_new)

That's about all I found that file good for so far, lol!

**gjh42** · 12 Apr 2008, 05:09 PM

Actually, you don't need to edit any php files to get the divider images - it can all be done with the stylesheet.
Find this in your stylesheet

Code:

.productListing-rowheading, {
	background-color: #8A8D81;
	background-image: url(../images/tile_back.gif);
	height: 2em;
	color: #FFFFFF;
	}

.productListing-heading, A.productListing-heading:link, A.productListing-heading:visited, A.productListing-heading:hover {
	color: #FFFFFF;
	text-decoration: none;
	}

and change to this

Code:

.productListing-rowheading {
	background-color: #8A8D81;
	background-image: url(../images/sage_graphicrule_long.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	color: #FFFFFF;
	}

.productListing-even, .productListing-odd {
	background-image: url(../images/sage_graphicrule_long.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	}

.productListing-data {
	padding-bottom: 2em;
	}

.productListing-heading, A.productListing-heading:link, A.productListing-heading:visited, A.productListing-heading:hover {
	color: #FFFFFF;
	text-decoration: none;
	padding-bottom: 2em;
	}

**CelticKatt** · 12 Apr 2008, 08:08 PM

You're so awesome! I wish you'd have been around last night, lol!

Ok, so I deleted the /includes/templates/custom_1/common/tpl_tabular_display.php (don't any of you go and accidentally delete the default one!), added your coding, and I changed it up a little to make everything appear exactly how I'd like. I listed the code below and here's what it will get you:

--a divider between each product (but not above the first one, which is why I deleted your background image reference in the productListing-rowheading)

--the words "Image" "Item Name" "Price" vertically centered in the header

--a space between the header bottom and the very top of your first image (before, by default, they always touched)

--the product name and description, etc. vertically aligned to the top

To see my example:
http://accessory-avenue.com/hbhcatal...e=products_new

Code:

productListing-rowheading {
	background-color: #8A8D81;
	color: #FFFFFF;
	}

.productListing-even, .productListing-odd {
                padding-top:.5em;
	background-image: url(../images/sage_graphicrule_long.gif);
	background-repeat: repeat-x;
	background-position: bottom;
                vertical-align: top;
	}

.productListing-data {
	padding-bottom: 2em;
	}

.productListing-heading, A.productListing-heading:link, A.productListing-heading:visited, A.productListing-heading:hover {
	color: #FFFFFF;
	text-decoration: none;
	padding-top: .5em;
	padding-bottom: .5em;
	}

Thanks gjh42!!!

**gjh42** · 12 Apr 2008, 09:54 PM

Looking good!
I was wondering exactly what you wanted for the heading. It showed a divider below it, and the background was white so that the text disappeared, but your stylesheet showed a desire to have a contrasting bg. Hiding the heading and also showing a divider there would be tricky to do in the stylesheet alone. Your resolution makes sense.