Icon with text columns
Last updated
Was this helpful?
Last updated
Was this helpful?
Use the Icon with text columns section to display a row of text blocks with icons. You can highlight your company values, process, or key features of your product.
Add columns with icons, text, and an optional link.
Change the icon color and size
Change the layout and alignment
In the editor side panel, click (+) Add section and select Icon with text columns. Click and hold the drag handles ⋮⋮ to re-order sections.
Editing templates will change all pages that use the same template. Create new templates for different page layouts, or show dynamic page content in the same template.
Sections include general styles. Click the section to find options for colors, spacing, and animations.
Change the layout of the columns, including the icon alignment, number of columns, and content width.
Click section for settings
Icon alignment
Place the icon above or to the left of the column text.
Columns per row
Choose how many items to display in each row: between 2 and 8 columns.
Content width
Display the section at Full width or use the slider to set a custom width.
Custom width
Set the maximum width of the section: between 400 and 1200 pixels.
The section will change in size to fit smaller screen sizes.
Add column blocks with icons, text, and optional link. In the Icon with text columns section, click (+) Add Column. Click and hold the drag handles ⋮⋮ to rearrange the blocks. Click the Column block to add content.
Select from 30+ icons or upload a custom icon image
Add column headings and text
Make the icon a clickable link
Click column block for settings
Icon
Select from 30+ icons to show in the column.
Custom icon image
Upload your own icon to show in the scrolling content.
We recommend a .png image with a transparent background and minimum dimensions of 50px by 50px.
Link
Add a link to redirect visitors when they click the icon.
Heading
Add text as the column title.
Text
Add multiple lines of text below the heading.
Customize the style of the icons, including the frame around them, colors, and width.
Click section for settings
Icon framing
Choose to show a Circle or Slightly rounded border around the icons. Select None to show no border.
Icon framing style
Choose to display icons with a solid color background (Filled), or with a border and no background (Outlined).
Icon frame color
Choose to use the Accent color (from your theme settings) or the Current text color (from the section settings).
Icon width
Set the pixel width of icons for desktop screens: between 10 and 50 pixels.
Mobile icon width
Set the pixel width of icons for mobile screens: between 10 and 50 pixels.
Section colors
Section spacing
Section animations
