Skip to content
CodeinWP content is free. When you purchase through referral links on our site, we earn a commission. Learn more
Home / Blog / Determining the Best Placement...

Determining the Best Placement for Your Social Media Icons

How many websites have you been to where you’re searching for social media buttons and just can’t find them? Then, it’s not until you scroll all the way down to the bottom of the page that you see them nestled in the footer. Sometimes, they’re so tiny they might as well not even be there at all.

Social media is too large and too important to relegate to the bottom of your clients’ sites. Social media buttons deserve a prominent position somewhere. It doesn’t have to be in your face, but it should definitely be eye-catching and easy to find. Basically, if a site visitor likes your client’s content and wants to follow them on Twitter or Facebook, they should be able to do that without having to hunt around for the icons or links.

With that in mind, let’s spend some time today talking about everything social media icons, from the types available to where they should appear on the site to what your client’s industry has to do with decision-making in this regard.

Why social media buttons matter?

Social media buttons have been around for a while now. At first, nobody knew what value they could bring exactly, apart from being a nice addition to a clean design. Today, we do know that the presence of such buttons results in additional mentions and shares, and the numbers are very real. For example, back in 2011, HubSpot reported that including a Twitter share button increased Twitter mentions sevenfold. That’s huge!

But not to get ahead of ourselves, at the same time, too many social media buttons tend to have the opposite effect – decreasing the number of overall shares due to decision paralysis. Just to give you one example, Neil Patel of QuickSprout once shared that when he added two new social media buttons for LinkedIn and Pinterest (on top of the original three – Facebook, Twitter, and Google+) he experienced a drop in shares by 29 percent.

So designing the right social media appearance of a website, if you will, is all in the details. It’s about finding the right balance between how quickly the visitor can notice the icons vs. how easy it is to share without having to choose from too many options.

How often do visitors use them?

Obviously, our main goal with social media buttons is to not only have them sitting somewhere, but to convince the visitors to use them and share whatever they’re reading at the moment.

So, do people really click those share buttons?

In short, yes. But the specific results depend heavily on the niche and the type of site they’re being displayed on. In general, we can expect anything from 5 percent to 40 percent of tweets for any given piece of content to come from tweet buttons displayed alongside the content itself.

This graph by Joshua Benton illustrates the social media results from 37 news sites:

social 5

To quote the original source:

The Y axis is the percent of the 1,000 most recent tweets that Twitter says were generated by a Tweet Button. So, 16.3 percent of those tweets to nytimes.com (The New York Times) came from such a button, versus 20.2 percent for wsj.com (The Wall Street Journal).

Therefore. Should we enable some form of social media buttons on our clients’ sites? Yes, certainly.

Types of social media icons

There are basically two types of social media icons available right now: profile links and share buttons.

Profile links can take any number of forms from just the social network’s icon to the icon plus the network’s name. Even a  custom icon can be devised to better reflect a client’s brand. The type of site and the space allotted for social icons will determine what option is best for your client’s situation. Even so, these links point directly to the social media profile in question. This gives site visitors the chance to directly connect with your clients on the various social networks.

An example of profile links:

social 1

Share buttons, on the other hand, do not take the site visitor to your client’s social profiles. Rather, clicking prompts them to share the current page on a specific social network. Every social network has these share social media buttons available—which can be installed via plugin or even though an external service like Buffer. They’re important for expanding the social reach of a site. And as you likely know, that’s an integral component in building an audience.

Example:

social 2

What about the icon placement?

The positioning of social icons can spell the difference between building social engagement and missed opportunities. There are actually only a handful of locations for social icons that are considered prime real estate:

Header: The header is what attracts the eye of site visitors first. Along with the title of the site and the main navigation, social profile link icons fit right in here.

Sidebar: Positioning social icons near the top of the sidebar is another way to quickly ensure visitors see them. The benefit here is they can be called out with a prominent widget header like, “Follow Me!”

Above or below posts: If your clients want to ensure social engagement, placing share buttons above and/or below blog posts is a good way to accomplish that. This is also the most popular way to go about displaying share buttons. You will find examples of this on sites like TechCrunch, The Verge, Mashable and countless others.

social 3

Floating bars: To ensure your client sites get the maximum number of shares possible, installing a plugin that provides some sort of a floating bar is a good solution. The idea behind a floating bar is that it always stays in the visible area of the screen as the visitor scrolls up and down the page.

The point here is to keep the social engagement links within the site visitor’s view and within easy reach as much as possible. If the content is lengthy, then having the icons only in the header and footer doesn’t qualify as keeping them within the visitor’s sight.

There’s a really nice example of this on ReadWrite. If you visit the page from a desktop, you will see the bar on the right. Visiting it from mobile will show only social media buttons above and below the post.

social 4

Looking for something even more interesting? How about a cool fading-in effect like that used by Upworthy? This gives the icons extreme visibility as they literally jump right at you. When you scroll down, a banner appears across the header that prompts visitors to share the page on Facebook. There are several plugins you can use to achieve this.

upworthy-social-bar

The industry effect

While every company in every industry can benefit from social media engagement, not all are created equal in terms of how social media is utilized. For instance, a highly corporate website might not be able to make use of the floating bar-style share icons because they don’t offer a professional look. And a team-based site—a lawyer group, for instance—would probably not be able to use the sidebar icons because those typically appear below an author bio and/or headshot, making them seem out of place.

Industry quirks notwithstanding, the upper right hand side of the page seems to be the best placement for social profile icons, over all. And this shouldn’t really be surprising. Online visitors expect the elements of a web page to be where they are used to finding them based on prior user experience. This definitely supports the “upper right hand side” idea.

Icons and share buttons might not be enough

You actually have more options than just icons that link to your social profiles and social media share buttons for making the sharing of your content easier for your clients’ site visitors. You can also embed social feeds—often in your sidebar—to attract further attention for specific social accounts. This has the added benefit of placing even more original content on the site, which is a definite bonus.

You can easily pick up the Twitter API to show a client’s tweet stream or use the Facebook Like Box to showcase her latest posts right in any widgetized area on a site. A sidebar is the most common choice in terms of positioning but you may find embedding this content into a page dedicated to social feeds to be best.

You could also use the Social Share Starter Plugin to eliminate the effects of negative social proof. That is, there’s quite possibly nothing worse that display social share icons only to have them show zeros across every single share counter. This plugin only shows your shares once you’ve hit a certain threshold and displays them cumulatively at that, to make for a more impressive first impression.

Evaluating for effectiveness

As with anything on the web, social media icon placement needs to be tested to see if it’s effective. Analytics are one of the best ways to accomplish this. Actually, side-by-side split testing is your best bet for getting a direct impression of how effective the social icons are on your clients’ sites.

You can set up a split test in Google Analytics by using Content Experiments. One version of the page could feature the icons in the header and one could feature them in a sidebar. Or perhaps one page sports the share buttons at the top of a post and you want to compare that to a floating share bar. Whatever the specifics, testing is the only way to see what works, what doesn’t, and what you need to do to get more user engagement with social profiles.

Another analytic site, Mouseflow, offers live tracking, click and move heatmaps, and in-page analytics to give a comprehensive overview for each page of your client’s site. Because all web pages are not created equal the type of content will determine the type of viewers your client’s site will attract. And, how they navigate that site will depend on whether it is something like a medical peer review site or a retail specialty store. Knowing how viewers interact on these sites, where they click, and where they spend most of their time on the page, will help further determine the best placement for social media icons.

Conclusion

As I’m sure you can tell by now, successful positioning of social icons and social media share buttons rely on a variety of factors. But just because you might need to spend some time thinking about it doesn’t mean it’s not a worthwhile pursuit. Ensuring your clients get he maximum number of social shares possible—as well as the maximum number of follows and likes—is good for business. It’s mutually beneficial so you might as well put in the effort to help your clients do it right.

What have you found to be the best spot to feature social icons? What about share buttons? I’d love to hear your opinion on what works and what doesn’t in the comments below.

👉Interested in trying something unique? You should consider creating a sticky social media share buttons.

Show Comments

Or start the conversation in our Facebook group for WordPress professionals. Find answers, share tips, and get help from other WordPress experts. Join now (it’s free)!

Most Searched Articles

Best JavaScript Libraries and Frameworks: Try These 14 in 2023

In this post, we look at the best JavaScript libraries and frameworks to try out this year. Why? Well, with JavaScript being available in every web browser, this makes it the most accessible programming language of ...

25+ Best Free WordPress Themes for 2023 (Responsive, Mobile-Ready, Beautiful)

If you're looking for only the best free WordPress themes in the market for this year, then you're in the right place. We have more than enough such themes for you right ...

12 Best WordPress Hosting Providers of 2023 Compared & Tested

Looking for the best WordPress hosting that you can actually afford? We did the testing for you. Here are 10+ best hosts on the market ...

Handpicked Articles

How to Make a WordPress Website: Ultimate Guide for All Users – Beginners, Intermediate, Advanced

Many people wonder how to make a WordPress website. They’ve heard about WordPress, its incredible popularity, excellent features and designs, and now they want to join the pack and build a WordPress website of their own. So, where does one get ...

How to Start an Ecommerce Business: Ultimate Guide for 2023

Is this going to be the year you learn how to start an eCommerce business from scratch? You’re certainly in the right place! This guide will give you a roadmap to getting from 0 to a fully functional eCommerce business. ...