A display window page is used as a template by product categories whose display type is Display window.

Description

The display type of the product category is selected in the product category setting form in the Display type item.



You can use a display window as a watershed if a product category contains multiple subcategories. On the page, you can display e.g. product category images, names and descriptions as well as a list of products belonging to the subcategories.

Template properties

Template location
themes/shop/THEME/category-front.html
Template URL
/category/ID/tuoteryhmän-nimi
Scope
tuoteryhmä

Default theme implementation

{Helper(file:'helpers/header')}
<div id="SidebarBg">
	<div id="Main" class="clearfix">
		{Helper(file:'helpers/sidebar-left')}
		<div id="Primary" class="Column">
			<div id="BannerScroller">
				<div id="ScrollableBanners">
					{CategoryImage(
						width: 576,
						before: '
							<div class="FrontBanner" id="FrontpageCategoryImage">
						',
						after: '
							<div class="BannerInfo">
								<h3>{PageTitle}</h3>
							</div>
						</div>'
					)}
					{Banners(name:'frontpage',helper:'helpers/homepage-banners')}
				</div>
			</div>
			<div id="LandingPageWrapper" class="clearfix">
				<div id="PrimaryFeatures">
					<div id="PageHeader">
						<h1>{PageTitle}</h1>
						{CategoryDescription}
					</div>
					<div id="ShopLikes" class="fb-like" data-send="true" data-width="354" data-show-faces="true" data-font="arial" data-href="{FacebookPageURL(or: '{ShopUrl}{CanonicalUrl}')}"></div>
					{Products(
						classes:'first|',
						helper: 'helpers/listproduct'
					)}
					{NewProducts(
						limit:6,
						classes:'first|',
						type:'normal',
						timelimit:'-4 months',
						before:'<h2 class="BoxHeader">{%NewProducts}</h2>',
						helper: 'helpers/listproduct'
					)}
				</div>
				<div id="SecondaryFeatures">
					{TopSellers(
						limit:10,
						type:'normal',
						helper:'helpers/listproduct-small',
						before:'<h2 class="BoxHeader">{%BestsellingProducts}</h2><ol class="ProductList">',
						after:'</ol>'
					)}
					{HotPicks(
						limit:10,
						type:'normal',
						helper:'helpers/listproduct-small',
						before:'<h2 class="BoxHeader">{%RecommendedProducts}</h2><ul class="ProductList">',
						after:'</ul>'
					)}
					{SearchPopularTerms(
						limit: '10',
						before: '<h2 class="BoxHeader">{%SearchPopularTerms}</h2><ul class="NavigationList">',
						after: '</ul>',
						helper: '{{ <li><a href="{SearchUrl}">{SearchKeyword}</a></li> }}'
					)}
					{SubCategories(before:'<h2 class="BoxHeader">{%BrowseCategories}</h2>')}
				</div>
			</div>
		</div>
		{Helper(file:'helpers/sidebar-right')}
	</div>
</div>
{Helper(file:'helpers/footer')}