Avart | Media Grid

Add a section

Choose Media Grid

Here you can choose the proportion of the images in percentage. By default, the size is set to 100, which means 100% of the width of the block, resulting in a square shape.

With these three settings, you can choose how many blocks to display per row for mobile, tablet, and desktop views.

Let's insert the first image.

Here you can change the color scheme of the block to match the text and overlay color that best complements the background image.

Select the image.

Insert the inner text

And choose an optional link

By selecting "cover" in this setting, the image will always be displayed to fill the entire block, potentially cutting off some edges if necessary. With "contain," the image will always be fully displayed, but there may be some empty space on the sides to compensate.

Select "eager" in this setting only if the image is among the first elements of the page to be displayed. This way, the image will be loaded immediately when the page loads. With "lazy," the image will be loaded only when the user reaches the section by scrolling through the page.

Now let's use the second block to insert a video. Feel free to delete this block if you don't need it or add more blocks.

Select a video; it will be shown in autoplay and loop.

Click "Save"