5 Ways to Optimise Your Social (Count) Buttons

By . Filed in Web Design

Today, it is common practice to add social buttons on webpages for better user engagement and to make it easier for your posts to be shared. However, these buttons could slow down your website load performance severely.

For instance, with the Facebook Like button, the script to fetch the “like” numbers for your page and also to append the button HTML markup are the culprits. The impact could be very significant if you add the like button to every post.

In this post, we are going to discuss several solutions to optimize social buttons, which also improves your page load performance. We have been trying some available tools and scripts out there and here are our top 5 of the list., with their pros and cons attached. Let’s check them out.

1. Socialite

Socialite is a JavaScript library, developed by David Bushell. It allows us to load the actual social buttons upon a particular event like hovering or scrolling, making your page load more efficiently.

Pros

  • Available as WordPress plugin.
  • No need jQuery or other libraries.
  • Load the actual social buttons upon any event: hover, scroll, click, etc.
  • Customizable through CSS.
  • Support for many social networks, including Facebook, Twitter, Google+, Linkedin, Pinterest, Spotify, and Github. Extensible for other social networks.

Cons

  • No supports for querying share or like numbers.

2. Sharrre

Sharrre is a jQuery plugin for adding social buttons on webpage. It comes with a set of API to make the button highly customizable.

Pros

  • Support lots of social network buttons, Google+, Facebook, LinkedIn, Digg, etc.
  • Fully customizable button with CSS and the plugin options.
  • Ablity to fetching share numbers and also sum them up.
  • Tracking with Google Analytics.
  • Available as WordPress plugin.

Cons

  • Dependent on jQuery to work.
  • Also rely on additional PHP script (for querying Google+ share number).

3. TNW Social Count

TNW Social Count is a WordPress plugin originally developed for The Next Web to fetch share numbers of articles, and display the result as shown in the following screenshot. Thankfully, the developer is generous enough to release the plugin for free, although not all features were included.

Pros

  • WordPress Plugin, very easy to use with the provided GUI and template tag.
  • Support for four major social networks: Facebook, Twitter, Google+ and LinkedIn (may not suffice).
  • Fully customizable with CSS.
  • Option to fetch count number automatically, or by demand.

Cons

  • Works only for WordPress; need a workaround to have it work on Joomla or Drupal.
  • It creates extra fields in the database. So, if your hosting plan has limited resource for the database, this could cause a trouble.
  • At the time of the writing, support is limited to only four social networks mentioned above.

4. Filament Social Count

Social Count is a jQuery plugin developed by Filament Group for displaying the sharing button from Facebook, Twitter and Google+. This plugin shows the buttons efficiently by loading the button individually and only upon user deman; in return, webpages load faster.

Pros

  • Load the button individually on hover.
  • Very small file size, only 2.98KB.
  • Support for touch device.

Cons

  • Only support for Facebook, Twitter and Google+ sharing button.
  • Rely on jQuery. So, despite of the very small size, you need to load an extra 93kb from jQuery.

5. Social Likes

Social Likes is a jQuery plugin to show social buttons with the share numbers. It comes with styles that are similar to the actual ones, as shown in the screenshot below.

Pros

  • Default button styles which look close to the originals.
  • Customizable look through CSS and through GUI.
  • Support for Pinterest and LiveJournal.
  • Easily extensible to add additional social networks.

Cons

  • Similar to Sharrre, It relies on jQuery and also PHP for querying Goolge+ counter.
  • It queries the counter number on page load.

Author:

Thoriq is a writer for hongkiat.com. He is also a web developer with very unpredictable sleep cycle.

Advertisement