Creating Sample Theme Pages

You should create sample pages using your page and product templates so that merchants can have an idea of what their store pages will look like with your theme applied. If you plan to offer your theme in several color schemes, you should create a sample page in each color scheme.

You also need to create thumbnail images of your sample pages. ShopSite displays the thumbnail images on the Layout & Color Theme screen in the wizard and in the Preferences section of ShopSite. Merchants can click on these thumbnails to view the sample pages of your theme.

  1. Plan color schemes for your theme. Each built-in ShopSite theme is offered in eight different color schemes, but you can define as few or as many color schemes as you want. You may choose to only offer your theme in a single color scheme, for example, if you designed it specifically to conform to a certain merchant's store branding.

    You can define colors for the following page attributes:

    Note that you aren't restricted to using the colors in a scheme for just these named page attributes. For example, if your templates formats products in a table, you could set the background color for table cells based on the Link Color:

    <TD BGCOLOR=[-- PAGE.LinkColor --]>

  2. Use a ShopSite store to build a sample page. You will probably need to add products and enter product information, define a header and footer, and enter sample text in the various page fields. Make sure that your sample page includes all of the fields that your template displays.
  3. Set the colors for your sample page according to the first color scheme for your theme.
  4. Publish your store.
  5. Use your browser to view the page, then use a screen capture utility to take a screen shot of the page. Save the screen shot on your hard disk.
  6. Change the page color settings to match your next color scheme, then repeat steps 4 and 5. Continue this until you have taken a screen shot in each color scheme.
  7. ShopSite expects your sample theme pages to be HTML files, not just image files. So, for each color scheme, create a simple HTML file containing an <img> tag pointing to the appropriate screen shot.
  8. Make thumbnail images of your screen shots. The thumbnail size should be 50 pixels wide by 40 pixels high. You can create thumbnail images in most image editing programs by opening the original screen shots, then changing the image size, and then saving the pictures with new file names. You can also use a utility for making thumbnail images, such as:

ShopSite Help and Resource Center
February 13, 2004
Give Feedback


ShopSite Shopping Cart Software