Images alone may not provide enough detail for users to confidently select a variant. Without additional context, they might struggle to understand differences between options, leading to hesitation or incorrect choices.
Combine images with short descriptions (e.g., "Matte Black – Sleek, fingerprint-resistant finish" or "Soft Cotton – Lightweight and breathable"). This ensures users have both visual and textual clarity, making selection easier and boosting confidence in their purchase.
- Your product variants have subtle differences that aren't obvious from images alone (materials, textures, finishes)
- Analytics show high bounce rates on product pages (above 70%) or low add-to-cart rates (below 3%)
- You're receiving customer service inquiries asking about variant differences or wrong item returns
- Your store has 5+ SKUs with multiple variants per product and generates 1,000+ monthly product page views
- You're using Shopify, WooCommerce, or similar platforms that support custom variant displays
For Shopify stores, this requires theme customization in your product template:
- Navigate to
Online Store > Themes > Actions > Edit Codeand locate your product template file - Add custom metafields for variant descriptions in
Settings > Metafieldswith namespacevariants.description - Insert this code snippet in your variant selector section:
<div class="variant-details">
<img src="{{ variant.image | img_url: '300x300' }}" alt="{{ variant.title }}">
<p class="variant-description">{{ variant.metafields.variants.description }}</p>
</div>
- Style descriptions with 14-16px font size, 1.4 line height, and ensure they display directly below variant images
- For mobile, stack descriptions vertically with 12px spacing between image and text
- Keep descriptions to 3-8 words maximum for optimal readability
- Implementation typically takes 2-4 hours including testing across devices
- Add-to-cart rate: Expect 15-25% improvement within 2-3 weeks of implementation
- Product page bounce rate: Target 10-15% reduction as users spend more time understanding options
- Return rate for wrong variants: Monitor 20-30% decrease in variant-related returns over 4-6 weeks
- Time on product page: Track using Google Analytics enhanced ecommerce or Hotjar heatmaps
- AVOID: Writing lengthy descriptions that compete with your main product copy or exceed 10 words
- BEST PRACTICE: Use concise, benefit-focused phrases like "Soft Cotton - Breathable" or "Steel Gray - Scratch-resistant"
- AVOID: Only adding descriptions to some variants while leaving others blank, creating inconsistent experiences
- BEST PRACTICE: Ensure every variant has a description, even if it's just the color name with one key attribute
- AVOID: Placing descriptions too far from variant images or using font sizes below 12px on mobile
Get A Free Website Audit.
We’ll identify what’s leaking revenue on your site and show you how to fix it. The free audit includes: