Create multi-column, full-width and mosaic-like grid on your homepage - using only one section

- Option for adding title, description and a button over images

- 9 text placement areas on single image and 6 text placement areas on each image when multiple images are used

- Overlay opacity, Image Height Adjustment and various settings included

- Plug and Play

Single Image

With 9 Text Positions

Mosaic - 3 Images

New Arrivals

Shop Now

Best Sellers

Grab them before

they are gone

Shop Now

The Kimono Collection

Shop Now

Mosaic - 5 Images

Headphones

Shop Now

Smartphones

Shop Now

Monitors for Mac

Shop Now

Professional Microphones

Limited Stock

Shop Now

Gaming

Shop Now

Getting Started

To add this section to your theme, follow the steps below:

1.) Copy the code provided to you when you download the section.

2.) Add a New Section by going to your Themes > Actions > Edit Code > Add a new section.

image

3.) Paste the code entirely and SAVE.

4.) Open Theme Editor by clicking on "Customize" button, add section and setup it up on your homepage.

* If you are not comfortable adding the code or don't want to modify the theme yourself, we can help you implement this section on your Shopify store for just 1 tweak.

Settings

Main Section Settings

Section Title

Add title to the section (optional)

Block Height

Specify height of the blocks. Mosaic blocks are adjusted to twice the height automatically.

Lazyload Images

If your theme already uses lazyload functionality, keep this "disabled". If the images appear blurred, set this option to "Active". 

Border Radius (Images & Buttons)

Display curved edges of block images & link buttons

Header Font Size

Specify header font size displayed over images for both desktop and mobile

Text Font Size

Specify text font size displayed over images for both desktop and mobile

Specific block settings

Image

Add image to the block

Image Position

Specify which area of the image you would like to display in the blocks.

Heading

Add heading to the block (optional)

Text

Add title to the block (optional)

Text Color

Assign color of the text (Heading & Text above)

Button Text/Link

Add button text and link to the block (optional)

Button Color/Button Text Color

Assign color of the button and text (optional)

Make Image Clickable

If you are want to make the whole image clickable and not just button, select this option. Also, add button link which will be used as a link for the image

Image Overlay Opacity/Overlay Color

Assign overlay opacity if you want text to be more readable. You can choose the color for the overlay

Text Align

Align text (heading + text + button) to the left, center and right

Vertical Text Align

Align text (heading + text + button) top, middle or bottom

Horizontal Text Align + Content Width

This setting only applies for single full width image providing you the ability to position text to up to 9 position on the image.

Image Blocks

Add up to 5 blocks of images with different displays styles (Full Width, Multi Column Images, Collage/Mosiac Styles with 3 or 5 images)

Just Plug and Play

Enter your details below to get access to the code for Image Collage/Mosaic Section