Benefits

Trust-building grid of key selling points: shipping, returns, guarantees, and quality.

📁 sections/benefits.liquid

Quick Setup

  1. Add section → Benefits
  2. Customize each benefit block (title, description, icon)
  3. Adjust columns and colors

Section Settings

Background

SettingTypeDefaultDescription
Desktop imageimage-Optional background image for desktop. Creates a lifestyle backdrop behind the benefits.
Mobile imageimage-Optional portrait background image for mobile.

Colors

SettingTypeDefaultDescription
Color schemecolor_schemeBackground 1Use a predefined color scheme from your theme settings.
Section backgroundcolor_background-Custom background color or gradient for the section.
Card backgroundcolor_background-Background color for individual benefit cards.
Headingcolor-Color for benefit titles.
Textcolor-Color for benefit descriptions.
Linkcolor-Color for optional links.
Link (hover)color-Link color on hover.

Layout

SettingTypeDefaultDescription
WidthselectPage widthSection width. Options: Page width, Narrow, Wide.

Spacing

SettingTypeDefaultDescription
Include top paddingcheckboxfalseAdd padding at the top of the section.
Desktop toprange0pxTop margin on desktop.
Desktop bottomrange0pxBottom margin on desktop.
Mobile toprange0pxTop margin on mobile.
Mobile bottomrange0pxBottom margin on mobile.

Advanced

SettingTypeDefaultDescription
Mark as rail endcheckboxfalseRelease the sticky product rail at this section. Used on product pages to control where the sticky info panel stops.
Release atselectTop edgeWhere to release the rail: at the top or bottom edge of this section.

Block Types

Benefit Block

Each benefit block represents one selling point. You can add up to 6 benefit blocks.

SettingTypeDefaultDescription
Iconimage-Custom icon image. Recommended size: 64×64px. If not set, a default icon is displayed.
Titletext-The headline for this benefit (e.g., 'Free Shipping').
Descriptionrichtext-Supporting text explaining the benefit.
Link texttext-Optional link label.
Link URLurl-Optional link destination.

Benefit Ideas

Here are common benefits that convert well:

đŸ“Ļ

Shipping

Free shipping, Fast delivery, Same-day dispatch

↩ī¸

Returns

Free returns, 30-day guarantee, Easy exchanges

🔒

Security

Secure checkout, Encrypted payments, Trusted partners

⭐

Quality

Handcrafted, Premium materials, Made to last

đŸ’Ŧ

Support

24/7 customer service, Live chat, Expert advice

🌱

Sustainability

Eco-friendly, Carbon neutral, Recyclable packaging

Best Practices

Content Tips

  1. Keep titles short — 2–3 words work best ("Free Returns", "Fast Shipping")
  2. Use action words — "Get", "Enjoy", "Experience" are more engaging
  3. Be specific — "2-day delivery" beats "Fast shipping"
  4. Match your audience — Premium brands emphasize quality; value brands emphasize savings

Design Tips

  1. 3–4 benefits is ideal — Too many dilutes the impact
  2. Use consistent icons — Same style/size for a polished look
  3. Match your brand colors — Don't use garish colors that clash
  4. Consider placement — Below fold on home, near CTA on product pages

Icon Recommendations

  • Upload custom icons for best results (64×64px PNG with transparency)
  • Keep icon style consistent (all line icons or all filled icons)
  • Default icons are provided if you don't upload custom ones

Troubleshooting

Benefits not showing

  • Ensure you've added at least one Benefit block
  • Check if the section is hidden on certain pages via visibility settings

Icons look different sizes

  • Use icons with identical dimensions (64×64px recommended)
  • Ensure your icons have consistent padding/margins

Background image not visible

  • Check if section background color is solid (needs to be transparent or semi-transparent)
  • Verify the image file is uploaded correctly
  • Test with a different image to rule out file issues

Text hard to read over background image

  • Use the Section background color with transparency to add an overlay
  • Adjust Text and Heading colors for better contrast