Article sections

    In the Customizer, go to Hero -> Front Page Hero -> select Slider.

    You can add multiple slides, you can duplicate them and remove them anytime.

    Slide Background

    The background type can be set to:

    • Color

    After selecting “Color” background, click on “Options” and a panel will open, where you can select the color of your choice.

    • Image

    After selecting “Image” background, click on “Options” and a panel will open, where you can upload the image of your choice. In addition, you can configure the image size (Auto/Cover), and you can position it (left center, left bottom, center center, etc.). Also, you can change the image any time, or remove it completely.

    • Video

    After selecting “Video” background, click on “Options” and panel will open, where you can specify the video you want to include in the front-page hero. It can be a self-hosted video, or an external video you give the link to.

    Also, you can upload an image that will serve as video poster (in case the device does not support playing videos in the background, the video poster will display).

    • Gradient

    After selecting “Gradient” background, click on “Options” and a panel will open – where you can select the gradient of your choice.

    Show Overlay

    Check the checkbox to show an overlay (a semi-transparent color that is applied on top of the slide, to obtain a nice visual effect). Click on “Options” and a panel will open, with the customization options for the overlay.

    Overlay type

    You can set the overlay type to:

    • Color – for this overlay type, select the color and adjust the color opacity. You can add overlay shapes from 10+ available shapes. Also, adjust the shape light on a scale from 0 to 100.
    • Shape only – for this overlay type, select the shapes you want to apply to the overlay, from a list of 10+ available shapes. Also, adjust the shape light on a scale from 0 to 100.
    • Gradient – for this overlay type, select the gradient you wish to place into the slide. You are free to play with the colors combined in the gradient and adjust the angle of the gradient. Like in the previous cases, choose the overlay shapes and configure the shape light.

    Slide Content

    Content Layout

    The content pieces included in a slide can be placed:

    • On center
    • On right
    • On left
    • Text with media on left
    • Text with media on right
    • Text with media above
    • Text with media below

    Content Spacing

    Content spacing refers to the space from the top and to the bottom, of the slide content. The values are expressed in percentages, so it should be easy to estimate that space, as related to the overall design.

    Mobile Content Spacing

    The distance from the top and to the bottom should be set differently for mobile devices. That is why Mesmerize contains a separate section where you can adjust these distances (in percentages) from the top and to the bottom, for mobile devices.