...
The footer gives access to pages that could be useful to a user who haven't found anything interesting to him, and thus has scrolled to the bottom of the screen. Depending on whether the user is connected or not, there can be 4 to 5 blocks of content.your users.
- A list of the shop's categories
- (if connected) Links the main pages of the user's profile.
- The "Informations" block, containing:
**Three links to products lists:- Specials: all the current promotions.
- New products: recently added items.
- Top sellers: most popular items.
- Four links to informational pages:
- Our stores
- Contact us
- Terms and Conditions
- About us
- The "Follow Us" block, containing links to your shop's Facebook and Twitter accounts, and a link to your CMS's RSS feed.
- The "Contact Us" block, containing the address, phone number and e-mail address of the shop.
...
The default theme's left column doesn't change much during the whole browsing and buying experiencestays primarily static, as it mainly serves as a handy placeholder for navigation and secondary links:
...
Once the customer is logged in, the "My account" block appears in the left column. Its sole purpose is to give a the customer quick access to all the his or her 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 instanceadd multiple addresses for different delivery options.
- 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 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.
...
A category is a hierarchical way of sorting items: a category it can contain any number of sub-categories, thus making it possible to easily browse from the more general items category listings to the more specific ones products by following a logical path.
A PrestaShop shop can have as many levels of categories and sub-categories as needed, as well as with an infinite number of categories and products in a given category level. All categories are in fact actually sub-categories of the root category, the "Home." one.
This is also the only product list view were where the customer can compare products , by ticking their checkbox and validating his choice using selecting the "Compare" button.
Tags
...
The shop owner can indicate a set of tags for each product. A tag is a non-hierarchical keyword, also described as metadata: it is not displayed on the product page as it does not bring any useful information, but it can prove very useful when building thematic lists – such as a tag-cloud, where the most common tags are written in a bigger font than the rarer ones.
Manufacturers
The customers Customers can choose to display all the products from a single manufacturer, regardless of their types or prices.
...
The default theme's right column hardly ever changes in the course of the shopping experience. Its main block is the "Cart," one, where the customer can glance over and see what he has currently chosen to buy currently in his cart and how much he is expected to pay for it allit will cost, and remove unwanted product at the with a click of the mouse.
It also gives a your customers quick access to the current promotions (if any) through the "Specials" block. Finally, the customer customers can locate the closest store by clicking on the "Our stores" block.
...
These three blocks are always available, from any page, in the default theme.
The middle
...
column
This is where the magic happens. The middle section changes constantly in response to adapt to the customer's choices.
The front page
...
These are followed by the "Featured products" block, presenting 4 of the products that the shop owner chose to highlight, either for their novelty or their current price.
...
Most seasoned web surfers will enter visit a shop via a search engine, landing directly on a product of or category page. Few stumble upon the home page, and this is why it should be tailored to new users, with a proper presentation.
Product listing pages
Categories, tags, manufacturers, search, specials, best sellers or new products: PrestaShop has many paths to a product, but in the end the customers is given a familiar listing of products, within the chosen context.
...
Despite the differing content, these listings this listing designs are very similar, so as in order to keep it familiar to even for the newcomers:
- 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
...
A click on the "Add to Cart" triggers a quick animation, moving sending the product's thumbnail over to flying into the Cart block.
Image mapping
...
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 Product listing by category or manufacturer can be further sorted by price, name or availability.
...
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 Provided the product's information is 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.
...
- 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 option to choose among the available variations (as defined by the shop owner) and the quantity to be ordered.
...
- 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 block is free form.
- Data sheet. This is where PrestaShop lists all the detailed featured that were entered in its into 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 product description of in 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 indicating the next steps in the order 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 Detailed pricing is then displayed below, comprising including the order's total cost with tax and shipping, and with if the case may be, an indicator applicable, a description of the voucher that was used. Further below, the available addresses are displayed.
...
Because it is one of the main sources of lost customers for online shops, PrestaShop makes it really easy simple and straightforward to create a customer account.
When clicking the "Your account" or "Log in" links, the visitor is taken to the authentication page, where they have to fill one of two forms:
- Create an a new account.
- Log in Login to an existing account.
The first step for a new customer to create his account is to enter his e-mail address in the form and validate. This will bring him to the account creation page itself. Two blocks of information are necessary to fill in order to get an account:
...
Once registered, the customer is redirected to the "My account" page, where he can already see what he has access to: order history, credit slips, vouchers, and access to the previously entered information.
Buying a product
Almost all the pages of an online shop feature an every page of your store features an "Add to cart" button for a the given product, and display displays a quick summary of the cart cart’s content. This makes it easy for customer customers 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, this is called the “conversion funnel”: from the moment the cart is filled and the customer starts to check it out, it he has to click progress through various validation screens until the order is validated and can be processed.
| Info |
|---|
This is called a conversion funnel because this is where a lot of online shops lose clients because of due to overly long, complicated or numerous screens. Read more on Wikipedia. |
...
- (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.
- 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 deselect the "Use the same address for billing" box and either select one an address among from the already previously listed ones, or create a new one.
...
- The shipping page. This is where the customer can choose among a few from different shipping- and packaging- related options. Agree Agreeing to the shop's terms of service is a mustrequirement, but depending on what the shop can offer, the customer may be able to choose a recycled packaging, to gift-wrap the package wrapping (with an optional gift note), and select the carrier a choice of carriers that most suits him.
- The payment page. The customer can choose many payment options, depending on what the shop owner has set up. Cheque Check and credit card /Visa card are the most usualcommon, but PrestaShop makes it easy to offer payment through PayPaleBay, 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 third-party handler or continues to one of PrestaShop's page pages where he can enter the needed details, such as a validation before displaying cheque check or bank - wire information.
- Once the customer has validated everything, he reaches the summary page, which begins with "Your order on (name of the shop) is complete". Depending on the chosen mean method of payment, some final information should be provided to the customer, along with a notification of the that a confirmation e-mail having has been sent and a link to the customer support page. The customer must click on the "I confirm my order" button in order to have it validated
...
On this map, stores are indicated using the shop's logo. A click on that logo brings up a small pop-up reveals the full address and phone number, as well as the opening busniess hours for the store, as indicated by the shop owner.