Mobile settings

Using the "Mobile settings" block, you can apply changes to the mobile mode regardless of the desktop settings.

Tip: To add a block, the "Image with text overlay" section is required. Press "Add block" and choose the one in Theme Blocks. Drag and drop the block to the desired placement in a section.

In this block, you can select an image for mobile individually. Otherwise, the same image as for the desktop will be shown on mobile view. Press on "Select image" to upload the one you need. The recommended image ratio is two-to-one (width-to-height respectively).

Check the "Show image overlay" option to display the color overlay of the image. This option works with the configured settings of the image overlay in the section. Find more details here.

Text

Here you can change the "Heading size" from "Same as on desktop" to one of the options: "Large", "Medium", or "Small".

If you need to align the text to "Left", "Center", or "Right", select one of the options in the "Text alignment" drop-down.

Layout

The "Height" of an image can be changed to "Same as on desktop", "Adapt to image", "Fullscreen", "Fullscreen without header", or "Fixed". If you choose the "Fixed" option, use the "Fixed height" scale to control the image height from 100 to 700 pixels.

The "Text position" can be placed "Below image", "Over the image, top", "Over the image, middle", or "Over the image, bottom". Select the desired option in the drop-down list.

In the following examples, you can view how each option might be displayed on mobile:

Last updated