Page History

...

The default theme's left column doesn't change much during, as it mainly serves as a handy placeholder for navigation and secondary links:

• (if logged in) "My account" block, with links to the customer's account pages.
• three of the default blocks help the user navigate the shop and filter content: tags, categories and manufacturers are the most common ways by which shoppers look for a given product.
• "View products" serves as a reminder of the products previously took interest in, and gives a shortcut back to these if he wants to pick them in the end.
• Finally, "Information" is where PrestaShop the default static pages, as written by the shop owner: delivery information, legal notices, T&C... They are not selling points, but their content is important enough that it warrants being always available.

"My account" block

Once the customer is logged in, the "My account" block appears in the left column. Its sole purpose is to give a quick access to all the personal pages for this customer:

• My orders. All past and currently processing orders.
• My credit slips. Received when an order has been canceled, credit slips can be used for any future order.
• My addresses. A customer can have many addresses, if only for having a product delivered to a friend's house, for instance.
• My personal info. First name, last name, e-mail address, home address, phone number, date of birth: all the necessary information about a customer.
• My vouchers. All coupons code that have not yet been used.

All in all, this block is a replication of the content of the "My account" page, which can be accessed from the eponymous link at the right of the header.

Categories

A category is a hierarchical way of sorting items: a category can contain any number of sub-categories, this making it possible to easily browse from the more general items to the more specific ones by following a logical path.

...

• Thumbnail on the left
• Name and description in the middle section
• Price, availability, "Add to cart" button and link to the product's page on the right

...

This list view enables the customer to see at a glance the products' main information when they already know everything they need about a product, allowing for a quicker decision process.

A click on the "Add to Cart" triggers a quick animation, moving the product's thumbnail over to the Cart block.

Image mapping

Some categories might feature a header image, where at least two products are displayed, and with direct link to these products. One category can feature an unlimited number of image-maps, which you can scroll through with the tool below.

<<<<<<< image

A "+" symbol is placed upon the products which are linked from that image. The image can feature as many links as necessary: in the default demo shop content, the iPod Nanos image-map features 9 links.

Product sorting

Products listing by category or manufacturer can be further sorted ( by price, name or availability). Listing .

<<<<<<<<<<<<<<<< image

Note that listing by tags does not allow for such sorting.

<<<<<<<<<<<<<<<< image

Product comparison

Products within a category can be compared to each other, thanks to each item's "Select to compare" checkbox. This is the only way to compare product, which is logical since there is no sense in comparing product that do not have the same characteristics/features.

Indeed, provided the product's information are complete and consistent, the comparison page will display with a row for each comparable feature. This is immensely useful, particularly for products with technical differences.

<<<<<<<<<<<<<<<< image

Customers can compare up to 3 products at a time.

Product pages

This is where all the information entered by the shop owner are available to the user. Depending on the theme design, a product page can be very thorough, with extension information, or simply present the most essential facts. The default theme is typical in that its most prominent feature is the product images, with a scrolling tool below it.

<<<<<<<<<<<<<<<<< image

Next to the image are two blocks:

• a "Short description" block, presenting the main facts for the current product in a free form way.
• the "Add to cart" block, with the possibility to choose among the available variations (as defined by the shop owner) and the quantity to be ordered.

At the bottom of the product page are tabs, the two default ones being:

• More info. This is where the customer will find the full description for the product, as entered by the shop owner. The content of this page is free form.
• Data sheet. This is where PrestaShop lists all the detailed featured that were entered in its database. This data is also the one that is used when comparing two products. Therefore, the content of this tab is very sparsely written: these are just raw facts, far from the free form description of the "More info" tab.

The Cart page

Clicking on the "Cart" button from the "Cart" block in the right column, or on the cart symbol in the header, brings the customer to the "Shopping cart summary" page, which is the first step in the order process, as indicated by the breadcrumb trail at the top, indicated the next steps in the process.

This page gives a succinct but complete view of the items that are in the cart: thumbnail, name, features, availability, price and ability to change the quantity of each product.

A detailed pricing is then displayed below, comprising the order's total cost with tax and shipping, and with if the case may be, an indicator of the voucher that was used. Further below, the available addresses.

Buying a product

Almost all the pages of an online feature an "Add to cart" button for a given product, and display a quick summary of the cart content. This makes it easy for customer to take the first step towards an order.

The whole process of buying a product on a PrestaShop site can follow different paths, but they all reach the same conclusion, called the "conversion funnel" in the e-commerce lingo: from the moment the cart is filled and the customer starts check it out, it has to click through various validation screens until the order is validated and can be processed.

This process starts when the customer clicks on either the cart block's "Check out" button (on any page) or the cart's summary's "Next" button on the Cart page), and always follows the same sequence of screens:

1. (if the visitor is not logged in) Display the authentication screen, where the visitor can either go to the account creation page, or log in.
2. The address-choosing page. Two addresses are necessary for an order:
   • The billing address, which should be the one that is tied to the payment method.
   • The delivery address, where the order should be sent. If you need to have it sent to another address, untick the "Use the same address for billing" box and either select one address among the already listed ones, or create a new one.
3. The shipping page. This is where the customer can choose among a few shipping and packaging -related options. Agree to the shop's terms of service is a must, but depending on what the shop can offer, the customer may be able to choose a recycled packaging, to gift-wrap the package (with an optional gift note), and select the carrier that most suits him.
4. The payment page. The customer can choose many payment options, depending on what the shop owner has set up. Cheque and credit card/Visa card are the most usual, but PrestaShop makes it easy to offer payment through eBay, Google Checkout or other 3rd party providers. The customer clicks on the chosen method and depending on the method is either sent over to the chosen 3rd party handler or continues to one of PrestaShop's page where he can enter the needed details, such as a validation before displaying cheque or bank-wire information.
5. Once the customer has validated everything, he reaches the confirmation, which begins with "Your order on name of the shop is complete".