Info Block

This block allows you to add an icon or image along with a heading and description.

Image/Icon

Select Source: Choose an icon or an image to display in the block.

Select Position: You can display the icon/image above or below the title, at the left or right of the title, or at the left or right of the title and text.

With Source selected as icon following options will be available Icon Size, Icon Color, Icon Hover color.

You will also find options to customize icon background here. Background Type, Color, Hover Color, Radius and Padding.

Background Options

You can select a background image for the block from here.

Background Color: Select a color for the background of the block from here.

Opacity: You can set opacity from here for the block.

Spacing

Specify space around the content by using Content Padding. Spacing tab offer options to customize the bottom spacing for Prefix, Title, Separator, and Description. There are also options to customize the Icon/Image responsive margin for Top, Bottom, Left, and Right.

Border

Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Border Width - Set a width for the border from here.

Border Color - You can give color to the border from here.

Border Radius - You can give border-radius to the box from here.

Box Shadow - You can give box-shadow to the block with a number of options available for customization such as color, blur, spread, position, etc.

Box Shadow Hover- You can give box-shadow on hover to the block with a number of options available for customization such as color, blur, spread, position, etc.

Separator

Select Position: You can display the separator after icon/image, prefix, title, or description.

Separator Style - You can select the style of the separator as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

Separator Thickness - Set thickness for the separator from here.

Separator Width - Set a width for the separator from here.

Separator Color - You can give color to the separator from here.

Call to Action

Type: Select to display the call to action as a text or a button or choose to hide it.

If you select the type as text, you will get the following controls to manage it-

  • Text and Link for the text

  • Option to open the link in new tab

  • Color options are available for Text.

If you select the type as Button, you will get the following controls to manage it-

  • Text and Link for the button.

  • Option to open the link in new tab

  • Color options are available for Text.

  • Button Padding

    • Horizontal Padding: Set padding to increase the width of the button.

    • Vertical Padding: Set padding to increase the height of the button.

  • Button Border

    Border Style - You can select the style of the border as solid, dotted, rigged, double, dashed, etc. You can also choose to hide it.

    Border Width - Set a width for the border from here.

    Rounded Corners - You can give border-radius to the box from here.

  • Color options are available for text, background, border, and for hover elements respectively.

You can also add link for whole block by selecting type as Complete Box.

Call To Action Typography

Under this tab, options for font family, font size, font weight and line-height are available for Call To Action.

Content

Under this tab, you can hide or display title, description, and prefix for the block and choose a font size, font-weight, and color for them individually.

You can set responsive font size of Title for Mobile and Tablet view.

Last updated