FOURCORE.DOCS
Esses docs menu

Collection panels#

Present collections as large visual panels, a grid, or a live feed.

Add this section#

Select Add section > Collection panels on the template you want to edit.

Settings#

The settings below follow the same order as the theme editor.

General settings#

  • Subheading: Enter the text to show.
  • Heading: Enter the text to show.

Layout#

  • Layout: Choose Expanding panels, Grid, Starting grid, or Live feed. Expanding panels open as shoppers point at them. Starting grid shows every collection with its words in view. Live feed shows one collection large beside the others.
  • Height: Choose Medium, Large, or Full screen.
  • Expand the first panel: Turn this on or off.
  • Show product count: Turn this on or off.
  • Show numbers: Turn this on or off.
  • Overlay opacity: Use the slider from 0 to 90 %.
  • Color scheme: Choose a color scheme from Theme settings > Colors.

Section padding#

  • Top padding: Use the slider from 0 to 160 px.
  • Bottom padding: Use the slider from 0 to 160 px.

Mobile layout#

  • Layout: Choose Stacked or Carousel.
  • Height: Choose Small or Medium.
  • Top padding: Use the slider from 0 to 120 px.
  • Bottom padding: Use the slider from 0 to 120 px.

Blocks#

Panel#

General settings#

  • Collection: Choose a collection.
  • Image: Choose an image from your library. Leave empty to use the collection's image. 1200 x 1600px recommended.
  • Heading: Enter the text to show. Leave empty to use the collection's title.
  • Text: Enter the text to show.
  • Links: Choose a navigation menu. Up to four links from this menu.
  • Button label: Enter the text to show.
  • Link: Choose the page or address to open. Used when no collection is chosen.

Tips#

  • Add your real content before fine-tuning spacing and colors.
  • Check the section at both computer and phone widths. Use Mobile layout for the phone-specific choices.
  • The Esses home page starts with Starting grid. Its collection slots are numbered 01, 02, 03, and so on.
  • Show numbers is on by default for Starting grid. The outlined numbers use the color scheme accent, and the slots move into place in grid order when the section enters the screen.