CRO Manifesto
guideline #
171

Insert Branded Cards Between Product Rows

context

If users are only seeing product after product, they might miss out on important brand benefits, product USPs, or shopping perks. Relying solely on banners or footers to communicate these messages risks them going unnoticed.

Why?

Swap out a product card every few rows with a branded card highlighting key benefits like free shipping, easy returns, sustainability, or product quality. This keeps users engaged, builds trust, and ensures they absorb key selling points without disrupting the shopping flow.

Content
  • Your collection pages have low time-on-page (under 45 seconds) or users quickly scroll past key value propositions
  • Collection-to-product page conversion rates are below 15-20%, indicating users aren't finding compelling reasons to click
  • You have strong brand differentiators (free shipping, warranties, sustainability) but low brand recall or customer surveys show users miss these benefits
  • Your store gets 1,000+ monthly collection page visits and you're on Shopify Plus, Custom, or have developer access for theme modifications
  • You currently rely only on header banners or footer content to communicate value props, with no messaging integrated into your product browsing experience

This implementation requires theme customization and takes 2-3 hours for a developer to complete properly.

  1. Create branded card designs that match your product card dimensions (typically 300-400px wide). Design 3-4 variations highlighting different benefits like shipping, returns, quality guarantees, or sustainability.
  2. In Shopify, modify your collection template file (usually collection-template.liquid or collection.liquid). Insert conditional logic to replace every 6th or 8th product card with a branded card.
  3. Add this code structure within your product loop:{% assign card_position = forloop.index | modulo: 7 %}
    {% if card_position == 0 %}
    {% include 'branded-card-snippet' %}
    {% else %}
    [your existing product card code]
    {% endif %}
  4. Create the branded card snippet with the same height as product cards (usually 400-500px) and ensure mobile responsiveness with proper touch targets.
  5. Test on mobile and desktop to ensure cards don't disrupt grid layouts and maintain visual hierarchy with your product cards.
  • Collection page engagement: Look for 10-25% increase in time on page and 15-30% reduction in bounce rate within 2-3 weeks
  • Collection-to-product clickthrough rate: Expect 5-15% improvement as users become more engaged with your brand messaging
  • Brand recall and awareness: Track through post-purchase surveys or customer interviews to measure if more users remember key benefits
  • Overall collection page conversion rate: Monitor for 3-8% improvement in users who visit collections and eventually purchase within 30 days
  • AVOID: Making branded cards visually identical to product cards - users will try to click expecting a product page. BEST PRACTICE: Use distinct styling with clear messaging and different visual treatment.
  • AVOID: Inserting cards too frequently (every 2-3 products) as this disrupts shopping flow. BEST PRACTICE: Space them every 6-8 products to maintain browsing momentum.
  • AVOID: Using different heights than your product cards, which breaks grid layouts. BEST PRACTICE: Match exact dimensions and aspect ratios of your existing product cards.
  • AVOID: Cramming multiple messages into one card. BEST PRACTICE: Focus each branded card on one key benefit with clear, scannable copy and supporting visuals.
5.0 RATING • 350+ CLIENTS

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:

Live Website Walkthrough
Technical Analysis
Conversion Checklist
Key Section Redesigns
Industry & ICP Research
Implementation Plan
try us free
No items found.
5.0 RATING • 350+ CLIENTS

Work with the #1 Team That gets you predictable results.

Strategy
DESIGN
COPYWRITING
DEVELOPMENT
Free Audit & Redesign

Get a Free Audit

See the difference for yourself. We’ll identify what’s leaking revenue on your site and show you how to fix it.
Free Forever
130+ Optimizations
Section Redesigns
Get My Free Audit
CRO Strategy Call

Talk to Glued

This isn’t a sales call. It’s a hands-on teardown session where we walk through exactly what’s holding your site back and what fixing it would mean for your revenue.
No Sales Pitch
ROI Projections
Free CRO Strategy
Book a Call