Store, cart and checkout components
General storefront components overview
Your storefront was initially created with a template and/or theme. Both the template and the theme control the way your store is shown and operates to your customers, both from a design and functionality perspective. Going further, CloudCart allows you not only to select from a subset of different themes but also deeply customize the theme you have selected. This is achieved by using all the options under Storefront >> Widgets, and chose which component to add, remove or configure from each of the main component categories.
Below you can see a few options and operate with them in order to further customize your store, so it can work and look like your store!
CloudCart gives you full control of the way how your products are listed and filtered on the product page. If you want to change the default product listing settings, go to Storefront >> Widgets and click Product Listing. Here you can:
- Choose the maximum Products per page that you want your customers to see. The default number is 15, and you can change it to your preference.
- Change the default settings of the product page filter. The default options are 15, 30 and 50. You can change them by typing in the respective box, or add a new option by clicking the add ‘per page’ variants button.
- Select the default way that you need the products to be ordered. The options are date, name, price, sale and new.
- Choose which of the above options will be available to the customers, by checking or unchecking the respective selection box under Add ‘order by’ options.
- Create Custom Products price ranges, which enable users to see products in a specific price range.
Whenever a customer is visiting a product page, you can provide them with suggestions of similar products that are shown below the current product description.
1) Go to Storefront >> Widgets and click Related Products in the section called Store, cart and checkout.
2) To activate the related products functionality, toggle the Related products button to Active.
3) Select whether you want related products to include products that are Out of stock, by choosing the correct option from the drop-down menu with the same name.
4) Set the number of the related products in the Product count text field. The default number is 4.
Tip: Increase this number if your store has many products with similar characteristics. In this way, users will have a wider choice and will be more likely to buy something.
5) Select the order type and the order direction of the related products.
6) In the drop-down menu called Type, select the type of related products that will show on the product page:
- filter by category – means that customers will see related products from the same category
- filter by brand – means that customers will see related products from the same brand
- filter by tag – means that customers will see related products with the same tag
7) Click Save Widget.
Setting up product showcases is a unique way of creating up to three separate sections on the home page of your store. You can use them to promote specific brand or category and of course to highlight products that are currently on sale. To set up a showcase:
1) Go to Storefront >> Widgets and under Store, cart and checkout click the showcase that you want to customize (First, Second or Third).
2) Toggle the selection button to Active in order to make the showcase visible on the home page of your store.
3) Enter a Title for the showcase, e.g. “Summer Accessories”.
4) Under Products count, enter the number of the products that will be visible in the showcase.
5) Choose if you want to include New products in the showcase. You have three options: yes, no and both.
6) Choose if you want to include products on Sale in the showcase. You have three options: yes, no and both.
7) From the Filters drop-down menu, select the specific group of products that will be visible in the showcase. You have four options:
- Filter by product category
- Filter by brand
- Filter by product
- Filter by tag
8) Click Save Widget.