Start by creating a
_products directory to hold your product pages.
Create a new page for each product, such as
product1.md. In the front matter for this page you can set the standard settings, such as your title, subtitle, description (for meta-description), hero_image, as well as the additional product settings such as price, product_code, image, features, and rating.
title: Product 1 Name subtitle: Product 1 tagline here description: This is a product description hero_image: /img/hero-img.jpg product_code: ABC124 layout: product image: https://via.placeholder.com/640x480 price: £1.99 + VAT features: - label: Great addition to any home icon: fa-location-arrow - label: Comes in a range of styles icon: fa-grin-stars - label: Available in multiple sizes icon: fa-fighter-jet rating: 3
The text you write for the page content will be displayed as the product description.
Next, add the following to your
_config.yml to use collections to process the product pages and output them as individual pages.
collections: products: output: true layout: product image: https://via.placeholder.com/800x600 show_sidebar: false
You can also set default product page values here if you like, such as the layout or image.