Changing the Product Formatting

Every individual product record can be formatted using template files.

The display of products on “shopdisplayproducts.asp” is controlled by the “tmp_productformat.htm” file. This template file is located in “templates/default”.

You will note that when you view this file using an HTML editor, the file consists of a table and declarations wrapped in square brackets.

Any field in the products table can be placed into your template. The field must be surrounded by square brackets as shown in the following example.

Note: Adding a “$ symbol” at the very start of the line in a template tells VPCart not to display anything on that line if there is nothing in that field.

For example:

<div class="col-sm-3 col-xs-12 product-price">

$   <span class="price global-font-color">[FORMATCUSTOMERPRICE cprice]</span><br>

</div>

You cannot place any ASP code in the template files. If you wish to display something in your template that requires more than a lookup of the product table, you will need to develop a special routine that is also surrounded by square brackets.

VPCart has a number of these in place by default. For example, [FORMATHYPERLINKS SUB], which generates wish list, reviews and tell-a-friend hyperlinks.

PRODUCT EXTENDED PAGE (SHOPEXD.ASP)

The display of products on “shopexd.asp” is very similar to those displayed on “shopdisplayproducts.asp.” Except in this instance, the template used is “tmp_product.htm.” This template file is located in “templates/default.

You will note that this page must include declarations to load the “shoppage_header.htm” and “shoppage_trailer.htm” files if you wish for the extended description page to retain the look of the rest of your site.

This can be accomplished with the special keywords [ADD_PAGEHEADER] and [ADD_PAGETRAILER]. These should be the first and last lines, respectively, of this file.

For more information about displaying your products using templates, please refer to Section 4.14.5. Template Display of the VPCart 8.00 User Manual.

PRODUCT DISPLAY PAGE (SHOPDISPLAYPRODUCTS.ASP)

In previous versions (v7 and below), the “shopdisplayproducts.asp” page will display your products in one or more columns. This is related to the “xproductcolumns” config.

In VPCart 8.00, this config will no longer be used due to the use of responsive layout.

Below is a preview of the product listing page by default (listing view).

VPCart 8.00 is now enhanced with a new feature called Grid View. By clicking the Grid View icon, your customers can see the products in Grid View.

Below is a list of templates for product display by default:

You can customize the templates above to suit your preference. These are located in the “templates/default” folder.