Include media and messaging using the dynamic Grid section.
Section Settings
Click the Grid section to open its general settings.
Headings
Add an optional Heading and Subheading with the provided fields.
Colors
Choose an optional Section heading color, Section subheading color, and Section background color using the round swatches.
Layout
Images used in this section will be cropped to fit the blocks, but this can be disabled by checking Maintain aspect ratio.
Compress blocks
Conserve space in mobile views by using the Compress blocks option. This will minimize the blocks, allowing customers to expand the information by clicking the block.
Customize Blocks
Click one of the preloaded Grid blocks to customize its content.
Image
For each block, assign the desired Image by clicking Select image.
Preheading
Add a Preheading using the provided field, then adjust the Preheading color with the circular swatch.
Heading
Add a Heading using the provided field, then adjust the Heading color with the circular swatch.
Text
Add Text using the provided field, then adjust the Text color with the circular swatch.
Connect link
Add a URL to the Link field, then customize the Button text for the button's label.
Block colors
Configure the block’s Text color using the rounded-rectangle swatch, then choose a Button style from the dropdown.
Align text
Specify where the text appears on the image with the Text alignment dropdown. There are 9 options:
- Top left
- Top center
- Top right
- Center left
- Center center
- Center right
- Bottom left
- Bottom center
- Bottom right
Desktop size
Use the Width dropdown to control the horizontal space occupied by the block. Half width will include two blocks per row, while Full width spreads the block across the width of the section.
Adjust the Desktop height with the provided slider.
Mobile size
Adjust the Mobile height with the provided slider.
Overlay
Activate an overlay, by selecting either Solid or Gradient from the Overlay style dropdown. Then determine the Color with the rounded-rectangle swatch and level of Opacity using the slider.