For dev - Display Type Component (App Lib V2)
This instruction is appropriate for App Lib V2 only. The app lib V3 associated documents will be available soon. Please contact us for further assistance.
In this article
1. Overview
1.1. Structure
The display type determines whether to view a product list in list
grid
or collage
type.
2. DOM element
Pagination Component renders the pagination on .boost-pfs-filter-top-display-type
on collection/search page
For example: You will find a div
like this in sections/collection-template-boost-pfs-filter.liquid
<div class="boost-pfs-filter-top-display-type"></div>
3. Settings in javascript
Product List Settings
Name | Type | Values | Default | Description |
---|---|---|---|---|
defaultDisplay | string | 'list' 'collage' 'grid' | 'grid' | Default display type of product list |
collageNmmber | number | 3 | If defaultDisplay = collage, set number of product items that is contained in one collage |