• Product Line Templates

This section is intended for the site designers of sites where the Catalog and Shopping Cart is enabled.

incomplete

Topics
Introduction to Product Templates 
  • This discussion assumes a basic understanding of HTML, the language of the WEB. 
  • Just as there are both Standalone Products and Product groups (i.e., a parent product and multiple child products) there are separate templates to describe how each should be displayed. Templates consist of html, logic elements and Category and Product Tags.  Like all templates, the tags are replaced by appropriate values.  Logic is used to include sections of the template based on the value of one or more product tags.  There are five possible templates: CatProd, Standalone, Parent Start,  Child and Parent End.
    • If there are child products then Parent Start, Child and Parent End are needed.
  • Products can be displayed both under their parent category and on a separate Product Display Page.  If a CATPROD template is provided then that will be used for both standalone and parent products (child products are then displayed only on the product display page.
    • On the category/product page the products under a given category are displayed in a group using the appropriate template.  If a CATPROD template is not supplied then standalone and parent/child product families are displayed in display order of the standalone and parent products using the appropriate templates. 
    • On the product display page the standalone product template or the parent and child templates are used.
    • A parent and child family is displayed by displaying the parent start template followed by the child template for each of the child products and finally the parent end template.
  • How are they arranged?  On the category/product page, the system looks at the CATPROD template (or Standalone template if there is no CATPROD template to decide how to display the products).  On the product display page, the system looks at the Standalone template.   Note: the system always wraps the generated lines inside of a table for consistency.
    • If the template begins with a table data element td then the system arranges the products in three columns.  To vary the number of columns begin the template with an HTML comment containing C:# where the # is the number of columns to be used. The system will build the table and table rows needed to support this display.
    • If the template begins with a list item tag li then the products are displayed as an unordered list and the surrounding unorder list tags are generated.
    • If the template begins with a table row tag tr then the products are displayed inside a table as table rows and the system just displays the surrounding table.
    • Note: the displays on the category/column pages can be totally different than that used in the product display page since they are controlled by different templates.
    • Alert: If the CATPROD or Standalone template (as appropriate) does not contain a form tag the system will automatically surround the entire product body with start and end form tags pointing to the shopping cart.  Just before the stop form tag a table row element will be added with a submit image '/std-img/revorder.gif'. This table row is outside of the unordered list elements or interior table holding the table data elements.  To suppress this behavior you can insert an empty start and end form element in the CATPROD or Standalone template of there is no actual purchasing going on. 
  • Buy Function options:
    • If the standalone product section contains a begin FORM tag (even if its null) then its assumed that the buy FORM to actually buy something is present in the Standalone and Child Templates.  If its not present then a begin FORM and /FORM tags are added to surround the list of lines as well as a Submit Order button at the bottom.  So normally you will want to include your own FORM.
    • All FORM's must begin with method='post' action='doscartDisQ.pl', a Submit Button, or input type=img.
    • If a variable name='PRIDQ' value='|.PRID.|'  then a single product whose PRID is substituted will be added to the shopping cart.
    • To allow a variable quantity to be added pass a variable name='Action' value='Add', a variable name='PRID' value='|.PRID.|', a variable name='|.PRID.|:Quant', and a variable name='Action' value='Add' . Normally  variable name='|.PRID.|:Quant' is of type='text' and is used to contain the number of product specified in the PRID.  This latter structure is used to allow several different products to be ordered on  a single form.

Go to Top

Common Details

  • Each of these "templates" are assembled into a site specific document called the Product Line Template.
    • Each section begins with a section identifier: |.section name.| on a separate line followed by the appropriate HTML. Section name is |.Parent Start.|, |.Parent End.|, |.Child.|, |.Standalone.| and |.CATPROD.|.  Below this line is the HTML chunk which will be displayed after embedded logic (see below), category and product tags which will be used in the section are processed.
    • If only stand alone section is needed then no section name tag is needed since it is assumed that all products are stand alone and only that template will be used.
  • The following Category tags are available.  Only the CatID is available on Product Display Pages.  Note: depending on your site's design, some of these fields will have no value and thus should not be used.  If you can't enter it under the category  you can't use it in a template.
    • CatID: parent category ID.
    • IMGA, IMGB, and their variants: these are complete HTML image tags using the contents of CatSpare1 and CatSpare2 respectively.  If the 'A' or 'B' is followed by  :L then the image tag will align the image to the left of the text, if by :R then the image tag will align the image to the right and if by :C to the center.  Thus if CatSpare1 contains '/media/catalog/1_CatSpare1.gif' then |.IMGA:L.| will generate img src='/media/catalog/1_CatSpare1.gif' align='Left' .
    • CSDESC: category short description
    • CATLDESC: category long description.
  • The following Product tags are available: Note: in the Parent Start and Parent End Templates the tags have the value of the Parent Product and in the Child Template values of the Child product are used.  In CATPROD template the values of either the Standalone Product or Parent Product is used (remember, Parent Products have a quantity of '0' not the sum of their child product's quantities.
    • PRID: product ID number, numeric field generated by the system which uniquely identifies the product.
    • PrNumber: SKU or Product Number: unique number assigned by the site owner to identify the product.  Note: parent products must have their own PrNumber.
    • PrName: Name of the Product, does not have to be unique.
    • PrHide: Hide: values 'Y' or 'N', set to determine whether to hide a given product.  If 'Y' product will normally not display unless called directly.
    • PrDisPriority: product display priority: decimal number.  Lowest values are displayed first.  If two Products have the same PrDisPriority, they will be displayed in alphabetic order by Product Name.
    • PrOptType: Option Type: values: none, radio button, select List, check list (aka, a series of check boxes). 
    • PrOption: Option Group: site specific option group name to be applied to the product or 'None'.
    • PrDisQuan: Discount Quantity: # which must be purchased to qualify for a discounted price. '0' means no quantity discount is available.
    • PrWeight: Unit Weight of product: -1 used to indicate manual shipping calculations will be needed.
    • PrSDesc: Short Description: free text up to 255 characters long.
    • PrLDesc: Long Description: text fields which can include the same formatting options as the content engine.  Single media library for catalog is available directly in the drop downs.
    • PrSpare1: Thumbnail of product image uploaded, width normally constrained to 125 pixels.  In catprodC.plx and proddisp.plx, if it ends in '.jpg', '.gif',  or '.png' it will be converted to an image tag.
    • PrSpare2: Full size image of product, width normally constrained to 4000 pixels.  In catprodC.plx, it it ends in '.jpg', '.gif',  or '.png' it will be converted to an image tag.
    • PrSpare3,4: not used in standard setup.
    • PrSpare5: Second Long description.
    • PrNPrice: Standard selling price for the product. 
    • PrDPrice: Discount price applicable if Discount Quantity of the item is ordered.
    • PrTaxable: Item is taxable: set to 'Y' if item is taxable, 'N' if not.
    • PrShowSpare: Show Spare Input Field: special text input field is displayed to collect product specific text.  Contents are passed unaltered to the Order/Shipping documents.  Example: collect initials to be applied to a bathrobe. Values: 'Y' or 'N'.
    • PrQuant: Quantity on hand. If set to -1 then item will never run out of stock.  Put the value you have on your shelf.  Warning: If you set a value less than the total needed to fill pending orders and in active shopping carts the system will display the quantity needed to meet those commitments.  (i.e., it will not display an error nor will it remove items already in someone's shopping cart).
    • PrPPRID: Parent Product PRID not the SKU.  set to assign a product as a child to a given parent product.
    • PrHasChild: Product can have child products. Values: 'Y' and 'N'
  • Synthetic values: generated by the system and used for display purposes.
    • PR_OPTIONS: "None" or the list of options for a given product.  If Option type is 'Radio' then a series of radio buttons, if type 'List' then a Select List, and if type 'Multi' then a series of check boxes and their corresponding values.
      Note: other fields may be configured as Option Type.  These fields will always be displayed as a Select List.
    • PR_DISCOUNT: if discount quantity is non-zero: "Minimum Quantity to Receive Discount is enclosed in span class='pr-6', note:pr-6 is the fixed class for this.   Otherwise, the field is suppressed (
    • PRPRICE:
      • If discount quantity is non-zero, replaced by: $|.PrNPrice.| / $|.PrDPrice.|  that is the regular price followed by the discount price in italics.
      • If discount quantity is zero then, replaced by: $|.PrNPrice.|  that is the regular price.
    • PRGRAPHIC: if PrSpare1 contains an image (i.e, a file whose name ends in .png, .jpg, .jpeg, or .gif) then that |.PRGRAPHIC.| is created as image tag with a link to the graphic contained in PrSpare2 with the words: "Click image to enlarge!" below it.  Otherwise it is suppressed.
    • PR_SPARE: if PrShowSpare is true (i.e., 'Y') then PR_SPARE is replaced with a text input box to take the Spare String. Whatever is placed in this input box is added to the Option information for that product in the shopping cart/order. The input box is enclosed in span class='prSpare'  See discussion on the Product Line template for how to test and add text describing the use of the box if more control is needed.
    • PR_AUTH: set to non-zero if visitor to the page has signed in.  Requires site to have support for Authorized Groups and Authorized Members. Again, this is used with the conditional statements

Go to Top

Standalone and CATPROD Templates

  • If both of these templates are present, the CATPROD template will be used to display products under a given category and the Standalone template will be used on the product display pages. 
  • In both cases the values of a single product will be used (either standalone or parent). 

Go to Top

Parent Start Template

  • This template is used when a product is flagged as a parent product.  Any tags in it are substituted using the parent product's values and then it is set out.
  • It is important to remember that it begins the display.  Multiple child templates may be filled in to follow it (if there are no non-hidden child products where will be no lines) and then they will be followed by the parent End template with its values filled in.

Go to Top

Parent End Template

  • This template is completed with the parent product's values after the last, if any, child templates are filled in.  Use it to complete any HTML which was begun in the Parent Start Template.  However, the PrQuant field will be non-zero if any of the Child Products had a non-zero PrQuant (i.e., there is something to order).  This template must be able to deal with one or more child products being present. 

Go to Top

Child Template

  • This template is used once for each non-hidden child products.  For example, using the logic described below, it can be used to display an out of stock graphic if the quantity is zero and a buy line if the product is in stock.  This means that you do not need to hide out of stock products (although you could by putting all the HTML inside of a logic which will test for a non-zero case).  Caution: since you can have zero or more child products, the HTML code needs to be complete, e.g., start bold tags need to be matched by close bold tags. 

Go to Top

Adding a bit of logic to templates

Limited logic is available in the form of:

||.if:FIELDNAME.|| ...HTML CHUNK...||.ENDIF.|| or

||.ifnot:FIELDNAME.|| ...HTML CHUNK...||.ENDIF.|| or

||.if:FIELDNAME=constString.|| ...HTML CHUNK...||.ENDIF.|| or

||.if:FIELDNAME<constString.|| ...HTML CHUNK...||.ENDIF.|| or

||.if:FIELDNAME>constString.|| ...HTML CHUNK...||.ENDIF.|| or

||.ifnot:FIELDNAME<constString.|| ...HTML CHUNK...||.ENDIF.|| or

||.ifnot:FIELDNAME>constString.|| ...HTML CHUNK...||.ENDIF.|| or

||.ifnot:FIELDNAME=constString.|| ...HTML CHUNK...||.ENDIF.||

The FIELDNAME=constString will be interpreted as match if the contents of
the field are equal to all the characters up to the
length of the constant string thus if the field FRED contains 'The Quick Brown Fox'
||.if:FRED=The.|| would be considered a match.
The straight FIELDNAME construct would be considered false if the value of the field ==0, null, undef or eq 'N' after upper-cased.

Tests using '<' or '>' work just like equality, when the constString is a number, except they test for the value of the field being less than ('<') or greater than ('>') the constString.   If the constString contains letters or a decimal point the results are undefined but will probably return false.

ifs may not be nested (i.e., each ||.if: .... .|| must be followed by an ||.ENDIF.||); however, multiple conditions can be strung together using the following 4 connectors:
.and. .or. .andnot. and .ornot. between the conditions. There should be no space between conditions and these connectors.  For example:
||.if:PrQuant.andnot.PrQuant=-1.||  ...HTML CHUNK for limited quantity items which are in stock ... ||.ENDIF.||

HTMLCHUNK is any HTML and legal tags (e.g., product tags).  If the test evaluates true then it will be included in the product's HTML, if not it will be suppressed. 
Evaluation is left to right and each section is evaluated, optionally negated (e.g., andnot or ornot and then the result tested.

For products with children the field PrQuant is Zero in the parent. However, when Parent End is evaluated it is set to '1' if any of the child products are not empty. For example this can be used to output special text if all the children are out of stock. 

Warnings:

  • Case and spacing do matter.  e.g., ||.endif.|| will not work, nor will ||. ENDIF.|| In the first the case is wrong and in the second there is a space between the 'E' and the '.'
  • You are responsible for ensuring the generated HTML is correct, e.g., if you start a td tag outside of logic test you should end it outside of the end of that test since the HTML CHUNK inside of the test may not be displayed. 
  • The logic is evaluated and then the resulting HTML has any tags Product Tags replaced.

Examples:

  • Direct certain products to a static page vs. the standard product display page.  (Note: this would normally be in the |.CATPROD.| part of the template).  Assume the static information, beginning with 'http://' is stored in PrSpare5 then the following could be used:
    ||.if:PrSpare5.||{a href="PrSpare5"}PrName detail page{/a}||.ENDIF.||
    ||.ifnot:PrSpare5.||{a href="|.CProdDispProg.|"}PrName detail page{/a}||.ENDIF.||
    If PrSpare5 (whose public name would be Static Product Page (or similar) has any information in it, the system will generate a link to that page (1st line is sent out) otherwise the 2nd line will be used and that will use the configuration defined Product Display Program (e.g., proddisp.plx). 

Go to Top