1. Home
  2. Knowledge Base
  3. Pro Block Tutorials
  4. Image Overlay Block

The image overlay block adds a highly customizable image menu option to the new editor.

To get started setting up the image overlay on your site, follow the below tutorial:

Select the Image Overlay Block from the blocks list:

Select Block

Select your background image:

Select Image

Set the link and hover effect for your overlay block:

Image Overlay Settings

Set your image overlay titles:

Add Title

Adjust your hover overlay settings:

Hover Overlay Settings

Adjust your border settings:

Border Settings

Set the alignment of your titles:

Text Alignment Settings

Customize your title font:

Title Text Settings

Configure a divider between your title and subtitle:

Divider Title

Linked Controls

Linked controls sets the padding for each side of the block to be equal.

Individual Controls

Individual controls allow you to set padding for each side of the block separately.

Was this article helpful?

Related Articles