Skip to main content

Main collection

sections/main-collection.liquid

Settings​

SettingIDTypeDefaultNotes
Blocks marked (above) render above the product grid. Every other block renders below it, whatever order they appear in here.
Layout
Show breadcrumbsshow_breadcrumbsOn/offOn
Filter sidebar widthsidebar_widthSlider290Range: 240–320 step 10.
Products per pageproducts_per_pageSlider24Range: 8–48 step 4.
Columns on desktopcolumns_desktopSlider4Range: 2–5 step 1.
Columns on tabletcolumns_tabletSlider3Range: 2–4 step 1.
Columns on mobilecolumns_mobileDropdown2Options: 1 column, 2 columns.
Filters
Keep filters visible while scrollingsticky_sidebarOn/offOn
Filter groups open by defaultfilter_groups_openSlider5Groups beyond this start collapsed. Opening every group makes a long filter list hard to scan. Range: 0–10 step 1.
Price filterfilter_price_styleDropdownsliderSlideshow only hides the number fields visually. They remain available to screen readers, since typing an exact price is easier than dragging to it. Options: Slideshow only, Slideshow and number fields.
Toolbar
Show grid / list toggleshow_grid_toggleOn/offOn
Below the grid
To hide a section on one collection only, add a collection metafield called custom.hide_sections (List of single line text) and enter any of: categories, benefits, seo, faq, related.
Two sources. The blocks you add below show on every collection. A collection that has its own metafield entries shows those instead, and ignores the blocks. Fill in metafields only for the collections that need different content — the rest fall back to the blocks.
Headings below accept [collection], replaced with the collection's name. So "About [collection]" reads "About Massage Oils" on that page. [Collection] and [COLLECTION] work too.
Benefit cards headingbenefits_headingTextWhy shop [collection]Add one Benefit card block per card. Keep them next to each other so they form a single row.
Per-collection benefits metafieldbenefits_metafieldTextcustom.benefitsLeave as is unless you renamed the metafield. Collections with entries here override the Benefit card blocks. Set up per-collection cards.
Benefit card icon positionbenefits_icon_positionDropdownaboveOptions: Above text, Beside text.
Benefit card icon sizebenefits_icon_sizeSlider24Range: 16–48 step 4.
Dividing lines between benefit cardsbenefits_dividerDropdownlineDesktop only. Two columns on mobile are too narrow for vertical rules. Options: None, Vertical lines.
FAQ headingfaq_headingTextFrequently asked questionsAdd one FAQ item block per question. Keep them next to each other in the block list — a different block between them starts a second FAQ group with its own heading.
Per-collection FAQ metafieldfaq_metafieldTextcustom.faqsCollection metafield holding a list of FAQ metaobjects with question and answer fields. When a collection has entries, they replace the FAQ blocks below. Leave the metafield unset on a collection to use the blocks.
Open one FAQ answer at a timefaq_single_openOn/offOff
Include FAQ structured dataenable_faq_schemaOn/offOnPublishes the FAQ blocks above as structured data. Switch off if you also add a separate FAQ section to this page. Two sets on one URL disqualifies both.
Include collection structured dataenable_collection_schemaOn/offOnOutputs CollectionPage and a list of the products on this page. Turn off if an SEO app already adds it, so the page does not emit it twice.
Product cards
Image ratioimage_ratioDropdown1 / 1Options: Square (1:1), Portrait (4:5), Tall (3:4).
Show Quick Addshow_quick_addOn/offOn
Show vendorshow_vendorOn/offOn
Show ratingshow_ratingOn/offOn
Show color swatchesshow_swatchesOn/offOn
Show second image on hovershow_second_imageOn/offOn
Show wishlist buttonshow_wishlistOn/offOffDisplays the button and fires a neroli:wishlist:toggle event. Requires a wishlist app to store the list.

Blocks​

Collection hero (above) (hero)​

SettingIDTypeDefaultNotes
Show collection descriptionshow_descriptionOn/offOn
Shorten description with Read moreclamp_descriptionOn/offOnKeeps long descriptions from pushing products below the fold. Full text stays on the page for search engines.
Lines before Read moredescription_linesSlider2Range: 2–6 step 1.
Show product countshow_countOn/offOffThe toolbar above the grid already shows a count, and that one updates as filters are applied.
Show collection imageshow_imageOn/offOn
Show image on mobileshow_image_mobileOn/offOn
Fallback imageimageImageUsed only for collections that have no image of their own. Set each collection's image in Products → Collections.
Image styleimage_styleDropdownbleedFull bleed takes its height from the hero and ignores the image ratio below. Options: Full bleed to page edge, Contained with rounded corners.
Image heightmin_heightSlider220Height of the bleed image on desktop. The hero grows taller if the text needs more room. Range: 160–400 step 20.
Image ratioimage_ratioDropdown3 / 2Options: 16:7, 16:9, 3:2, Square.
Text column widthtext_widthSlider60Range: 50–70 step 5.

Shop by category (above) (subcategories)​

SettingIDTypeDefaultNotes
HeadingheadingTextShop by category
MenumenuMenu pickerLinks to collections show an image and product count. Other link types render as text.
Show product countshow_countOn/offOn
Card width on desktopcard_widthSlider190Range: 160–240 step 10.

Benefit card (benefit_card)​

SettingIDTypeDefaultNotes
Fallback card. Shows on every collection that has no benefits metafield entries of its own. Add one block per card.
IconiconDropdownleafOptions: None, Leaf, Flower, Droplet, Heart, Shield, Award, Star, Gift, Delivery, Returns, Support, Question, Smile, Energy, Wellness, Clock.
HeadingheadingTextAbout this range
TexttextRich text<p>A short sentence describing this part of the collection.</p>
Link labellink_labelTextView guideDescribe the destination. Four cards all saying “Learn more” tell a screen-reader user nothing.
Linklink_urlLink

SEO content (seo_content)​

SettingIDTypeDefaultNotes
The content below shows on every collection. A collection with a value in the metafield named further down shows that instead.
HeadingheadingTextAbout [collection]
ContentcontentRich text
Per-collection metafieldmetafield_keyTextcustom.aboutNamespace and key of a collection metafield, e.g. custom.about. When the collection has a value it replaces the content above. Clear this field to always use the content above.
Shorten with Read morecollapsibleOn/offOnCaps the height and adds a Read more control. The full text stays on the page for search engines.
Height before Read morecollapsed_heightSlider260Range: 160–600 step 20.
ImageimageImage
LayoutlayoutDropdowntextOptions: Text only, Image left, Image right.

FAQ item (faq)​

SettingIDTypeDefaultNotes
Fallback question. Shows on every collection that has no FAQ metafield entries of its own. Add one block per question.
QuestionquestionTextAsk a common question here
AnsweranswerRich text<p>Answer it plainly. Useful answers help shoppers and help this page rank.</p>
Open by defaultopen_by_defaultOn/offOff
SettingIDTypeDefaultNotes
HeadingheadingTextYou might also like
SourcesourceDropdownautomaticAutomatic uses the other collections this collection's products belong to, so it differs on every page with no setup. It falls back to the menu below when it finds nothing. Options: Automatic, Per-collection metafield, Menu.
Fallback menumenuMenu pickerUsed by the Menu source, and whenever Automatic or the metafield finds nothing. The same links show on every collection page.
For the metafield source, add a collection metafield with namespace and key custom.related_collections, type List of collections, then set it per collection.
Card stylecard_styleDropdownbelowKeep this different from Shop by category so the two sections do not look alike. Options: Image with title below, Title over image, Compact row.
Maximum collectionslimitSlider4Range: 2–8 step 1.
Show product countshow_countOn/offOn

Maximum blocks: 30