Facebook Like Button – Types, How to Add

We get asked rather often “How does Facebook ‘like’ button work/what is it all about?” And once we explain, we usually get the next question straight away: “How quickly can I get it on my website?”. So we decided to write a simple explanation of the “what’s” and “how’s” of Facebook Like buttons for your reference.

If you find this page useful, don’t forget to use our buttons on top of this page! :) You can also check our guides to other buttons: Twitter Tweet This and Google +1 button.)

Do I Need a Facebook Account?

The simple answer is: no. You don’t need to have a Facebook account, nor a Facebook page for your business etc. To be perfectly honest, you don’t need to know anything about Facebook and Social Marketing to reap the benefits of this powerful yet absolutely free marketing tool.

Benefits of Facebook Like Button on Your Website

There are several important reasons why you should consider adding a Facebook Like button to your website.

  • Facebook Like Button is FREE..

How much does Facebook charge for using its Facebook Like button? Nothing! Yes, a free advertising tool that relies on personal referrals and recommendations (and we all know the value of those!) to spread the word about your website.

  • ..While Being a Very Powerful Viral Marketing Tool!

If you add Facebook Like button to your website it gains a chance to go “viral”. If your website’s visitors are Facebook users, when they click on your “Like” button it counts as a “vote” for your website. If they have a popular Facebook profile, it will also show on their timeline. So what they are actually doing is personally “recommending” your website to their friends, who then can recommend it to other friends, etc.

This can be a great way to penetrate your niche or reach completely new market segments – all with minimum effort! Having your customers spread the word (in a low commitment way for them) can build amazing results for you.

  • Visitors Recognise & Use the Facebook Like Button

The Facebook brand is so recognisable that it can evoke feelings of trust and familiarity. Having a connection to Social Media sites and communities on your website can make your site look and feel not only “in touch”, but also “friendly” and trustworthy in the eyes of Facebook users. This can increase your credibility.

  • Add Facebook Like Button – Join Trends of the Future

In a broader sense there is also talk of a grand shift as Facebook is having its sights on challenging Google as the internet’s number one search engine. Of course this revolution will not happen overnight. But, with the enviable Facebook statistics (as of July 2011), once can understand why it is worth getting in on the trend:

  • More than 750 million active users
  • 50% of active users log on to Facebook in any given day
  • Average user has 130 friends
  • People spend over 700 billion minutes per month on Facebook
  • There are over 900 million objects that people interact with (pages, groups, events and community pages)
  • Average user is connected to 80 community pages, groups and event
  • More than 30 billion pieces of content (web links, news stories, blog posts, notes, photo albums, etc.) are shared each month.

Now that you know what is at stake, contact us and we will be happy to add the Facebook Like button to your website today! Not convinced yet? Read on for more info..

Power of Google and Facebook – Combined!

SEO (Search Engine Optimisation), aimed at improving Google’s perception of your website, is now considered a prerequisite to getting your website “found” by new, potential customers browsing the internet. But, equally, the power of “word-of-mouth” (click?) advertising should definitely not be underestimated either.

Obviously, Google wants to stand its ground and has recently launched “Google +1 button”. It works slightly different to the Facebook button. When added to a website and used by visitors, its most prominent advantage is the ability to directly influence Google search rankings for your website (!). Read more about and how to add Google +1 button.

Types of Facebook Like Button

There are two types of Facebook Like buttons generally used:

  • one appearing on Facebook pages (e.g. on your company’s Facebook page – if you had one created)
  • on sites/pages outside of Facebook.

The first type of Like button is one you can click after looking at almost any content on Facebook (e.g. a friend’s photo, a comment a friend has made, an application you liked or a group/company page you are interested in, etc.).  The fact that you have “liked” these things is then reported in your friends’ news feeds. Also, if you “liked” a page on Facebook for a product, community, etc. then that page could send you updates, which will appear in your newsfeed.

The second is the discussed “functional” button, which extends the functionality outlined above to pages external to Facebook itself.

How Does it Work on YOUR Website?

This is where the magic kicks in! When you get the Facebook Like button added to your page(s), your visitors can “like” your website and add it to their Facebook profiles (as explained above) without leaving your site.

The button itself usually looks like this:

Facebook Like button

(Left is the i-frame version, right is the JavaScript version. We will explain the difference a bit later.)

After a visitor “Likes” your website a Facebook login pop-up will appear if they are not logged in to Facebook (or a sign-up box – if they are not a Facebook member yet).  Once logged in, they will see the button showing their friends who also “liked” your page (this can be set to show their friends’ profile pictures – as on the image above right). All the while, a story will be posted automatically to their Facebook page telling their friends that they like your site!

Additional set up of the Like button’s coding allows for automatic posts to be placed also on other parts of the Facebook user’s profile by using “tags”.  For example: someone is looking at a webpage about their favourite book and click on the Facebook Like button. That book can then be added to that person’s profile under “interests”. There are many categories that can be tagged.

How to Add Facebook Like button? (a bit more tech)

i-frame Facebook Like button (rather simple)

This is where it gets slightly more complicated – but only slightly. From a coding perspective, there are two kinds of Facebook Like buttons that can be added to your website. The simple one is known as “i-frame”. It gives users less information about who, specifically, likes your webpage (i.e. users won’t see their friends’ profile pictures pop-up and the button is far less customisable).

JavaScript Facebook Like button (a bit more complex)

The second option is “JavaScript button”.  It is harder to add but allows users to see their friends’ names and profile pictures, which can make a huge difference in terms of emotional connection and trust building. The JavaScript button also allows the user to write a comment about your page that will be shown to their friends. And positive comments like that can be worth their weight in gold! (i-frame just shows a link to the “liked” page.)

Add Facebook Like Button – DIY

It takes a bit of programming experience and know-how, but you can have a go at adding Facebook Like button to your website yourself. Visit Facebook Developers for help on adding the button to your site. A bit of web design background and you can have it on your website up and running in around an hour.

However, if you are interested in using the JavaScript option to really take advantage of the power this button can unleash (or if web programming isn’t something you are familiar with) contact us now for help with setting up your Facebook like button exactly the way you want it!

The Technical Part (for Tech-Junkies & Inquisitive Souls)

For those of you who like to know the inner-workings of the elements that help your websites perform better:

The button actually allows Facebook to track all visitors of your website, no matter if they click on it or not (as long as they are Facebook users.. but who isn’t?:). This is because the i-frame is a bit like an embedded browser window on a webpage (a page within a page)!

This is the colossal difference between using an i-frame and a simple icon image for the button – the first actually contains a complete Facebook page. There is not much on that page though – it only consists of the button and information about how many people have “liked” the page that contains the i-farme. Click here to see what a Like button page looks like (opens in a new window).

So when you see a Like button on a page, you are actually visiting a Facebook page at the same time. (Note: this is not a Facebook Fan page). This allows Facebook to read the cookie on your computer which it created last time you logged into Facebook (it contains your Facebook user-id).

Now, a fundamental security rule in all browsers is that only a website that had created a cookie can read it later on. And that is the advantage of the i-frame: it reads the cookie on your computer and allows Facebook to recognise you even when you are visiting a different website.

There is an easy way to avoid being tracked by Facebook on other sites though. Although the cookie can remain on your computer for a few months (even when you didn’t check the “keep me logged in” box), you just need to logout of Facebook (as it deletes the cookie) before visiting any other sites to stop the tracking.

Want to add Facebook Like button to your website? Contact us via email or call 01753 878 435 today!

Comments are closed.