Compatibility:

WebSite X5 Evo and Pro


After having set up your e-commerce cart (see: How to create an e-commerce), you need to report on your pages the necessary information and tools to enable your potential customers to check out the products you offer and to place an order.


Instead of manually create the pages to showcase your products, especially if you have many,  you can use the Product Catalog Object to create a real online catalog for your products in just a few clicks. Select the products you want to be displayed in the automatically created Product Sheets, which report the most important details and which enable the users to proceed with the purchase.


How to choose the products to include in a Product Catalog Object

You can present a variable number of products in a single Product Catalog Object. You don't have to establish this number before you start: a product card will be created for each product you add to the list, and each card will be added to the same page.

  • After you have created the Product Catalog in Step 1 - Shopping Cart, go back to Step 3 - Sitemap Creation, select the page to work on and insert a Product Catalog Object in a Cell in the page layout table.
  • Double-click on the inserted object to open the Product Catalog Object > List window.
  • The Category and Product List shows all the products in the e-commerce shopping cart, ordered by Category. Now you can:
    • Click (to tick) each product you want to include in the list.
    • Click on a category to automatically include all the Products in it. If you subsequently add new Products to the Category, these will be automatically added to the Product Catalog Object.


How to define the style of the product cards

Every product in a Product Catalog Object is presented on a card created automatically by the Program. You can define the style of these cards:

  • Open the Product Catalog Object > Settings window and choose the display type. For example, if you choose Cover on the left, title and contents on the right, the product's cover picture will be displayed on the left and the information on the product will be on the right in all the cards.
  • Use the options available for indicating how many cards must be shown per row, their height, the size of the cover picture and the margins.
  • Indicate which items in the cards must be displayed, and their graphic settings (font, color, borders and margins).
  • If you are using the Pro edition, you can complete the product card with ribbons that highlight the new products or any special offers.


The cards created by the Product Catalog Object are a quick and efficient way of presenting the products in your catalog of the online store. Alternatively, you can create the product presentation pages manually, but don't forget to add the "Buy now" button.