Custom Product Templates: Product Price

Product price can be a very simple or complex piece of custom template code. If you are developing a template for just one store and you know the requirements of that store, you can probably use simple code, such as Example 1, below. If you are designing a generic template and/or if your template needs to handle a second currency, quantity pricing, or variable pricing, your template will be more complex. Some of the options that you need to consider are:

  • Products have a regular price and a sale price, but the merchant can choose to display or not display either one.
  • A merchant may choose to display the sale price for a product, but forget to enter anything in the sale price field. Your template should test for configuration mistakes and handle them gracefully.
  • The merchant can enable an alternate (second) currency to display prices in currencies, and there are template tags for this.
  • Your template can get a little tricky if you support quantity pricing and variable pricing. See the examples for how to handle this.

Product Price - Example 1:
This example displays the product name and then the price and sale price, depending on which fields the merchant set to display. Because there are two fields that must be set before a sale price can be displayed, the template uses a variable to track if both conditions are met, and avoids unnecessarily nested IF statements. The [-- Store.OnSale --] tag returns the text or HTML defined for the "On Sale!" field.

Product Name
$11.99 $9.99 On Sale!
    [-- DEFINE PRODUCT --]

    [-- IF PRODUCT.DisplayName --]
    [-- PRODUCT.NameSize Begin --][-- PRODUCT.NameStyle Begin --]
      [-- PRODUCT.Name --]
    [-- PRODUCT.NameStyle End --][-- PRODUCT.NameSize End --]
    [-- END_IF --]

    # define a VAR to track if a product is on sale
    [-- VAR.SaleOn "no" --]

    # if product is on sale and there is a sale price, set VAR
    [-- IF PRODUCT.SaleOn--]
    [-- IF PRODUCT.SaleAmount --]
      [-- VAR.SaleOn "yes" --]
    [-- Else --]
      [-- VAR.SaleOn "no" --]
    [-- END_IF --]
    [-- END_IF --]

    [-- IF PRODUCT.DisplayPrice --]
    <br>
    [-- IF VAR.SaleOn "yes" --]
      <strike>[-- PRODUCT.Price --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.SaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- STORE.OnSaleText --]

    [-- ELSE --]
    # product is not on sale
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.Price --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
    [-- END_IF --]
    [-- END_IF --]

    [-- END_DEFINE PRODUCT --]

Product Alternate Price - Example 2
This example is exactly like the first example, with the addition of code for handling a second currency (an alternate price). When a second currency is enabled, ShopSite automatically calculates the alternate price and sale price of each product based on the regular and sale price and a merchant-supplied exchange rate.

Product Name
$11.99 $9.99 On Sale!
Can$15.93 Can$13.64
    [-- DEFINE PRODUCT --]

    [-- IF PRODUCT.DisplayName --]
    [-- PRODUCT.NameSize Begin --][-- PRODUCT.NameStyle Begin --]
      [-- PRODUCT.Name --]
    [-- PRODUCT.NameStyle End --][-- PRODUCT.NameSize End --]
    [-- END_IF --]

    # define a VAR to track if a product is on sale
    [-- VAR.SaleOn "no" --]

    # if product is on sale and there is a sale price, set VAR
    [-- IF PRODUCT.SaleOn--]
    [-- IF PRODUCT.SaleAmount --]
      [-- VAR.SaleOn "yes" --]
    [-- Else --]
      [-- VAR.SaleOn "no" --]
    [-- END_IF --]
    [-- END_IF --]

    [-- IF PRODUCT.DisplayPrice --]
    <br>
    [-- IF VAR.SaleOn "yes" --]
      <strike>[-- PRODUCT.Price --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.SaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --] [-- STORE.OnSaleText --]
      [-- IF PRODUCT.AltPrice--]
      <br>  <strike>[-- PRODUCT.AltPrice --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.AltSaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- END_IF --]

    [-- ELSE --]
    # product is not on sale
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.Price --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- IF PRODUCT.AltPrice--]
        [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.AltPrice --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- END_IF --]
    [-- END_IF --]
    [-- END_IF --]

    [-- END_DEFINE PRODUCT --]

Product Quantity Pricing - Example 3
Quantity pricing (a ShopSite Pro feature) is quite different from other types of product pricing, and uses a different set of custom template tags. The quantity pricing information is presented in an HTML table. The merchant can select background colors for the table rows, but you can apply additional formatting by defining attributes for the table.qpheader element in a CSS style sheet.

Quantity pricing requires customers to be able to enter the quantity that they want to order, so your template must also display the product quantity input box. An input box requires an HTML form, so instead of a simple Add to Cart link, your template must have a form submit button.

Because quantity pricing and other pricing options are so different, it's best to use an IF tag to test for quantity pricing, and then have two separate paths through the code. Although the merchant can enter values for regular pricing, quantity pricing, and variable pricing, they are mutually exclusive and quantity pricing take priority.

Product Name
Quantity 1 - 12 13 +
Price $4.00 $3.50
On Sale! $3.75 $3.25
Quantity
    [-- DEFINE PRODUCT --]

    [-- IF PRODUCT.DisplayName --]
    [-- PRODUCT.NameSize Begin --][-- PRODUCT.NameStyle Begin --]
      [-- PRODUCT.Name --]
    [-- PRODUCT.NameStyle End --][-- PRODUCT.NameSize End --]
    [-- END_IF --]

    [-- IF PRODUCT.QuantityPricing --]
    [-- PRODUCT.QuantityPricing --]
    <form action="[-- SHOPPING_CART_URL BASE --]/order.cgi" method="post">
    Quantity <input type="text" size="2" name="[-- PRODUCT.RecordNumber --]:qnty" value="1">  
    <input type="hidden" name="storeid" value="[-- STORE.ID --]">
    <input type="hidden" name="dbname" value="products">
    <input type="hidden" name="function" value="add">
    <input type="hidden" name="itemnum" value="[-- PRODUCT.RecordNumber --]">
    <input class="add" type="submit" value="[-- ADDTEXT --]">
    </form>

    [-- ELSE --]

    # define a VAR to track if a product is on sale
    [-- VAR.SaleOn "no" --]

    # if product is on sale and there is a sale price, set VAR
    [-- IF PRODUCT.SaleOn--]
    [-- IF PRODUCT.SaleAmount --]
      [-- VAR.SaleOn "yes" --]
    [-- Else --]
      [-- VAR.SaleOn "no" --]
    [-- END_IF --]
    [-- END_IF --]

    [-- IF PRODUCT.DisplayPrice --]
    <br>
    [-- IF VAR.SaleOn "yes" --]
      <strike>[-- PRODUCT.Price --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.SaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --] [-- STORE.OnSaleText --]
      [-- IF PRODUCT.AltPrice--]
      <br>  <strike>[-- PRODUCT.AltPrice --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.AltSaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- END_IF --]

    [-- ELSE --]
    # product is not on sale
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.Price --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- IF PRODUCT.AltPrice--]
        [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.AltPrice --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- END_IF --]
    [-- END_IF --]
    [-- END_IF --]
    [-- END_IF --]

    [-- END_DEFINE PRODUCT --]

Product Variable Price - Example 4
Variable pricing (a ShopSite Pro feature) overrides regular pricing when enabled. Because customers can enter the price that they want to pay for the product, your template must use an HTML form and a submit button instead of an Add to Cart link. If the merchant has enabled variable price for a product, variable name and/or variable SKU can also be enabled. This example code looks for all three, and the five products in the sample data have various combinations of fixed and variable values.

Product Name
Price: $
    [-- DEFINE PRODUCT --]

    [-- IF PRODUCT.DisplayName --]
    [-- PRODUCT.NameSize Begin --][-- PRODUCT.NameStyle Begin --]
      [-- PRODUCT.Name --]
    [-- PRODUCT.NameStyle End --][-- PRODUCT.NameSize End --]
    [-- END_IF --]

    [-- IF PRODUCT.VariablePrice? --]
    <form action="[-- SHOPPING_CART_URL BASE --]/order.cgi" method="post">
    [--STORE.Price --]: [-- STORE.CurrencySymbol --]<input type=text name="[-- PRODUCT.RecordNumber --]:price" size="4" maxlength="10" value="">
    <input type="hidden" name="storeid" value="[-- STORE.ID --]">
    <input type="hidden" name="dbname" value="products">
    <input type="hidden" name="function" value="add">
    <input type="hidden" name="itemnum" value="[-- PRODUCT.RecordNumber --]">
    <input class="add" type="submit" value="[-- ADDTEXT --]">
    </form>

    [-- ELSE_IF PRODUCT.QuantityPricing --]
    [-- PRODUCT.QuantityPricing --]
    <form action="[-- SHOPPING_CART_URL BASE --]/order.cgi" method="post">
    Quantity <input type="text" size="2" name="[-- PRODUCT.RecordNumber --]:qnty" value="1">  
    <input type="hidden" name="storeid" value="[-- STORE.ID --]">
    <input type="hidden" name="dbname" value="products">
    <input type="hidden" name="function" value="add">
    <input type="hidden" name="itemnum" value="[-- PRODUCT.RecordNumber --]">
    <input class="add" type="submit" value="[-- ADDTEXT --]">
    </form>

    [-- ELSE --]

    # define a VAR to track if a product is on sale
    [-- VAR.SaleOn "no" --]

    # if product is on sale and there is a sale price, set VAR
    [-- IF PRODUCT.SaleOn--]
    [-- IF PRODUCT.SaleAmount --]
      [-- VAR.SaleOn "yes" --]
    [-- Else --]
      [-- VAR.SaleOn "no" --]
    [-- END_IF --]
    [-- END_IF --]

    [-- IF PRODUCT.DisplayPrice --]
    <br>
    [-- IF VAR.SaleOn "yes" --]
      <strike>[-- PRODUCT.Price --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.SaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --] [-- STORE.OnSaleText --]
      [-- IF PRODUCT.AltPrice--]
      <br>  <strike>[-- PRODUCT.AltPrice --]</strike>
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.AltSaleAmount --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- END_IF --]

    [-- ELSE --]
    # product is not on sale
      [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.Price --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- IF PRODUCT.AltPrice--]
        [-- PRODUCT.PriceSize Begin --][-- PRODUCT.PriceStyle Begin --][-- PRODUCT.AltPrice --][-- PRODUCT.PriceStyle End --][-- PRODUCT.PriceSize End --]
      [-- END_IF --]
    [-- END_IF --]
    [-- END_IF --]
    [-- END_IF --]
    [-- END_DEFINE PRODUCT --]
Return To: Product Template Home Page