shopping cart templates, oscommerce templates, cre loaded 
templates, zencart templates, magento templates

Ecommerce Products KnowledgeBase

shopping cart templates, oscommerce templates, cre loaded 
templates, zencart templates, magento templates

ZenCart Directory Structure

Print | Bookmark
Bookmark and Share
Zen Cart Logo

Directory Structure

Figure 1.0 Zen Cart default directory structure
Figure 1.0 Zen Cart default directory structure

The image shown on Figure 1.0 is the default folder structure of Zen Cart. Those shaded in green are the folders you will get involved more often. As most of the template customization are done inside these folders. Each of these folders will be discussed below.

IMAGES folder

Most images used in your cart, especially your product's images, are stored in this folder. Manufacturer, Categories, and other extra images are seen here. The images used in Banner Manager in Admin are also stored here.

INCLUDES folder

This folder contains the essential pieces of your shopping cart. The core files that runs the cart is housed in this folder. Also, installed templates and other portions that can be edited are found here too.

LANGUAGES folder

To make your site support multi-languages for your customers. You will find all texts that can be translated into different languages in this folder. But first, you will need to download language packs for the languages you need to support in your cart.

TEMPLATES folder

This folder contains the visual parts of the cart. It contains the template and most of the cart's parts such as background images, css, HTML tags for pages, sideboxes etc. Contents of this folder will be discussed below.

TEMPLATES folder

Figure 1.1 Subfolders of the Templates Folder
Figure 1.1 Subfolders of the Templates Folder

Installed templates can be seen here, one of which is the CLASSIC template, and another template named ZC04A00365

Note: Since algozone.com has two template set versions, some templates doesn't have the AZ_TEMPLATE folder. Older templates that have OS03Cxxxxx / ZC03Cxxxxx (i.e. OS03C00318 / ZC03C00318) don't have AZ_TEMPLATE. For az_template, topic will be discussed below.

Additional Note: The 'OS03C' is your template's name while the 'ZC' prefix denotes your template in zencart. Folders inside the zencart must have the 'ZC' prefix.

COMMON folder

Files that handle the header, footer, main_page contents, sideboxes, and product display can be found in this folder.

CSS folder

Colors, texts, and other visual layout where css is applied in your template, all of them are seen here.

IMAGES folder

Ratings (stars), template preview and other images used in template are stored in this folder.

COMMON folder

Figure 1.2 contents of the Common Folder
Figure 1.2 contents of the Common Folder

Commonly edited files

Shaded in green are the most files you get your hands into. Since major parts of the cart is handled in the following files.

  • tpl_footer.php

    Parts seen on the lower part of the cart is found here. This file contains the HTML tags and other scripts in that portion.

  • tpl_header.php

    The upper part of the site is contained here. Tags and other codes are kept in this file.

  • tpl_main_page.php

    This file contains ALL parts of the cart. This module assembles the parts of the page, such as the header, footer, sideboxes and the main content of every page you navigate. In some Old versions of templates such as OS03C00318, the header and footer is contained in this file. Giving you the convinience of editing only a single file.

Note: Algozone.com has two(2) template set versions. The previous version with prefix of OS03Cxxxx (i.e.OS03C00318) and the recent version OS04Axxxx (i.e.OS04A00371). In the recent versions, editing most of the template's portion is handled in a single file. This topic will be discussed below.

Rarely edited files

Shaded in blue are some files you might need to edit other parts of the cart such as product listing, sidebox frames etc.

  • tpl_box_default_left.php
  • tpl_box_default_right.php
  • tpl_box_default_single.php
  • tpl_columnar_display.php
  • tpl_tabular_display.php
  • tpl_tabular_display2.php

ZC03Cxxxxx Templates

Figure 2.0 Previous Version File Structure
Figure 2.0 Previous Version File Structure

In this version, most of the content you wish to customize can be found in the root folder of the cart installation. Shaded in green are the CSS, IMAGES, and JS folders.

As you can see, each folder contains a subfolder named after the template you currently have. In figure 2.0, zen cart has template ZC03C00318 installed. So to find the CSS of template ZC03C00318, just go to CSS -> ZC03C00318 and find the CSS file you wish to edit.

To edit the HTML tag of your Header, Footer, and other contents of your cart, the files needed are seen in the Common Folder

To customize header & footer


open includes > templates > [template_name] > common > tpl_main_page.php



part of header codes

A hint on where you will start editing is the comment named <!--Header Container-->. The block of codes below that comment are the portions of the header.



part of header codes

Same goes with the main content and the footer, a comment marks where we start and end. As for the main content, we see the starting point where to edit parts of the content with the comment <!-- Main Content Container -->.

As you observed, there is another comment named <!-- eof: Header Container --> . This shows that the end of Header Code-block ends above it. So any codes below it are not parts of the header anymore.

ZC04Axxxxx Templates (AZ Template)

Figure 2.1 Recent Version File Structure
Figure 2.1 Recent Version File Structure
Figure 2.2 Contents of the az_template folder
Figure 2.2 Contents of the az_template folder

Noticed the folder named AZ_TEMPLATE ? This folder contains the essential parts of the template such as the CSS, IMAGES, CSS etc. Unlike the Previous architecture where these folders are found in the root folder, in the Recent version, all of these folders are gathered in a folder named AZ_TEMPLATE.

CSS Folder

This folder contains the code to modify the font colors, size, background colors and images, width, height etc. Files here have .css extension.

Images Folder

All graphical content used in the template, from background to patterns and animated gif, are stored in this folder.

JS Folder

Javascript interaction and other javascript related features are stored here. Files here must have .js extension.

templ_product_box.php

If you want to modify the HTML code for product listing layout, this is the file to be edited.

template_main.php

If you want to modify the HTML code for the header, footer, and other parts of the template, this is the file to be edited. This file unified the "FRAME" of the templae such as header, footer and the sidebox panel.

Customizing Header, Footer etc.


Goto: templates > [template_name] > az_template > template_main.php

Figure 2.3 Language folder inside Az_template

Notice the comment //#### HEADER_HTML ##### ? It hints where you start editing codes. Let's think of a book-end. The comment above is the beginning the books are the codes inside it while the comment on the image below ( //#### END HEADER HTML ) marks the end of the whole header block.

Figure 2.3 Language folder inside Az_template

Languages and menu.php (AZ Template)

Figure 2.3 Language folder inside Az_template
Figure 2.3 Language folder inside Az_template

Shown in figure 2.3 is a folder named 'English', it contains a file named 'menu.php'. For now, only English is available since this is the default language that came with your template.

If you plan to install another language, after downloading and installing language packs, you have to do another translation.

  1. Goto az_template > includes > languages
  2. Create a duplicate of folder English and rename the copied folder into Spanish (or other language you wish to add).
  3. Find 'menu.php' inside the Spanish folder and do the translation inside it.
Click to see Live Demo here.

IMPORTANT: without menu.php, the template will not work and will an give error stating that a file is missing.

Was this article helpful?

Yes No
Bookmark and Share

Category: ZENCART

25782 views