Product Catalog for ViewModel

The Product Catalog for ViewModel app is a paragraph app which is used to publish product data to frontend. It functions much like the regular Product Catalog app but uses ViewModels for added speed and code-hinting support.

Feature-wise, the Product Catalog for ViewModel app is comparatively light-weight; many of the more advanced settings & features associated with the product catalog app must now be handled elsewhere:

• In the product index and at the query level
• In the template using .NET Razor
• Using a page URL provider
• Etc.

The key functionality has not changed – the app is used to:

• Select a subset of products to publish
• Configure display-related settings such as the number of products to show before paging
• Control how the product data is rendered via templates

In contrast to the regular product catalog app, the only context accepted is an index query (Figure 2.1).

Figure 2.1 Selecing products

Basically, you are required to:

• Select a query to use for publishing products - you can also specify if you want this query to be tracked for search statistics
• (Optional) Select one or more facet groups associated with the query – facet groups are used to create filters in frontend so the customer can narrow down their search results
• (Optional) Override default parameters – you can override/set default parameter values for each query parameter here. This can be useful if you want to force a product catalog to show only a subset of your products by default, e.g. if you’re using the same query on several product catalogs
• (Optional) Define a sort order using the SortBy selector – the default value is Sort (Primary group)

If you check Use group sorting in group context the sort order defined in Sort By is overridden – whenever a GroupID parameters is present in the URL, the primary sort order of the product list will be set to the sort order of the group in question.

The Spell Check section (Figure 3.1) is used to implement Did you mean suggestions.

Figure 3.1 Spell check settings

The Display settings (Figure 4.1) are used to control a couple of frontend-related options.

Figure 4.1 Display settings

You can specify how many products per page to display before creating a new virtual page for pagination purposes

The Templates section (Figure 5.1) controls how the products returned by the query are presented in frontend.

Figure 5.1 Templates

The supported templates are:

• The List template controls how product lists look - it should inherit the ProductListViewModel
• The Product template controls how a single product is displayed, usually when it is clicked on from the List – it should inherit the ProductViewModel
• The Compare template exists to allow you to write product comparison code in a dedicated template – it should inherit the ProductListViewModel
• The Feed template is shown when feed=true is added to the URL. If nothing is selected the List template is shown instead.

You can also specify explicitly which product properties to make available for the product catalog. While this has no impact on performance – a property is only “paid for” when it is used, not when it is included – it makes it possible to write dynamic templates which are rendered differently depending on the information available.

To specify explicitly which properties to include move a property from excluded properties to included properties (Figure 6.1).

Figure 6.1 Product properties

Please note, that if you don’t select anything specifically all properties are included. As mentioned in the introduction, this has no impact on performance; only used properties are “paid for”, not included properties.