Note: While our most popular guides have been translated into Spanish, some guides are only available in English.
Using Social Links Blocks

Use the Social Links Block to display social media icons on your site if your template doesn’t show them by default. The icons link to your connected accounts. It’s common to add the Social Links Block to the footer, but you can add it to any part of your site that supports blocks. To find out if your template displays social icons by default, visit Displaying social icons.

Tip: To help you get started, your template might include a Social Links Block in its demo content. To customize the block, hover over it and click Edit.

Step 1 - Connect accounts

Visit the Connected Accounts panel to add social accounts that will appear as icons in the block. To learn more, visit Connecting social accounts

Step 2 - Add the Social Links Block

  1. Open a page or post editor.
  2. Click an Insert Point or the +.
  3. Select Social Links from the menu.
  4. For more detailed steps, visit Adding blocks.


Step 3 - Change the design

In the block editor, you can change the following settings for the Social Links Block:


Changes the style or shape of the icons. The options are:

  • Regular - The default shape of the service's branding. For example, the Facebook icon will be in the shape of an "f."
  • Circle - Border
  • Circle - Knockout
  • Circle - Solid
  • Square - Border
  • Square - Knockout
  • Square - Solid
  • Rounded - Border
  • Rounded - Knockout
  • Rounded - Solid
Size Changes the icon size. The options are:
  • Extra Small
  • Small
  • Medium
  • Large
  • Extra Large
Alignment Changes the alignment of the icons relative to the block's container. The options are Left, Center, and Right.

Changes the background color of the icons. The options are Black, White, and Standard.

If Standard is selected, the icons will match the service's branding. For example, the Facebook icon will be blue.

Click Apply to save your changes.

After clicking Apply, you can see how the social icons appear. Here's an example:


Tip: These settings don't affect built-in social icons, which have their own style settings.
Was this article helpful?
120 out of 376 found this helpful
Using Social Links Blocks