Latest SeedProd News

WordPress Tutorials, Tips, and Resources to Help Grow Your Business

How to Add Custom WordPress Social Media Icons to Your Website

How to Add Custom WordPress Social Media Icons to Your Website (2 Ways) 

Written By: author avatar Stacey Corrin
author avatar Stacey Corrin
Stacey has been writing about WordPress and digital marketing for over 10 years and on other topics for much longer. Alongside this, she's fascinated with web design, user experience, and SEO.
     Reviewed By: reviewer avatar Turner John
reviewer avatar Turner John
John Turner is the co-founder of SeedProd. He has over 20+ years of business and development experience and his plugins have been downloaded over 25 million times.

Want to add custom WordPress social media icons to your site? With the right tools, you can place follow buttons in your header, footer, sidebar, or landing pages, even for newer platforms like Threads, Mastodon, or Bluesky.

This guide shows you three easy methods, including my favorite way with SeedProd, so visitors can find and follow you anywhere you’re active online.

Why Add Social Media Icons to Your WordPress Site?

Social media icons make it easy for visitors to follow you on other platforms. With people spending an average of 2 hours and 21 minutes a day on social media, adding icons helps you reach them where they’re already active.

Moreover, social media icons are small, allowing you to display them in many parts of your website, including:

Here’s a screenshot of how WPBeginner displays social media links in its WordPress sidebar.

WordPress social media icons in WPBeginner sidebar

When adding social media icons to your site, it’s helpful to remember that social media follow buttons are different from social share buttons or social sharing icons. Instead of asking users to share content, they encourage visitors to follow your social media profiles.

With that being said, let’s look at how to add custom social media follow icons to your site.

How to Add Custom WordPress Social Media Icons: 2 Ways

As we mentioned earlier, many popular WordPress plugins don’t include the functionality to add custom social media icons to your website. You’re often limited to the main social platforms, like Facebook, Twitter, Instagram, YouTube, LinkedIn, and Pinterest.

If your audience is active on more niche social websites, you may struggle to find a plugin that caters to your needs. With that in mind, we’ll share 2 easy ways to add custom social media icons to your website below.

1. Adding WordPress Social Media Icons with SeedProd

The easiest way to add custom icons anywhere on your site is with SeedProd.

SeedProd Drag-and-drop WordPress website builder

SeedProd is a drag-and-drop WordPress builder that lets you design headers, footers, sidebars, and landing pages without touching code. Its Social Profiles block makes it simple to add and customize icons for any network, including newer platforms like Threads, Mastodon, or Bluesky.

Step 1. Install and Activate SeedProd

First, visit the SeedProd pricing page, choose your plan, and create your account. For this guide, we’re using SeedProd Pro for its advanced features.

Next, log into your account dashboard and visit the Downloads tab. From there, you can download the plugin zip file and copy your license key.

Find your SeedProd license key

Now head to your WordPress admin area and upload the SeedProd plugin. If you need help with this step, follow this guide on installing and activating a WordPress plugin.

Once you’ve activated the plugin, go to SeedProd » Settings and paste the license key you copied earlier. Click the Verify Key button to save the settings, then move on to the next step.

enter your license key

Step 2. Create a WordPress Theme or Landing Page

The next step is to create a landing page or WordPress theme design; however, this will depend on which SeedProd license you chose in Step 1.

Basic and Plus users can build landing pages with SeedProd, while Plus and Elite users can create landing pages and WordPress themes with this plugin.

Follow the steps in these tutorials to build your SeedProd design:

After creating a landing page or WordPress theme, move to Step 3 to add your custom WordPress social media icons.

Step 3. Add Your Custom Social Media Icons to WordPress

SeedProd allows you to add custom social media icons anywhere in WordPress with its easy and powerful Theme Builder. After choosing your Website Kit, it’s simply a case of opening each theme part and adding the Social Profiles block.

Adding Social Media Icons to WordPress Header

Let’s start by adding social profile icons to your WordPress menu. To do this, go to SeedProd » Theme Builder, hover over your Header template, and click the Edit Design button.

edit your SeedProd header template

On the following screen, you’ll see a 2-column layout like this:

SeedProd header builder layout

By default, the template we’re using has a 2 column header with a logo and navigation menu. In order to add your social profile icons, you’ll need to change it to a 3-column section.

First, hover over the header section until it has a purple outline, then click the duplicate section icon.

Duplicate WordPress header section

Now, in the new section, hover over the contents until it has a blue border, then click the Trashcan icon to remove it.

Delete header row

After that, click on the 3-column layout option to add it to your new section.

Choose a 3-column layout

Next, move the elements from the old section into your new section by dragging and dropping.

Move old WordPress blocks into new columns

When you’ve finished, you should have 1 empty column left where you can add your social profile icons. Before you do that, hover once more over your old section and click the trash can icon to delete it.

Delete old section

To add your custom social profiles to your header, find the Social Profiles block from the left-hand sidebar and drag it onto your empty column. Now you can click the block to see its customization options.

Drag and drop the Social Profiles block

By default, the Social Profiles block will display icons for Facebook, Twitter, Instagram, and YouTube. You can change the icons by clicking each one and choosing a social media network from the dropdown menu.

SeedProd social media networks

The platforms you can choose from include:

  • Discord
  • Email
  • Facebook
  • Facebook Messenger
  • GitHub
  • IMDB
  • Instagram
  • LinkedIn
  • Medium
  • Phone
  • Pinterest
  • RSS
  • Slack
  • Snapchat
  • SoundCloud
  • Telegram
  • TikTok
  • Twitter
  • Vimeo
  • Weibo
  • Whatsapp
  • WordPress
  • YouTube
  • Custom

To add a custom social media profile button, click the Custom option and the gear icon to open the settings.

Custom social media profile settings

Next, click the Choose Icon option and search for a different icon using Font Awesome that fits your social media needs. For example, you can add custom social icons for Spotify, Skype, Tumblr, Behance, Airbnb, Audible, Playstation, and many more.

Choose a Font Awesome social media icon

After choosing your custom social profile icon, you can change the icon color and add your custom link.

Custom social media icon color and URL

Further down the settings panel are options to change your icon style, size, and alignment.

Social media icon size, style, and alignment

In the Templates tab, you can add a custom style to your icons with 1 click.

social media icon templates

The Advanced tab offers settings to customize icon styles at a granular level. For example, you can change icon background color, size, space, shadow, margin, and padding.

You can also show or hide your social profile icons on mobile or desktop devices, which is an excellent way to improve mobile optimization for visitors using a smartphone or tablet.

Social media icon visibility settings

Before saving your changes, hover over your Social Profiles block and click the Save icon. This will allow you to re-use it on other areas of your website without manually adding each social link and custom icon again.

Save your SeedProd social icons block

So in the popup window, give your block a name like “Custom Social Icons,” and save.

Save your social media profiles block

When you’re happy with your WordPress social media icons, click the Save button in the top-right of your screen.

Save your changes

Now, let’s add your social media icons to your website’s footer.

Adding Social Media Icons to WordPress Footer

To add social icons to your footer, go to the SeedProd theme builder dashboard, hover over the Footer template, and click the Edit Design link.

Edit your footer design

Next, open the Saved Blocks heading in the left sidebar, and drag over the custom social icons block you saved in the last step to a column in your footer area.

Choose your saved custom social icons block

If your WordPress footer has a similar background color to your icons, you can click the Advanced tab and choose a new icon color with the color picker.

Advanced social profiles color settings

When everything looks suitable, click the Save button to store your changes.

Adding Social Media Icons to WordPress Sidebar

To add custom social icons to your WordPress sidebar, go back to the theme builder dashboard, hover over the Sidebar template, and click the Edit Design link.

Edit your sidebar design

Now repeat the instructions from the previous step, and click the Save button when you’re finished.

adding social media icons to sidebar with SeedProd

You can also repeat this process for any page on your website, including your landing pages and content pages, such as your about, services, and contact pages.

Step 4. Publish Your Changes

The last step is to publish your new WordPress theme so your website visitors can see your new social media profile icons. To do that, go to the Theme Builder dashboard and turn the Enable SeedProd Theme toggle to the “Yes” position.

enable SeedProd theme

Now you can take a look at your changes. Here are a few examples from this tutorial:

Header

Social media icons in header example

Footer

Social media icons in footer example

Sidebar

Social media icons in sidebar example

2. Using the Built-in WordPress Social Icons Block

If you’re running WordPress 5.4 or newer, you already have access to the Social Icons block. This is the fastest way to add icons without installing another plugin.

First, Go to Appearance » Editor (for full site editing) or edit any page/post where you want icons.

Click the + button, search for “Social Icons,” and insert the block.

Add the social icons block

Click + Add icon inside the block. You’ll see a list of built-in networks like Facebook, Instagram, LinkedIn, and X (Twitter). Select the ones you need.

Choose your platform's social icon

Each icon has a field for your profile URL. Paste your link, and it will connect instantly.

Enter the URL for your social media platform into the social icon block.

You’ll see that this block has some missing platforms. For any that are not available, you’ll need a plugin that supports custom icons — such as SeedProd.

FAQs on Adding Social Media Icons to WordPress

What’s the difference between follow icons and share buttons?
Follow icons link directly to your social profiles so visitors can connect with you. Share buttons let users post your content to their own feeds. They serve different goals, so it’s smart to use both.
Should social media icons open in a new tab?
Yes. Opening links in a new tab keeps visitors on your site while still letting them check out your profile.
What size should my social media icons be?
Keep them large enough to click easily on mobile (at least 32px) but not so big they distract from your content. Most builders let you adjust size with a slider.
Where’s the best place to display icons?
Common spots are your header, footer, and sidebar. Many site owners also add them to About or Contact pages where visitors expect to find social links.

I hope this article has helped you learn how to add custom WordPress social media icons to your business website.

You might also like these other helpful guides from our blog:

Thanks for reading! We’d love to hear your thoughts, so please feel free to leave a comment with any questions and feedback.

You can also follow us on YouTubeX (formerly Twitter), and Facebook for more helpful content to grow your business.

author avatar
Stacey Corrin Writer
Stacey has been writing about WordPress and digital marketing for over 10 years and on other topics for much longer. Alongside this, she's fascinated with web design, user experience, and SEO.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. We only recommend products that we believe will add value to our readers.