Screen: ShopSite > Products > Edit Product Layout

Product Templates

ShopSite uses Product Templates, along with other individual product options, to control the layout of your product information on Store Pages, More Info Pages, and Search Results screens. Each template will present product information in a different manner.

Product Templates are set by Themes, and several of the built-in templates were created to work with a specific theme (these usually include the theme name in the template name). You can also select product templates when you add a product or edit a product. There are several built-in templates that you can pick from, or you can create your own Custom Product Template.

Some product templates are designed to be used for specific purposes, and may not work well when used differently. The classy_se_prod_template.sst, elite_001_se_prod_template.sst, and search_product templates are designed to be used as search override templates (see Preferences > Search Settings > Search Layout) and do not create More Info Pages. The awesome_blue_001_pr_template.sst, awesome_orange_001_pr_template.sst, sg_product_template, and tab_product_template are designed to be used as part of a theme, and may not work properly if used without the appropriate Page Template. None of the previously mentioned templates are included in the list below.

Template Examples

The examples below demonstrate how the product will be presented in various built-in templates. The Image Alignment and TextWrap product layout settings will affect the position of the product image relative to other product information:



Default Product Template - This is a very basic layout that displays all product information on separate rows, with the graphic to the side or centered above (based off the Image Alignment setting). This template is used by the Mondrian, Lefty, Matte, Top Notch, and Plain themes, and does not support the variable price feature. You can not copy or modify this template.

Product Name
$9.99
123456
This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description.

[Add to Cart] [View Cart]



Graphic Over Text - This is a simple layout that displays product information on separate rows, with the graphic at the top. The Image Alignment and TextWrap settings have no effect on this template. This template does not support the variable price feature. More Info Pages are identical to the Default Product Template. You can not copy or modify this template.


Product Name
$9.99
123456
This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description.
[Add to Cart] [View Cart]



Compact - This is a minimal template, displaying all product information except the description on a single line, with the description below it. The Image Alignment and TextWrap settings have no effect on this template. This template does not support the variable price feature. More Info Pages are identical to the Default Product Template. You can not copy or modify this template.

Product Name $9.99 123456 [Add to Cart] [View Cart]
This is the Product Description. This is the Product Description.



Compact with Graphic over Text - This template displays the product image on one line, the other product information except the description on the next line, and the description on a third line. The Image Alignment and TextWrap settings have no effect on this template. This template does not support the variable price feature. More Info Pages are identical to the Default Product Template. You can not copy or modify this template.


Product Name $9.99 123456 [Add to Cart] [View Cart]
This is the Product Description. This is the Product Description.



Inline - This minimal template displays the product image, name, price, and SKU on one line, with the product description on a second line, then the purchase information on a third line. The Image Alignment and TextWrap settings have no effect on this template. This template does not support the variable price feature. More Info Pages are identical to the Default Product Template. You can not copy or modify this template.

Product Name $9.99 123456
This is the Product Description. This is the Product Description.
[Add to Cart] [View Cart]



Inline with Graphic over Text - This template displays the graphic on one line, with the name, price, and SKU on a second line. The Product description and purchase info are on the third and fourth lines respectively. The Image Alignment and TextWrap settings have no effect on this template. This template does not support the variable price feature. More Info Pages are identical to the Default Product Template. You can not copy or modify this template.


Product Name $9.99 123456
This is the Product Description. This is the Product Description.
[Add to Cart] [View Cart]



One Line - This template displays everything on a single line, starting with the image, name, and SKU, then the product description, price, and purchase information. The Image Alignment and TextWrap settings have no effect on this template. This template does not support the variable price feature. More Info Pages are identical to the Default Product Template. You can not copy or modify this template.

Product Name 123456 This is the Product Description. $9.99 [Add to Cart] [View Cart]



DefaultCustomProductTemplate - This template displays product information on individual lines, with the graphic beside or above the other information (based off the Image Alignment setting). This template is used by the Tabbed, Rounded, Sidebar, and Stained Glass themes. It supports all current ShopSite settings. More Info Pages are essentially the same as the product, without any additional layout elements.

Product Name
$9.99
123456
This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description. This is the Product Description.



Classy Product Template (classy_pr_template.sst) - The Classy template is used by the Classy theme, but it can also be used on its own. This template was introduced in version 8.1 and implements all the options available in the Back Office, except it does not display a [View Cart] button. The presentation is divided into four blocks: Info (Name, SKU, Price), Purchase (Add to Cart button, Quantity box, etc.), Graphic, and Description. How these blocks are arranged depends on your Image Alignment and TextWrap settings. More Info Pages use the same format within a Classy page layout.

Layout Settings Product Appearance
TextWrap: On
Image Alignment: Left
Product Name
12345
$9.99

Quantity:

rubber duckey This is the coolest product ever made.
You want to buy it. Everybody wants one.
TextWrap: On
Image Alignment: Right
Product Name
12345
$9.99

Quantity:

This is the coolest product ever made.
You want to buy it. Everybody wants one.
rubber duckey
TextWrap: On
Image Alignment: Center
Product Name
12345
$9.99
rubber duckey

Quantity:

This is the coolest product ever made.
You want to buy it. Everybody wants one.
TextWrap: Off
Image Alignment: Left
rubber duckey
Product Name
12345
$9.99

Quantity:

This is the coolest product ever made.
You want to buy it. Everybody wants one.
TextWrap: Off
Image Alignment: Right
Product Name
12345
$9.99

Quantity:

This is the coolest product ever made.
You want to buy it. Everybody wants one.
rubber duckey
TextWrap: Off
Image Alignment: Center
rubber duckey
Product Name
12345
$9.99
Quantity:
This is the coolest product ever made.
You want to buy it. Everybody wants one.



Cross Sell Template (CrossSell-Sky-product) - This template, designed for the Cross Sell theme, displays the product name, description, SKU, price, and purchase information on separate rows. It was introduced in version 8.1. With TextWrap turned off, the image is above the other information, aligned according to the Image Alignment setting. If you turn TextWrap on with the image aligned either left or right, the image will appear beside the other information on the designated side. This template uses Sub-products as cross-selling products that are listed on the product More Info Page. More Info Pages use the same format on a Cross Sell page layout.

rubber duckeyProduct Name

A Product Description Like None Other!

SKU 123456

9.99



Gradient Template (gradient1-product.sst) - This template, designed for the Gradient theme is identical to the Cross Sell Template, except that Sub-products are treated as normal Sub-products instead of as cross-sell items. It was added in version 8.2. More Info Pages use the same format within a Gradient page layout.



Elite Product Template (elite_001_pr_template.sst) - The Elite product template is designed for use with the Elite theme, but it can also be used with other Page templates as well. This template supports all the product options in the back office, except that it does not display a [View Cart] button. More Info Pages use the same format within an Elite page layout.

rubber duckeyProduct Name
123456
This is the Product Description. It is, in fact, a very, very long product description that takes up a whole lot of space. Lots of space, really. It's even bigger than a breadbox. It takes up more space than space itself. Space like you wouldn't believe. Huge, enormous, gargantuan quantities of space, just to describe this product. It must be a very important, special product indeed. Well, actually, it's not really that big at all, and it really doesn't say anything, so I'm really not even sure why it's here to begin with.

Select a color:

Quantity: $9.99



Modern Product Template (ModernProductTemplate.sst) - The Modern Template, used by the Modern and Clean themes, can be used with most page templates. Subproducts using this template are displayed with an individual checkbox and a single [Add To Cart] button for all the subproducts. This template supports most of the product display options in the back office, but does not display a [View Cart] button.

rubber duckeyLorem ipsum
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam ornare nonummy lacus. Proin nulla quam, tincidunt eget, porta at, fermentum sit amet, lectus. Integer lectus. Sed sollicitudin egestas nulla. Cras consectetuer leo a felis. Nullam non mi. Duis sed turpis. Phasellus arcu elit, malesuada sagittis, congue in, auctor non, odio. Nunc sed neque id felis adipiscing mollis. Praesent sapien. Etiam risus eros, faucibus dictum, tincidunt quis, tristique sed, risus. Nunc sed quam. Nam lobortis nisi quis felis.
Nullam non mi $19.95
Consectetuer leo a felis $24.95




ShopSite Help and Resource Center
Last updated: March 01, 2010
Give Feedback


ShopSite Shopping Cart Software