When you've finished organizing your webshop's layout, you can start adding products using the Product element.
Add a product with the Product element
In the Editor, drag the Product element from the menu on the left and drop it in place on the (webshop) page. To add a product, click on the blue Choose product button.
In the Choose a product dialog, click on Add new product.
When you add a new product, you can enter various product details:
- Product name: Give the product an appropriate name (this is the name you'll see on incoming orders).
- Description: Enter a short description with more information about the product.
- Image: Add one or more images showing what the product looks like.
- Shipping: You can set shipping costs per product or based on weight (this is covered in more detail in step 4).
- VAT rate: If you've set multiple VAT rates for your webshop, you can indicate the rate per product. This is not necessary if you only have one VAT rate. Check out this article for more information on setting VAT rates.
- Price: Enter the sale price for the product.
- Stock: This is automatically set to show infinite stock. If you have limited stock, disable the unlimited stock option and enter a number. Stock levels are automatically updated after every customer order.
- Product variant(s): Add one or more product variants where applicable, e.g. different sizes, colors, or designs. You can also set different prices per variant.
- Product personalization with custom fields: Offer your customers the option to personalize products, for example with engraving or printing.
✔ Tip: Set up your webshop's layout by creating product categories.
Single products or product gallery
Alternatively, you can use the Product gallery element to add products to your website. This works in much the same way as the Product element.
We recommend using the Product element for individual products, for example if you offer a smaller range of products. The Product gallery element is more suitable for displaying several products on one page, and automatically ensures a uniform design that displays well on both desktop and mobile devices.
When using the Product element, your webshop will look something like this:
If you opt to use the Product gallery element, your webshop will look like this:
Your visitors can hover their mouse cursor over a product to see the Add to cart button, as shown here: