BLACK FRIDAY: 50% OFF all Pro plans
Pro from $18 a year or $60 lifetime, no code needed
Ends Cyber Monday, 30 Nov. Lock in the price today
Get 50% Off
Guide

Social Icons & Share Free

How to set up and style the Social Icons & Share widget in Elementor.

Social Icons & Share works in two modes. It can link to your own social profiles, or it can show share buttons that let visitors post the current page. Use it in headers, footers, author boxes and at the end of blog posts.

Part of: Bright Addons (free).

Set it up

  1. Drag the Social Icons & Share widget onto the page.

  2. In Icons, set Mode to Link to my profiles or Share this page.

  3. Edit the Items list. For each row choose the Network and the matching Icon.

  4. In profile mode, paste the address into Profile Link for each row.

  5. Choose the Shape, Colors and Direction, and switch on Show Labels if you want text.

  6. Set the Alignment.

  7. Open the Style tab to set the icon size, box size and gap.

Content options

Icons

Option What it does
Mode Link to my profiles opens the addresses you enter. Share this page turns the icons into share buttons.
Items The list of icons. Add, remove, duplicate and reorder them.
Network The network for this item. It sets the brand color and, in share mode, the share destination.
Icon The icon to show. If it is empty, the default icon of the network is used.
Label The name used for the label and for screen readers. Leave empty to use the network name.
Profile Link The address the icon opens. Used in Link to my profiles mode.
Custom Color Replaces the brand color of this one item in the Official brand colors and Brand outline modes.
Show Labels Shows the label text next to each icon.
Shape Circle, Rounded or Square.
Colors Official brand colors, Brand outline, or Custom colors set in the Style tab.
Direction Lays the icons out horizontally or vertically.
Alignment Aligns the icons left, center or right, per device.
Bright Addons Pro

Like this free widget? Get 80 more with Pro

Pro adds 80 widgets, 10 extensions, a Theme Builder and 32 dynamic tags, and keeps every free widget. From $18 a year, with a 14-day money-back guarantee.

Style options

These sections are in the Style tab.

  • Icons

    icon size, box size, gap, label typography when labels are on, and normal and hover icon and background colors when Colors is set to Custom.

Tips

  • New rows start with the Facebook icon. After you change the Network, change the Icon to match.

  • In share mode, items for Instagram, YouTube, TikTok, GitHub, Dribbble, Behance and Custom are skipped, because they have no share link.

  • In profile mode, an item with an empty Profile Link is not shown.

  • Share buttons open in a new tab. The Email button opens the visitor's own email app with the page title as the subject.

Questions and answers

Does the widget send visitor data to social networks?

Not when the page loads. In share mode, when a visitor clicks a button, the browser opens that network’s share page and passes it the page address, and for most networks the page title. Profile links are plain links.

Which page is shared?

The page being viewed. On a single post or page it is that post’s address and title. On the home page it is the site address and site name.

Can I add a network that is not in the list?

Yes, in profile mode. Choose Custom as the Network, pick an icon and enter the link.

Can I use my own colors?

Yes. Set Colors to Custom and choose icon and background colors in the Style tab. To recolor one item in the brand color modes, use its Custom Color.

Need more help?

Check the troubleshooting guide, or contact support with the page address and what you expected to happen.

Troubleshooting guide
All guides