Section & Variations › Product Details Page

Available Parameters
Parameter Type Description
variation Text
required
Default : product-details-variation-2 		Selected variations for Product Details Page section.
List of available variations :
  • product-details-variation-2
  • product-details-variation-3
title Text
required 		Set title for Product Details Page section.
description Text HTML
required 		Set description for Product
breadcrumbs Array of Menu Item Set breadcrumbs for Product Details section.
Example:
[
    ['homepage.html' , 'Home page'],
    ['product-list.html' , 'Collection'],
    ['product-list.html' , 'Summer Sale'],
    ['product-list.html' , 'Men'],
    ['product-list.html' , 'Outter'],
]
category Text
required 		Set category name for Product.
price Price Object
required 		Set price details for Product.
Example:
{
    'regular'     : '$422.00',
    'sale'        : '$380.00',
}
rating Rating Object
required 		Set rating details for Product.
Example:
{
    'score'       : 4.8,
    'description' : '(890 reviews)',
}
variations Array of Variation Item Set variations for Product.
Example:
[
    {
        'variationName'     : 'Color:',
        'type'              : 'selectColor',
        'options'           : [
            {
                'name'             : 'Pale Taupe',
                'color'            : '#B49C90',
                'border'           : '#B49C90',
            },
            {
                'name'             : 'Eggshell',
                'color'            : '#EEEBDD',
                'border'           : '#E1E1E1',
            },
            {
                'name'             : 'Heavy Metal',
                'color'            : '#2C2C2C',
                'border'           : '#2C2C2C',
            }
        ]
    }
]
images Array of Filename
required 		Set list of Product Images.
The value is array of image filename in the [SRC-Assets]/images/ folder.
moreInformations Array of More Informations
required 		Set list of More Informations for Product.
Example:
[
    {
        'title' : 'Description',
        'description' : '<p>Convenient mini sizes with high-level wrinkle-fighting power. This skincare starter kit includes travel-size Benefiance Wrinkle Smoothing Day Cream SPF 23 to deeply hydrate and protect.</p><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
    }
]
Available Variations
Product List Snippet Variation 2 Starter Kit Codes 
{# include sections/product-details  #}
{% include "../resources/sections/product-details.twig", with {
    	'variation'	: 'product-details-variation-2',

	'title'		: 'Slim Fit Waffled polo shirt',
	'description'	: '<p>Beauty is in the details lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique comfort and quality go hand in hand and these materials.</p>',

	'breadcrumbs'	: [
		['homepage.html'		, 'Home page'],
		['product-list.html'	, 'Collection'],
		['product-list.html'	, 'Summer Sale'],
		['product-list.html'	, 'Men'],
		['product-list.html'	, 'Outter'],
	],

	'category'	: 'Men&apos;s Tees',

	'price'	: {
		'regular'	: '$32.00',
	},

	'rating'	: {
		'score'		: 4.8,
		'description'	: '(890 reviews)',
	},

	'variations'	: [
		{
			'variationName'	: 'Color:',
			'type'			: 'selectColor',
			'options'		: [
				{
					'name'	: 'Pale Taupe',
					'color'	: '#B49C90',
					'border'	: '#B49C90',
				},
				{
					'name'	: 'Eggshell',
					'color'	: '#EEEBDD',
					'border'	: '#E1E1E1',
				},
				{
					'name'	: 'Heavy Metal',
					'color'	: '#2C2C2C',
					'border'	: '#2C2C2C',
				},
			],
		},
		{
			'variationName'	: 'Size',
			'type'			: 'selectButton',
			'options'		: [
				{
					'name'	: 'S',
				},
				{
					'name'	: 'M',
				},
				{
					'name'	: 'XL',
				},
				{
					'name'	: 'XXL',
				},
				{
					'name'	: '3XL',
				},
			],
		},
	],

	'images'	: [
		'fashion-product-details-1.png',
		'fashion-product-details-2.png',
		'fashion-product-details-3.png',
		'fashion-product-details-4.png',
	],

	'moreInformations'	: [
		{
			'title'		: 'Materials & Care',
			'description'	: '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
		},
		{
			'title'		: 'Size Guide',
			'description'	: '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
		},
		{
			'title'		: 'Shipping Info',
			'description'	: '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
		},
	]
  } %}
Product List Snippet Variation 3 Starter Kit Codes 
{# include sections/product-details  #}
{% include "../resources/sections/product-details.twig", with {
    	'variation'	: 'product-details-variation-3',

	'title'		: 'Virena Smoothing Starter Set',
	'description'	: '<p>Begin your wrinkle smoothing routine with this starter kit, featuring three skincare powerhouses in mini sizes for daily anti-aging hydration and sun protection. Ideal for trial or travel.</p>',

	'breadcrumbs'		: [
		['homepage.html'		, 'Home page'],
		['product-list.html'	, 'Skincare'],
		['product-list.html'	, 'Power Infusing Eye Concentrate'],
	],

	'category'		: 'Skincare',

	'price'	: {
		'regular'	: '$32.00',
	},

	'rating'	: {
		'score'		: 4.0,
		'description'	: '(260 reviews)',
	},

	'images'	: [
		'cosmetics-product-details-1.png',
		'cosmetics-product-details-2.png',
		'cosmetics-product-details-3.png',
		'cosmetics-product-details-4.png',
		'cosmetics-product-details-5.png',
		'cosmetics-product-details-6.png',
	],

	'moreInformations'	: [
		{
			'title'		: 'Description',
			'description'	: '<p>Convenient mini sizes with high-level wrinkle-fighting power. This skincare starter kit includes travel-size Benefiance Wrinkle Smoothing Day Cream SPF 23 to deeply hydrate and protect.</p><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
		},
		{
			'title'		: 'How to use',
			'description'	: '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><p>Convenient mini sizes with high-level wrinkle-fighting power. This skincare starter kit includes travel-size Benefiance Wrinkle Smoothing Day Cream SPF 23 to deeply hydrate and protect.</p>',
		},
		{
			'title'		: 'Ingredient',
			'description'	: '<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p><p>Convenient mini sizes with high-level wrinkle-fighting power. This skincare starter kit includes travel-size Benefiance Wrinkle Smoothing Day Cream SPF 23 to deeply hydrate and protect.</p><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>',
		},
	]
  } %}