General Elements

How to Add Social Icon in Bricks Builder Using BricksFly

Estimated reading: 2 minutes 19 views

Social Icons Element lets you add social media profiles, configure their links, and customize how the icons appear. You can also arrange the icons in a row or column and adjust their alignment to match your website layout.

Requirement 

Make sure you have installed:

  • Bricks Theme 
  • BricksFly Pro
Requiremnt of bricksfly
Bricksfly pro

Activate Social Icon In BricksFly

  1. Go to your WordPress Dashboard. 
  2. Click on BricksFly. 
  3. Head to the Elements tab. 
  4. Under General, toggle On Social Icon.
Activated social icon

Step 1: Add and Configure Social Icons

Add social icons, profile links, and customize their appearance.

Social Icons

Social Icons section lets you add links to social media profiles such as Facebook, X/Twitter, YouTube, LinkedIn, and Instagram. Click + Add Item to add as many social media icons as needed.

Social icon panel

Each item represents a separate social media platform. Open an item to select its icon and add the corresponding profile URL. You can add, remove, duplicate, adjust color, or rearrange items based on your requirements.

For example, you can select the Facebook icon and add your Facebook page URL. Visitors can then click the icon to open that page.

Configure socail platform

Step 2: Set the Icon Direction

Choose whether the social icons appear in a row or column.

Direction

Direction setting controls how the social icons are arranged. Available options include:

Row: Displays the icons horizontally, placing them next to each other.

Column: Displays the icons vertically, placing them one below another.

In this example, Row is selected. You can choose the direction that best suits the available space and your website layout.

Setting direction

Step 3: Adjust the Icon Alignment

Choose how the social icons are aligned based on the selected direction.

Alignment

Alignment setting controls the position of the social icon group within the Social Icons Element.

  • Row: Aligns the icons horizontally to the left, center, or right.
  • Column: Aligns the icons vertically to the top, center, or bottom.

Since Row is selected as the direction, the available alignment options position the icons horizontally. In this example, Center is selected.

Alignment adjustment

Final Result

Share this Doc

How to Add Social Icon in Bricks Builder Using BricksFly

Or copy link

CONTENTS