Shine Media With Text

Theme: Shine · Section type: All-template section

A Media with text section shows a row of columns, each with an image or a video and a short text. Use it to present product benefits, ingredients, values, or a set of short videos.

Note: You can add this section to any template, except the header and footer. The section comes with 2 Image columns and 2 Video columns.

What you can do

• Add the section and your columns
• Add a video column
• Choose the layout on large screens and mobile
• Add a button below the columns
• See what customers see
• Change the column style and colors
• Fix common problems

Add the section and your columns

1. In the theme editor, open the template where you want the section.
2. In the left sidebar, click Add section > Media with text.
3. Under General, enter a Section subheading, a Section heading, and a Section description. Leave any of them empty to hide it.
4. Click an Image column block. Under Image, select an Image.
5. Under Text, enter a Heading and a Description.
6. To add a column, click Add block > Image column or Video column.
7. Click Save.

Tip: Use images with a similar subject and background. Under Media column item, choose an Image ratio so all columns line up.

Add a video column

1. Click Add block > Video column, or click an existing Video column.
2. Under Video, choose a Video source: External or Shopify-hosted.
3. For External, paste a YouTube or Vimeo link in External video. For Shopify-hosted, select a Shopify-hosted video.
4. Select a Video thumbnail. Customers see it until they play the video.
5. Under Text, enter a Heading and a Description.
6. Click Save.

Choose the layout on large screens and mobile

1. Click the Media with text section.
2. Under Large screen, choose Columns per row: 3, 4, or 5.
3. Choose a Section heading position: Top left, Top center, or Inline. With Inline, the heading sits in the first column, next to the media columns.
4. Under Mobile screen, choose a Section heading position and a List style: Grid or Carousel.
5. Click Save.

Add a button below the columns

1. Under Button, enter a Label.
2. Choose a Style and select a Link.
3. Click Save.

Note: The button appears only when the section has a subheading, heading, or description.

What customers see

• Large screens: the columns appear side by side, with the number of columns you chose per row. Extra columns move to a new row.
• Phones: with Carousel, customers swipe through the columns one at a time. With Grid, the columns stack. On wider phones and tablets, 2 columns show per row.
• Videos: a Video column shows the thumbnail with a play button. Customers click it to load and play the video in the column, with player controls.
• Hover: on large screens, the image zooms in slightly when customers point at a column.

Settings reference

General

Media column item

Large screen

Mobile screen

Button

Image column settings

Video column settings

Troubleshooting

The button doesn't appear.
The button shows only when the section has a Section subheading, Section heading, or Section description, and the button Label isn't empty.

My columns don't line up.
Images with different shapes are cropped to the Image ratio. Choose the ratio that fits most of your images, and keep the important part in the center.

My uploaded video doesn't play.
Check that Video source is set to Shopify-hosted. The column plays only the video that matches the selected source.

The card colors don't change.
Background and Content work only when Enable item background is selected.

Related articles

• Shine Video With Text
• Shine Collage: Image With Text
• Shine Collage: Media
• Shine Typography

In other themes: Blum Image With Text Columns · Electro Image With Text Columns

Updated on: 22/10/2026