Skip to content
RockStarUI Docs

Testimonials

What this section does

Section titled “What this section does”

The Testimonials section highlights customer quotes in a horizontal card slider. It combines section intro copy with testimonial blocks containing rating, quote, author details, and optional avatar.

Shopify Theme Editor with the Testimonials section selected on the Home page template, showing testimonial cards in the preview and settings for eyebrow, heading, subheading, and background in the right panel.

How to set it up

Section titled “How to set it up”
  1. Go to Online Store -> Themes.
  2. Click Customize.
  3. Open the Home page template.
  4. In the left sidebar, select Testimonials.
  5. Add or edit Testimonial blocks, then save.

Editor areas overview

Section titled “Editor areas overview”
  1. Left sidebar:
    • Shows the section and all Testimonial blocks.
    • Add Testimonial creates a new card.
    • Drag blocks to reorder cards.
  2. Center preview:
    • Shows intro content on the left and testimonial cards on the right.
    • Includes previous/next controls for card navigation.
  3. Right settings panel:
    • Section settings: Eyebrow, Heading, Subheading, Background.
    • Block settings appear when a testimonial block is selected.

Key section settings explained

Section titled “Key section settings explained”
  1. Eyebrow: small label above heading.
  2. Heading: main testimonial section title.
  3. Subheading: supporting sentence below heading.
  4. Background: background color for the full section.

Testimonial block settings

Section titled “Testimonial block settings”

Each Testimonial block includes:

  1. Rating: star score from 1 to 5.
  2. Quote: rich text testimonial content.
  3. Author: customer name.
  4. Meta: secondary author info (for example city/location).
  5. Avatar: optional customer image.

Important behavior

Section titled “Important behavior”
  1. The section renders only when at least one testimonial block exists.
  2. On desktop, the slider advances by two cards per step.
  3. On small screens, it switches to one card per step.
  4. If no avatar is set, the card shows an initial-based fallback badge.

Common tasks

Section titled “Common tasks”

Add a new testimonial

Section titled “Add a new testimonial”
  1. Select Testimonials.
  2. Click Add Testimonial.
  3. Set rating, quote, author, and meta.
  4. Optionally add avatar.
  5. Save.

Reorder testimonials

Section titled “Reorder testimonials”
  1. Drag testimonial blocks in the left sidebar.
  2. Confirm card order in preview.
  3. Save.

Replace avatars with initials

Section titled “Replace avatars with initials”
  1. Open a testimonial block.
  2. Remove Avatar image.
  3. Save.

Tips

Section titled “Tips”
  1. Keep quote lengths similar for cleaner card rhythm.
  2. Use consistent location format in Meta (for example City, ST).
  3. Keep ratings credible and varied when needed.
  4. Check readability of quote text against chosen background color.

FAQs

Section titled “FAQs”

Why is the section not showing on the storefront?

Section titled “Why is the section not showing on the storefront?”

The section requires at least one testimonial block to render.

Why does one card show a letter instead of a photo?

Section titled “Why does one card show a letter instead of a photo?”

That block has no avatar image, so the theme shows an initial fallback.

Why does the slider show fewer cards on mobile?

Section titled “Why does the slider show fewer cards on mobile?”

The section is responsive and switches to one card per view on smaller screens.

Section titled “Related guides”

Publish checklist

Section titled “Publish checklist”
  1. Confirm section copy (eyebrow, heading, subheading).
  2. Confirm each testimonial block rating and quote.
  3. Verify author/meta consistency.
  4. Validate mobile card behavior.
  5. Save and publish.

Need help?

Section titled “Need help?”

If you still need help, contact support via the Contact page.