Testimonial Masonry is a Shopify theme section in the Section Star library. Feature a grid of testimonials complete with images or videos and a star rating in a brick layout.
About the Testimonial Masonry section
The Review Masonry section is a customizable Shopify section built using the Section Star app. This section allows you to display customer reviews in a visually appealing masonry grid layout. It supports both image and video reviews, making it a versatile tool for showcasing customer feedback on your e-commerce store.
Live demo
Use cases
- Product Page Reviews: Enhance your product pages by displaying customer reviews directly under the product images to build trust and credibility.
- Homepage Testimonials: Feature customer testimonials on your homepage to highlight positive experiences and encourage new visitors to make a purchase.
- Video Review Gallery: Create a dedicated page for video reviews where customers can watch and read about real user experiences with your products.
- Seasonal or Promotional Campaigns: Utilize the section during special sales or promotional periods to showcase time-sensitive reviews and create urgency.
Settings
Every setting below appears in the Shopify theme customizer once the section is published.
Font
Set the fonts for your section
| Setting | Type | Default |
|---|---|---|
| Override theme fonts | Checkbox | Off |
| Text Font | Font | sans-serif |
| Headline Font | Font | sans-serif |
Text
Set the text for your section
| Setting | Type | Default |
|---|---|---|
| Text Size | Range | 15 |
| Mobile Text Size | Range | 15 |
| Text Line Height | Select (0.75, 1.0, 1.1, 1.2, 1.3, 1.4…) | inherit |
| Headline Size | Range | 40 |
| Mobile Headline Size | Range | 40 |
| Headline Line Height | Select (0.75, 1.0, 1.1, 1.2, 1.3, 1.4…) | inherit |
Colors
Set the colors for the section
| Setting | Type | Default |
|---|---|---|
| Text Color | Color | #111 |
| Headline Color | Color | #111 |
| Highlight Color | Color | #111 |
Section Design
Set the design for the section
| Setting | Type | Default |
|---|---|---|
| Background Color | Color or gradient | linear-gradient(164deg, #FFF 0%, #FFF… |
| Padding Top/Bottom | Number | 25 |
| Mobile Padding Top/Bottom | Number | 25 |
| Padding Left/Right | Number | 25 |
| Mobile Padding Left/Right | Number | 25 |
| Spacing between Elements | Number | 15 |
Container Design
Set the design for your inner container
| Setting | Type | Default |
|---|---|---|
| Background Color | Color or gradient | linear-gradient(164deg, #FFF 0%, #FFF… |
| Max Width | Number | 1000 |
| Padding Top/Bottom | Number | 10 |
| Mobile Padding Top/Bottom | Number | 10 |
| Padding Left/Right | Number | 10 |
| Mobile Padding Left/Right | Number | 10 |
| Round Borders on Container | Range | 0 |
| Subtle Shadow on Container | Checkbox | Off |
| Border Size on Container | Range | 0 |
| Border Color on Container | Color | #888 |
Grid Design
Set the design for your masonry grid
| Setting | Type | Default |
|---|---|---|
| Columns | Select (1, 2, 3) | 2 |
| Mobile Columns | Select (1, Match Columns) | 1 |
| Gap Between Testimonials | Number | 20 |
| Background Color | Color or gradient | linear-gradient(164deg, #FFF 0%, #FFF… |
| Show Big Play Button | Checkbox | On |
| Round Borders on Media | Range | 5 |
| Subtle Shadow on Media | Checkbox | On |
Headline
Set text for the headline
| Setting | Type | Default |
|---|---|---|
| Text Alignment | Text alignment | center |
| Headline | Inline rich text | <b>Check out our Products</b> |
| Text | Inline rich text | Shop our extensive range of amazing p… |
| Spacing between Headline and Features | Number | 15 |
Image Testimonial block settings
| Setting | Type | Default |
|---|---|---|
| Image | Image | — |
| Testimonial | Inline rich text | This is a sample testimonial. |
| Attribution Image (Small Photo) | Image | — |
| Attribution 1 | Inline rich text | Sample Customer |
| Attribution 2 | Inline rich text | @sample_customer |
Video Testimonial block settings
| Setting | Type | Default |
|---|---|---|
| Hero Video | Video | — |
| Testimonial | Inline rich text | This is a sample testimonial. |
| Attribution Image (Small Photo) | Image | — |
| Attribution 1 | Inline rich text | Sample Customer |
| Attribution 2 | Inline rich text | @sample_customer |
| Play Inline | Checkbox | On |
| Autoplay | Checkbox | Off |
| Loop Video | Checkbox | Off |
| Show Video Controls | Checkbox | Off |
| Mute Video | Checkbox | Off |
How to add this section to a Shopify store
- Install Section Star from the Shopify App Store.
- Open the app and search the library for “Testimonial Masonry”.
- Click Publish, then choose a name and the theme to publish into.
- Follow the deep link into the Shopify theme customizer.
- Add the section to any page and customize it with the native theme settings.
No code is required, and the section lives in your theme as ordinary Liquid — see the full install guide.