Featured collection grid

Section Overview

The Featured collection grid section displays a customizable grid of products from a selected collection, with options for adding content blocks. It offers flexible layout controls, color schemes, and responsive design settings.

Common Use Cases

• Featured product collections on homepage

• Category pages showcasing specific product types

• Promotional sections highlighting seasonal or sale items

• Cross-selling related products on content pages

Usage Tips

• Use a reasonable product count (5-12) to balance visual appeal with performance

• For mobile, stick with 1-2 products per row to maintain readability

• Consider enabling the split layout option for larger collections to provide better context

• Adjust spacing settings based on surrounding content to maintain visual hierarchy

• Use complementary color schemes that align with your brand identity

Section Settings

Setting	Description
Collection	Select which product collection to display
Products count	Set the maximum number of products to show
Heading	Add a title for the section
Content	Add descriptive text to provide context
Button label	Text to display on the optional button
Button URL	Link destination for the button
Top spacing	Control the padding above the section (in pixels)
Bottom spacing	Control the padding below the section (in pixels)
Color scheme	Select from predefined color themes or use custom colors
Custom color	Set a custom background color (when custom scheme selected)
Text color	Force light/dark text or use theme defaults
Border color	Choose between subtle or strong border colors
Button color	Select from various button style options
Enable color fade	Transition background/text color when scrolling
Border position	Control where borders appear (top, bottom, both, or none)
Row desktop	Number of products per row on desktop (1-8)
Row mobile	Number of products per row on mobile (1-3)
X alignment	Horizontal alignment of section content
Enable margin	Add horizontal margin to match theme settings
Enable split	Display header and content in a side-by-side layout
Enable split heading	Split the heading into separate components
Visibility	Control section visibility on different devices

Block Settings

Content Block

This block allows you to add a custom content area within the product grid for promotional messages or additional information. Limited to 1 block per section.

Setting	Description
Heading	Title for the content block
Content	Rich text area for descriptive content
Button label	Text to display on the optional button
URL	Link destination for the button
Image	Upload an image to display
Show image as background	Use the image as a background instead of inline
Video	Upload or link a video file
Enable autoplay	Automatically play video when in view
Enable mute toggle	Show mute/unmute button for videos
Enable loop	Continuously loop video playback
Minimum height	Set the minimum height of the block (in pixels)
Enable padding	Add internal padding to the block
Color scheme	Select from predefined color themes
Border color	Choose border style and color
Text color	Force light/dark text or use theme defaults
Button color	Select from various button style options
Enable gradient	Add a gradient overlay effect
Text position	Place text above or below content
Y alignment	Vertical alignment of content within block
X alignment	Horizontal alignment of content within block