Icon With Text

About Icon With Text Section

In web design, the use of icons alongside text has become a popular way to enhance content and improve user experience. By combining icons and text, you can effectively convey information, guide users, and make your content more visually appealing.

In this article, we will explore the Icon with text section in Blum theme and how to configure each element inside it.

Access Icon with Text Section

From any page, please click on ‘Add Section’ on the left side bar, then choose ‘Icon with Text’.

Icon With Text Section Configuration

Icon with text section comes with 4 tabs: General, Layout, Icon and Button.

General

Firstly, you can change the color scheme for this section by selecting the scheme here. To change the theme color, please go to Theme settings > Colors.

After that, you can adjust Section subheading, Section heading and ​​Section description for the section by entering content on the fields.

Icon

You can select the Main, Extra accent or None for the Icon Accent Scheme.

If you want to change style for these accents, please go to Theme settings > Colors > Accent.

Layout

To select items per row on desktop and tablet landscape, you can select 3, 4, 5, or 6 items, each as you want.

For the items per row on tablet portrait, the range is 2, 3, or 4 items.

After that, you can select the position to display for the content of the section:

• Left

• Center

• Diagonal

Next, The Enable Carousel On Mobile and Show Navigation On Mobile options can be selected or deselected based on your choice.

You can also enable ‘Remove padding top’ and ‘Remove padding bottom’ to delete the spacing at the top and bottom between the section and the elements inside it.

Button

In the Buttons tab, insert the button label name for the button to add a button on the section. Click on the button link to add a direct link for it.

If you want to remove one button, just delete the text in the button label.

Prominent badge

You can set up these settings for the Prominent badge:

• Text: You can enter the name on the field

• Color scheme: Main accent or Extra accent

• Position: Left or Right

• Shape: Star, Diamond or Asterisk

Icon With Text Item Configuration

To adjust for the Block text, click on the block and go to the Settings.

You can change the icon for each Icon With Text item with the icon library or custom your own icon by uploading it as image or SVG:

• Theme library:

• Custom image:

• Custom SVG:

Text

You can adjust the content by entering heading and description here: