Changing the layout of Zen Cart’s featured products, specials, new products, and upcoming products.

Zen Cart is a wonderful open source e-commerce shopping cart system that we’ve been using for many of our customers who wish to sell items on the internet. Recently we made some customizations of a particular section of Zen Cart, which in turn has generated some people contacting me to share this information. So here it is. This article does assume you know how to program in php and how to make SQL queries.

First, make a folder in the modules folder that is the same name as your template folder. Something like includes/modules/myTemplateName/. Once that’s done copy the files featured_products.php, new_products.php and specials_index.php to the new folder you created in the modules folder.

Featured_products.php, new_products.php, and specials_index.php are just about the same, with the exception of line numbers and some commands, which means if I show you how to do one, you should be able to do the others. Using your favorite php/html editor, open featured_products.php for editng. The first thing we need to do is to add to the query the field that holds the products description. Looking at the query, all we have to do is add “,pd.products_description” to the end of line 15 and line 21. That will pull the description out of the database with the other product info.

Lines 51-54 control what is generated for each product.

Line 51 makes the display price for the product and holds it in the variable $product_price.

Line 53 starts an array that holds the information on creating a new div block for each item in the list. The array $list_box_contents holds 2 pieces of information, “params” defines the class of the div block, and “text” holds what goes in the box.

Line 54 was so long that I decided to break it down to something a bit more readable.

At line 52 I put in some extra blank lines and starting caching some of the product information into some variables. And put in these lines.

most of this is just taken from line 54, just put into variables. As you can see the link goes to the info page of the particular product. Description is the only thing that wasn't in there before.  The last line is the buy now button, effectivly a link that has an &action=buy_now attached to it that tells zen_cart to add it to the cart.

All you have to do now is to make the html that holds all the information. Change the "text" portion of the array, which is now a few more lines down from where it was to hold the new inforatiom that were put in variables.  I changed mine to

I changed the "params" to hold a different set of class names, and also change the "text" to hold different HTML and added the same classes to the stylesheet.css in my template for the proper formating.  Sve this file and goto your catalog in your broweser and test it out.  I suggest that you change the number of columns that featured products have to 2. That setting is found in Configuration > Index Listing and is titled Featured Products Columns per Row.

The files specials_index.php and new_products.php are similar except for what line numbers the information is on. Hope this helps everyone on making changes to the featured, special, and new products center boxes in Zen Cart.