Tools & Tips for Integrating Social Media into Your Website

Tools & Tips for Integrating Social Media into Your Website

In this article, we will discuss Social Media Integration into Websites and why web businesses need it. We will also look at some quick and easy online tools that will help you to integrate social media on your website.

Let’s first answer the ‘What’ and ‘Why’ of social media integration on a website before we answer the ‘How’.

What is Social Media Integration?

People and communities share, comment, like or follow  a certain piece of content on a website that they find interesting via social media. It is not just limited to the ‘Facebooks’ and the ‘Twitters’ of the hip social circle, but also extends to social bookmarking sites such as Digg and StumbleUpon, photo sharing sites such as Flickr and Pinterest, blogging sites such as Blogger and WordPress, discussion sites in the form of various online forums, video sites, online deals sites and many more. While being active on these sites to promote your brand must be an essential part of your Social Media Campaign, it is also prudent to integrate social media onto your site to connect these various platforms with the actual real estate of your brand – your website.

In other words, you are required to connect social media profiles from the web to your website via social share buttons, social media profile buttons and more that are yet to be discussed in this article. This facilitates your website visitors to click and connect with you instantly. This is the most viral form of marketing for your business and it also happens to be free or low cost.

Why do you need a Social Media Integrated Site?

Take a look at some eye-opening Social Media User Statistics for 2012:

  • The total effect on purchase behavior via Facebook is 47%.
  • 62% of the global population uses social media.
  • 76% of Twitter users are actively tweeting updates.
  • 12% of Twitter users have purchased a product based on info found on Twitter.
  • 51% of best-in-class companies use social sharing tools on their websites.
  • 86% of web users prefer logging in via social profiles in websites, while only 21% of the best-in-class websites use a social log in feature.

Social media plays an important role in your website’s SEO, especially after search quality-based algorithmic updates like Panda and Penguin. Social signals have become increasingly important towards improving your website’s search ranking. As a web business owner, however, you need to keep in mind that social media is also an integral part of your site’s user experience and retention. When your website provides social media buttons, your users need not leave your site to like or recommend it.

Social media essentials that can be integrated into your website:

1.   Social Media Buttons

 These are icons of popular social media sites such as Facebook, Twitter, Google+, LinkedIn, Tumblr, Pinterest, StumbleUpon and Reddit. They are placed at the top, left, right or bottom of web page content; such as a blog, video, infographic or image. See the samples below:

Sample of Icons placed on the sidebar

Sample of Icons placed on the sidebar

Sample of Icons Placed on the Header

Sample of Icons Placed on the Header

Sample of Icons Bar Placed at the Bottom

Sample of Icons Bar Placed at the Bottom

Tools and Resources:

Article Resource for Social Plugins for WordPress

 

2.   Social Share Buttons

Social Share Buttons let the user stay on the site and share the content on their social media profiles with just a click and without leaving the site. Site visitors can choose interesting content to share, click on the social share button and easily post an update to their social media profiles.

Do not make the buttons too small or too big. Ideally, they must not draw too much attention but still be easy to find. The position of the social share buttons is one of the factors that determines effective usability of your site.

The following are some helpful hints on the positioning of share buttons:

  • Keep the share icons above-the-fold, so that users need not scroll to find them.
  • If you have a blog on your site, however, you can place them at the bottom of the blog so that the reader shares it once they finish reading the blog.
  • You can also have these share buttons floating on the website which moves along with the scrolling action on the page. GitHub provides a floating widget for such placement of social share buttons. There are many free tools listed under Tools and Resources below, that provide the floating bar. Look at the picture of a floating social share bar, as shown below:
Sample of Floating Social Share Buttons Bar

Sample of Floating Social Share Buttons Bar

  • Place the share buttons only in those areas where it makes sense to share. For instance, if you own an e-commerce website and your users are buying a product on the product page, do not prompt them to share the product image or content because all they need at that point is to complete their purchase. You could include a share button or a Facebook Recommend button at the end of the transaction, i.e., the Thank You page, where your users would be more likely to spread the word.
  • These social share buttons usually show the number of times the content of your site has been shared on the web, thus also giving a quick preview of how popular the content is to new site visitors, as shown in the sample screenshot below:
Social Share Buttons Displaying Number of Shares

Social Share Buttons Displaying Number of Shares

This increases user engagement, encourages word-of-mouth marketing and brings in social signals to your site for better search rankings.

Tools and Resources:

 

3.   Social Login

You may have noticed that many of the most popular sites on the web use social login. Look at some examples shown below:

 

Social Login Options Sample 1

Social Login Options Sample 1

 

Social Login Options Sample 2

Social Login Options Sample 2

Having social login alongside a regular login on your website gives the user plenty of options to choose from. This is a great approach in terms of your website’s usability as some users find it more convenient to use an existing social login rather than create an entirely new one. Those who do not have a social media profile can still log in the usual way.

Benefits of the Social Media Login Feature are as follows:

  • No Spam, only real people register via social login
  • Rapid sign up, no typing-in of user details required
  • Lower bounce rates
  • The social login user need not remember a new username and password
  • You can retrieve their email from the social media profile used to login
Tools and Resources:

 

4.   Social Commenting

Giving your users a chance to pass on an opinion or give quick feedback in the form of a comment below your website’s blog or article ensures active engagement. Using social commenting, which means allowing users to comment via their existing social media profiles, has different benefits than the regular comment box that is built-in to your CMS or other website platform.

The following are the benefits of social commenting:

  • Avoidance of Spam Comments, social media profiles are owned by real people,
  • Increased Social Signals to your site.
  • Using a personal social profile to comment discourages users from giving derogatory comments, protecting your brand’s reputation.
Tools and Resources:

 

5.   Authorship:

Search Result Sample of Authored Content

Search Result Sample of Authored Content

If you were to look at search results for your keyword, such as the one shown above, which result really catches your eye? Generally, it would be the one with the picture of the author in it. Such search results are achieved by creating the authorship markup with Google+ and adding it to your blogs, articles and other content you own. This gives you authority over that content. Also, it gives the content a human touch which may make the reader select your article over the others when looking for information.

Here is a step-by-step process on how to create Google+ Authorship for your content:

  • Create a personal account on Google+
  • Go to Google+ Profile page
  • Click Edit Profile
  • Scroll down on the page and Click Contributor to
  • Click Add Custom Link
  • Enter the name of the blog page and the blog URL
  • Click Save
  • Click Done Editing on the top blue bar of the page
  • Copy the profile page URL to the code that links to the Author’s name below the content, for example, Greg Sterling on Google+
  • Add rel=”author” tag to it, as shown in the sample code below:

 

Sample markup showing the use of rel="author" tag

Sample markup showing the use of rel=”author” tag

6. Activity Feed:

Add an activity feed on your website that describes every recent action that has taken place on your website by your site visitors. While there are many developer resources to create your own activity streams on your website, such as Gigya and Atlassian, you can embed social activity feeds from Facebook and Twitter on your site, if you have an active Facebook and Twitter page. The latter is much easier and does not necessarily require a web developer’s expertise, see tools and resources below.

Sample of Facebook Activity Feed on a Website

Sample of Facebook Activity Feed on a Website

Sample of Twitter Activity Feed on a Website

Sample of Twitter Activity Feed on a Website

Tools and Resources:
 

Additional Facebook Social Plug-ins:

  • Send ButtonThis button can be used to send content to a specific Facebook friend or group instead of the entire community.
  • Subscribe ButtonThis button lets users see who has subscribed to your page.
  • Recommendations BoxBased on the popularly shared content, the users on your site are shown the content that is highly recommended for further reading. It also shows the number of people in your Facebook friends list who have shared and liked the recommended content.
  • Like Box  – The longer version shows the posts liked on the page while the shorter version shows faces of Facebook users that like your page. You can opt for the shorter version if you have already placed a Facebook Activity Feed social plugin on your site. It helps users to automatically prefer your page when they find a Facebook friend’s picture in your Like Box. Another mini version of this feature is the Facepile plugin.

 

Other Social Integration Tools and Resources:

  •  Embedded TweetsUsing a single line of code provided by Twitter developers you can embed your tweets on your website.
  • LinkedIn Company Insider PluginThis plugin lets you show off your company’s strength with staff photos and their recommendations in a little box on your website.
  • LinkedIn Recommendations PluginThis recommendation plugin is useful for B2B companies in terms of increasing the website’s credibility in its niche.
  • Additional LinkedIn PluginsThese plugins are useful for B2B sites. 
  • Pinterest RSS WidgetThis is a WordPress plugin and is a feature useful for sites that have a lot of images (such as a wedding photography site or online apparel store). All the images you pinned on Pinterest can be made visible to your site visitors.
  • Ratings and Review PluginGigya offers the Ratings and Reviews plugin for websites that allow your site visitors to rate and review your products or services right on your site while they are logged in to their social media profiles, such as Facebook, Twitter and LinkedIn. This brings in social referral traffic and valuable social signals to increase your website’s search rankings.

With a full-fledged social media integrated website you will have higher user engagement and increased social media activity on both your website and your brand pages as a whole. You can test this in WooRank’s Website Review for Free. Look at a sample test shown below:

Social Monitoring - WooRank Website Review

Social Monitoring – WooRank Website Review

By making use of the various social media integration tools and resources listed above, you can make your website the main social hub for user interaction and engagement, thus driving viral social traffic to your site.