Shopping Cart and ECommerce Software
Solutions from PDG Software, Inc.^®

To make the process of shopping and navigating your web store, it often makes sense to have a persistent listing of your product categories within the navigation area on your site. While most of the templates provided by PDG have this functionality already present, how do you go about adding something similar to an existing site and/or a new template set that you’re building from scratch.

Fortunately, the answer is pretty simple.

On pages that are being generated by PDG Commerce, there are two methods available to you. The first we’ll discuss uses a PDG “tag” that instructs the software to generate the list of categories and references an HTML template that will be used to display the results. The results are dropped inline within the source of the template that is evoking the tag. The second method functions in a similar manner, but rather than evoking another action with the output being controlled by a template, this method allows you to structure how the list will be displayed directly within the template you’re working on or modifying. Lastly, we’ll talk about how you can use a webserver tool known as a server side include to include this same category listing into your own static HTML pages.

The first method, which can be used on any page being generated by PDG, uses the tag below to pull the listing of categories, and then uses the template name embedded into the tag to control the formatting:

<!–––LIST_CATEGORIES PDGCommTemplates/[additional path to template] –––>

Most PDG template sets include a template named Category_Mini.html that can be used for this purpose. The code within the template provides the exact format of how you want the list formatted (e.g. seperated by <br> or an an unordered list using <ul> and <li>, etc.). Using an unordered list as an example, the code within the template would appear something like:


<ul>
<!–––BEGIN_REPEAT–––>
<li><a href="!–––SCRIPT_NAME–––?search=action&category=!–––CAT_CODE–––"><!–––CAT_DESC–––></a></li>
<!–––END_REPEAT–––>
</ul>


The <ul> opens the unordered list (e.g. “bullet points”). The next section tells the software to repeat this exact formatting for as many categories as you have. The <li> opens the line item, with the next section being the link to the category display and the actual name of the category as the linked text. Finally, the </li> closes the line item, and after the repeat function has run it’s course, the </ul> closes the unordered list.

The second option, which works very similar to the first, is to insert the “repeat” code directly into the template you want the display included on (e.g. would be used in place of the <!–––LIST_CATEGORIES… tag above). The formatting will be almost identical to the “repeat” code above, with the exception of the tags that open and close the repeat portion:


<ul>
<!–––BEGIN_CATEGORY–––>
<li><a href="!–––SCRIPT_NAME–––?search=action&category=!–––CAT_CODE–––"><!–––CAT_DESC–––></a></li>
<!–––END_CATEGORY–––>
</ul>


Note that instead of <!–––BEGIN_REPEAT–––> and <!–––END_REPEAT–––>, you have <!–––BEGIN_CATEGORY–––> and <!–––END_CATEGORY–––> .

Finally, now that we have an idea of how to include a category navigation list on PDG generated page, let’s discuss how to do the same thing on any existing static HTML pages already on your site. Since these pages wouldn’t be accessed or “served” by PDG Commerce, the tags used in the examples above would be ignored and would never get populated. To overcome this, we need to tell the webserver to send a request to PDG Commerce to generate the list, and then have the webserver drop the resulting code into your static page. The “magic” that makes all this happen is a server side include.

Server side includes, supported on all major webserver packages including Apache and IIS, allows you to insert a snippet of code into your page that, when encountered by the webserver as it gets ready to deliver the page to a visitor, drops in additional HTML code from an additional document/script. In this instance, the include would instruct the webserver to have PDG Commerce generate a list of categories, format them according to a template, and then drop the poulated HTML of the list back into your page.

While the format of server side includes differs from one operating system to another, the example below for an Apache include should serve as a good point of reference:


<!––#include virtual="/cgi–bin/commerce.cgi?listcategories=action&template=PDGCommTemplates/[path to a 'category mini' template]" ––>


Note that this example references /cgi–bin/ as the location of the commerce.cgi script. You’ll need to confirm the directory that the script resides it on your own site and accommodate for it within the link. Also the portion inside of the []‘s would be replace with the actual template path, excluding the brackets (e.g. PDGCommTemplates/Skin/Template.html). The template for this example would match precisely the formatting for the example #1 above.

The next step is to make sure that your webserver is configured to look for server side includes. In most cases, includes are enabled by default, however it is common that the webserver will only scan documents with a .shtml or .shtm extension –– which your current pages likely don’t have. Fortunately, Apache allows you to override this default and instruct it to scan all .html and .htm documents as well using an .htaccess file. The sample file below has the function that both enables server side includes and tells Apache to scan .shtml, .shtm, .html and .htm documents:


AddType text/html .shtml .shtm .html .htm
AddHandler server–parsed .shtml .shtm .html .htm
Options Indexes FollowSymLinks Includes


The .htaccess file should be uploaded to the document root of the website, and then the .html document with the include statement to wherever it belongs within your site. Accessing the document via your browser, just as you always navigate to the site, should then display your category list.

Aside from making it easy for your visitors to easily shop within your categories without having to constantly click back to a category “page”, but it also makes links that will be followed by search engines, helping you get your catalog pages indexed and ultimately included in search engine results pages.