Creating a Custom Page Template
A page template defines the elements and layout of a page in a store. The content of each element comes from the values that the merchant enters for the page in the ShopSite back office, and the template tells ShopSite which elements to include and how to arrange them when publishing the store.
Typically, a template contains standard HTML tags to specify the layout, and ShopSite custom template tags to specify the elements from the ShopSite database that are to appear on the page. A template can include HTML table tags, frame tags, and even JavaScript and other Web enhancements.
When ShopSite publishes a store that uses custom templates, the ShopSite parser finds all the custom tags in the template and replaces them with information from the pages and products databases.
A merchant can use the same template for all pages in a store, or choose a page template for each page in the store. For example, a store's welcome page might use one template, product pages might use another template, and customer service or "about us" pages might use a third template.
To create a page template and make it available to merchants:
- If you do not have experience with ShopSite, you should spend time configuring and viewing the ShopSite demo stores from both the merchant and customer perspectives. You need to have a fairly solid understanding of what information is stored for pages and products, and how the built-in templates present that information.
- Use the merchant interface to look at the page contents and page layout information for a page.
- Publish the store, then click the My Store button to see how ShopSite used the page information to produce the page that customers see.
- Change some of the page contents and layout settings, then Publish the store again and look at the page.
- Assign some products and page links to a specific page, then publish the store and view the results. Change the assigned items, and change the order of the items, then publish the store again and look at the results.
- View the source of some of the pages to better understand the relationship between the page information and the HTML tags that ShopSite generates.
- Study the custom template specification, the sample page template, and the annotated screen shot of a page produced from the template.
- Use an HTML authoring program or a text editor to create a page template.
- Give the template file a descriptive name, but the file name cannot start with two digits and an underscore, such as "01_xxx" - that format is reserved for the built-in ShopSite templates. The file name does not need an extension.
- If you use an HTML authoring program, enter the ShopSite custom tags as plain text.
- Some authoring programs might complain about the DEFINE and END_DEFINE tags being outside the <HTML> and </HTML> tags, but they must be outside for the ShopSite parser to create pages correctly.
- If you are using ShopSite Pro, you can upload the template from the Merchandising > Custom Templates screen. Or you can FTP the template to the correct directory:
- Transfer the files using either binary or ASCII mode transfer, so that the line break characters get converted from the operating system of your computer to the operating system that ShopSite is running on. Do no just copy the files over a network or via floppy.
- To make the template available to a single store, copy it to the /templates/pages directory under the store's data directory. Create the directories if they don't already exist.
- To make the template available to all stores in a mall, copy it to the /templates/pages directory under the ShopSite CGI directory.
- Test your template:
- Add a page to a test store and assign the template to the page.
- Enter values for all the fields used by the template.
- Publish the store and review the Publish Results page for any error messages.
- Go to the store and view the page in a browser. Verify that all the page elements are there and that the layout looks the way you planned.
- View the page using other browsers that customers might use, to make sure the page looks okay in all browsers.
- Delete the values for some of the fields used by the template, then publish the store again and make sure the pages still look okay.
- Check the HTML of the page by running it through an HTML validator, such as http://www.htmlhelp.com/tools/validator or http://validator.w3.org.
- View the source of the page. If the ShopSite parser did not recognize a tag, or if a database field was empty, it replaced the ShopSite custom tag with an HTML comment tag containing information about the problem.
- Make any necessary changes and test the template again, then tell the merchant that it is available. The merchant should be able to select the template from the Add a Page screen (advanced editing version) or the Edit Page Layout screen.