✨Media grid

This section is to multiple images with text.

Configure media grid

Select the customize theme option. Click on the dropdown menu at the top to select the Home page template.

From the left side menu, select Media grid.

Customize the media grid section by utilizing the settings on the right side of the theme editor, as described below:

General	Section visibility Select from the options to select the visibility of this section: -Always -Small devices only(On selecting this, the section will be visible on mobile devices only.) -Large devices only Make section full width Check this checkbox to make the section into full-width. Container width Choose the container width from the following options: - Global settings (This can be changed in the theme settings>layout>Container width.) - Small Desktop row height Adjust the range bar to determine the grid's row height on the desktop view. Mobile row height Adjust the range bar to determine the grid's row height on the mobile view. Desktop grid gap Adjust the range bar to determine the gap between columns on the desktop view. Mobile grid gap Adjust the range bar to determine the gap between columns on the mobile view. Enable shadow on card Tick this checkbox to show the shadow behind the cards of the grid.
Content	Show image content on hover only Tick this checkbox to show text content on the hover only and not to show it permanently. The content background overlay opacity can be changed from it's block settings. Heading Add heading text. (Note: Wrap your text between [] to add the markers. For example, This [marker] will underline marker text.) Marker text highlight style Select from Underline or Background to determine the highlight style. Highlight background Select from Gradient or Solid to determine the highlight background. Enable heading gradient animation Select this checkbox to show the heading animation in gradient color. (Note: Use gradient color from Theme settings>Color scheme>Highlight background gradient for this.) Heading size Select the heading size from the H1-H6 options. Heading tag Specify heading code types for SEO and search engines for crawling purposes. Heading alignment Select the text alignment from the given options: -Left -Right -Center
Colors	Color scheme Select the color scheme. These can be managed from Theme settings> Color >Schemes. Enable gradient Select this check box to enable the gradient color specified in the color scheme assigned above.
Section padding	Top spacing (desktop) Adjust the range bar to add spacing at the top of the section for desktop view. Bottom spacing (desktop) Adjust the range bar to add spacing at the bottom of the section for desktop view. Top spacing (mobile) Adjust the range bar to add spacing at the top of the section for mobile view. Bottom spacing (mobile) Adjust the range bar to add spacing at the bottom of the section for mobile view.

Block settings

Image	Select image from your library.
Video autoplay	Select video from your library.
Layout	Column Adjust the range bar to determine the column width. Row Adjust the range bar to determine the row height.
Content	Heading Add heading text. Heading size Select the heading size from the H1-H6 options. Heading tag Specify heading code types for SEO and search engines for crawling purposes. Description Add description text. Content position Select the content position from the following options: -Top left -Top center -Top right -Centre-left -Center -Center right -Bottom left -Bottom center -Bottom right Content alignment Select the content alignment from the following options: -Left -Center -Right Content width Select the width from the following options: -Small -Medium -Large
Button	Text Add text to the highlight button. Link Add a link to your button. Note: If the button text is blank, then the link will be applied to the whole image. Show button as link Tick this checkbox to make the button a link.
Colors	Heading Select any color for the heading. Description Select any color for the heading. Button background Select any color for the button background. Button text Select any color for the button text. Button border Select any color for the button border. Button background hover Select any color for the button background on hover. Button text hover Select any color for the button text on hover. Button border hover Select any color for the button border on hover. Overlay color Select any color for the overlay. Overlay opacity Adjust the range bar to determine the overlay opacity.