Media Gallery

by Admin on Oct 01, 2025

1. What is Media Gallery?

The Media Gallery section is a flexible area to display various types of visual content, like product images, promotional videos, buyer reviews, and social media content. It’s a great way to provide customers with an engaging, detailed look at your products or promotions.

2. Section Components

Section		A section to showcase images and videos in a visually appealing layout.
Available block		Each block can contain an image or a video with optional content overlay.

3. Location & Setup

Go to "Online Store" > "Themes" > "Customize"
Select where you want to place it
Click "Add Section"
Search for Media Gallery.
Click on it to add.

4. Core Features

Images & Videos: Display high-quality images or embed videos from YouTube/Vimeo.
Custom Layouts: Adjust column and row settings for desktop and mobile views.
Content Overlay: Add text or buttons directly on images or keep it outside the media.
Swipeable Mobile Gallery: Create a swipeable carousel for mobile users.

5. Common Use Cases

🤔 How to add and style media blocks?

Want to control the size of each media block? Here’s how:

STEP 1: Add the section & blocks.

Add a Media Gallery section.
Click "Add block" for new Media blocks.

STEP 2: Configure Block settings

Choose to add an Image or a Video.
Enter your media’s content in Title, Subtitle,Text, and Button label (if you need a button)
Select an Icon (choose, custom, or SVG)
Adjust the Content alignment.

STEP 3: Optimize Layout

Click on the Media Gallery section, and adjust the look as you want in Desktop layout, Mobile layout, and Section layout. If you need more detailed guidance, continue reading 🤔 What customization options can you give your Media Gallery?

💡 Pro tip: Enable the swipeable carousel for mobile to provide an intuitive browsing experience with multiple media items.

STEP 4: Click “Save” when done.

🤔 How to show content Inside or Outside of media?

Need to overlay content on your images or keep it outside? Follow this:

STEP 1:

Click on a Media block to access its settings.

STEP 2:

Enable or disable the "Content Overlay" option. Adjust the overlay opacity if enabled.

STEP 3:

If you ENABLE content overlay, then you can do these under the Overlay content setting group:

Change the Overlay content position.
Adjust the Overlay opacity from 0-100%.

If you DISABLE content overlay, then you can do these under the Layout setting group:

Change the Media position to make the content above or below the media.

STEP 4:

Click “Save” when done.

🤔 How to modify the Height and Width of each Media block?

Want to control the size of each media block? Here’s how:

STEP 1:

In the Media Gallery section settings, adjust the Number of columns and Row height for desktop and mobile.

STEP 2:

Customize each block’s width and height:

Click on a Media block.
Scroll down to the Layout setting group.
Adjust the Number of columns wide and Number of rows tall options.

STEP 3:

Click “Save” when done.

🤔 What customization options can you give your Media Gallery?

For the whole Media Gallery section:
✨ Change the heading size:	Click on the Media Gallery section, and choose the Heading size to be Small, Medium, or Large.
✨ Change the Heading tag (for SEO purposes)	Click on the Media Gallery section, and choose the Heading tag from the list.
✨ Change the heading alignment	Click on the Media Gallery section, and choose the Heading alignment to be Left, Right, or Center.
✨ Make the media swipeable on mobile	Click on the Media Gallery section, scroll down to Mobile layout, and turn on the Enable swipe on mobile toggle.
✨Change the section width	Click on the Media Gallery section, find the Section layout group, and choose the Section width to be Page width, Full width,Full width padded.
✨ Change the section width, add padding, or add a divider	Click on the Media Gallery section, and scroll down to the Section layout group, and you will be able to change those settings.
For a single *Media* block:
✨ Show sound control button for video:	If you use video for your media block and make it autoplay, add a sound control button for users to turn on or off the audio: Click on the *Media* block, and enable the Show sound control toggle.
✨ Add highlight effect to the title:	When entering the Title for the Media Gallery section, wrap the text you want to highlight between [] brackets. Choose the Marker style to be Underline or Font highlight.

Need help? Contact our support team at Omni Themes Support.