Group module

The Group module is a special module which is similar to a container, other modules could be put into the Group module. You will find the tools icon color is blue.

Template

You could save the group (including the modules in it) as your own template if you click this button.

Align

The “Align on Vertical: Equal Spacing” would work when there are multiple rows of modules.

The “Align on Horizontal: Equal Spacing” would work when there are multiple modules in one row.

Force Content to fit Fullwidth

When a group is fullwidth, and this option is “On”, it would work like the following image:

Disable Gap

It will remove the spacing between the modules in one row.

Screen height

You could set the percentage of screen height for the group. It would be if set it “50% of the Screen height”: 

If the height of the module is more than 50% of the screen height, the group would be with modules height. The height option for mobile would only work on portrait mode.

Background

There are background settings(color, image, and video) for The Group. You could create a fullscreen wrap by the options and 100% of the screen height, increase the width as fullwidth. It will be:

Hosted Video: It needs to enter a video file URL(not 3rd embed code like Youtube). If you enable the “Enable Mix Blend Mode” option, it uses the CSS – mix-blend-mode: screen. If you want to create a text mask effect, please insert a Text module into this Group module. Please set white color for “Choose Color for Video” option. It is a new CSS feature; it doesn’t work well on part of browsers.

Shadow and Radius

There are shadow and radius(round corner) options. You could add one Image and Text module into a Group to create an icon box with these options. The shadow options are the same as Single Image shadow. It is recommended with backgorund color/image/video.

Scrolling effect

If you active “Change Universe Color when Scroll In”, the background color will changed when the group scrolled into browser viewport:

Auto Goto Top When Scroll In: The group module will auto goto the top of browser viewport when it scrolls in.

Make Groups Contour on The Current Row

If there are multiple Groups in one row, their height will be the same.

Was this article helpful?

Related Articles