Block: Social media icons

The block is supported in the “Columns” section and can be added to columns on all pages.

Add block

  1. Add or find an existing column section where the block should be displayed
  2. Click on the plus button and select “Social media icons”

When the block is first added, it will be empty. This means that no icons will be displayed, as each icon must be activated before it can be displayed.

Activate icon

  1. Edit the block by clicking on the pencil icon
  2. Open one of the icon groups (8 available in total)
  3. Turn on the “Show icon” switch
  4. Select the icon you want in the icon selector below

Customize icon

In the settings for the block itself, you can change the icon color and the background color behind the icon. These changes will apply to all activated icons.

Options per icon

There are three options for each icon:

  • Alternative text: This is useful for website accessibility. It ensures that screen readers understand what the icon is meant to do. For example, this could be “Visit us on Facebook” if the icon links to Facebook.
  • Link: Enter the link that will open when the icon is clicked.
  • Open in new tab: Ensures that the link opens in a new tab when clicked.

Advanced settings

If you have advanced mode enabled, there will be even more settings under “general settings.” These settings apply to all icons and/or the entire block.

  • Icon height
  • Icon padding: This refers to how much space there should be around the icons.
  • Icon border radius: Adjust to make the icon background more or less rounded.
  • Alignment, spacing, and columns: Used to adjust whether the icons should be displayed in the middle.

Examples

Below there's some examples on icons with different setups.


Was this article helpful?