Tutorial: Product Pages

posted by clewis
Sep 2

To create a product page you must do the following:

  1. Create a new page
  2. On the left side, under “Attributes” use the drop-down list to set the “Template” to “Products
  3. Add a title for the page
  4. Set the page order
  5. Insert an image into the post by clicking the “Add an image” icon
  6. Upload the appropriate image – by default this should be 200×200 but can really be anything. Tall products should appear beside each other on their own lines if possible
  7. Set the title – this is used for the product title that gets displayed on the page
  8. Unfortunately, you have to write html to include the product bullet points. The type of HTML is called an Unordered List (“ul”). Each item in the list will be a List Item (li). In the description, add the following:
    <ul>
    <li></li>
    </ul>
  9. For each point, you want to enter text between the “<li>” and “</li>” tags. For example, “<li>Single and Double tub</li>
  10. If you need additional points add more “<li></li>” tags
  11. If the image needs to be resized to 200×200 than set the image size to “small”
  12. Click “Insert into Post”
  13. Publish the page

Known Issues:

This is not the final solution for the product functionality. This is a temporary solution to get the site up. There are some limitations that we cannot get around until a better solution is in place. Please be aware of the following:

  • Image order cannot be adjusted and has nothing to do with the order the images appear on page. It’s in reverse chronological: the last product uploaded is the first product shown on a page. Try to upload the images in the opposite order you want them to appear.
  • A product can only appear in a page once. If you want the same product on multiple pages you have to upload the same image multiple times
  • You cannot edit a product once it’s been inserted
  • You must delete a product from the media library to remove it from the page

– Chris Lewis

Sept. 02, 2009

Categories: Tutorial


Comments are closed.