The Store feature enables customization and extending the collections and products display.


Collections

Layout

  • 1 Column
  • 2 Columns
  • 3 Columns
  • 4 Columns
  • Custom

Alignment

Affects alignment of headings and purchase forms on collections. Options include: left, center, right.

Pagination Total

Show or hide the pagination total on collections.


Products

Layout

  • 1 Column
  • 2 Symmetrical
  • 2 Asymmetrical
  • 3 Columns
  • Custom

Example Product template for 1 Column, 2 Symmetrical, and 2 Asymmetrical layouts. View source in browser to see the template code.

The 3 Column product layout requires an extra sidebar element added to the Product template. The following example shows the sidebar with product specs, allocations, and purchase form.

<div class="c7-product__sidebar">
  <div class="c7-product__specs"><c7-product-wine></div>
  <c7-product-allocation />
  <c7-product-add-to-cart>
</div>

Example Product template for 3 Columns layout. View source in browser to see the template code.

Alignment

Affects alignment of headings and purchase forms on products. Options include: left, center, right.

Image Position

Options include: static and sticky.

Static will scroll the image with the page as usual.

Sticky will fix the image to the window top temporarily, until the rest of the product content has been scrolled past.