XHTML Style Creation
A template style is a collection of files, including any folders, images, and CSS, packaged up in a single ZIP file. If you have multiple CSS files, it is recommended that they are combined into a single CSS file.
Template ZIP File Format
A template style is a collection of files, including any folders, images, and CSS, packaged up in a single ZIP file. If you have multiple CSS files, it is recommended that they are combined into a single CSS file.
Main Template File
- For the primary look and feel template of your website, we will look for a file named window.xhtml in your ZIP file.
- The template file must be a valid XHTML file, and therefore should include the XHTML namespace in its HTML element:
<html xmlns="http://www.w3.org/1999/xhtml">
- Within the template file we will look for two comments:
<!-- TemplateBeginEditable name="Content" -->
<!-- TemplateEndEditable -->
Whatever is between these two comments will be replaced with custom, dynamic HTML to create the final page that is displayed.
Images and CSS
- Any images and CSS referenced from your template file, and included in your final ZIP file, will be automatically used.
- It is highly recommended that multiple CSS files are combined into a single CSS file.
- Do not link to images and CSS external to the ZIP file. This will cause error messages for users when using secure SSL connections.
- For widest compatibility, use "relative" references to images and CSS from your template. For example, assuming you've included a folder called "images" in your ZIP file:
would be a relative reference because the "src" does not begin with a forward slash "/"
<img src="images/mylogo.gif" alt="logo"/>
Tips
Common problems when working with templates relate to their XML format. The following tips are solutions to common problems.
- Replace <br> with <br />
- Replace with  
- Replace ©, or any other copyright symbol, with ©
- All tags should close. For example, "img" (image) tags must end with "/>"
- The entire <head> tag, along with the attributes of the <body> tag, will be overwritten.
Example
- An example template is available for download.
- This example illustrates a simple, working, template format.
Including Javascript Files
To include javascript files in your style, the <script> tag must be in the <body> instead of the <head>. When possible, placing script references towards the bottom of a body will have the best performance.
Favicon Support
To include a 16x16 favicon in your style, place either a favicon.ico, favicon.gif or favicon.png in the main / root directory of your style. The system will automatically recognize the image and include it in the <head> tag.
Optional Security Info
A security logo or SSL badge / logo / graphic may be automatically inserted by adding the following two comments. The typical size of this information is 115 pixels wide by 82 pixels high.
<!-- TemplateBeginEditable name="Security" -->
<!-- TemplateEndEditable -->
If a transparent background is desired, then use the following 2 comments instead:
<!-- TemplateBeginEditable name="SecurityTransparent" -->
<!-- TemplateEndEditable -->
Optional PayPal Logo
For PayPal express checkout orders, a logo may be inserted at the top of PayPal's checkout interface / page flow. This is accomplished by creating a folder called "paypal" in your ZIP, and adding an image to the folder named header.gif, header.jpg, or header.png. The image has a maximum size of 750 pixels wide by 90 pixels high.