How to Add Facebook Like to Your Ecommerce Site

Facebook is building another ‘index’ of the Web, based on people’s likes and preferences. We show you how to put the Facebook Like Button on your small business ecommerce website.

As of April 2010, ComScore stats indicated that Facebook is closing in on 500 million monthly unique visitors. For anyone doing business online, Facebook traffic numbers is a very big deal.

Often, small business ecommerce site owners get trapped in the endless quest to reach Google's search audience that they overlook the importance of tapping in to other online audiences -- including Facebook.

Earlier this year Facebook launched new tools, called Social Plugins that website publishers could easily add to bring the Facebook social experience to any website. These social plugins are part of a larger Facebook goal to make every website on the Internet sharable across its network; something the company calls the Open Graph.

Facebook Like: Why Ecommerce Sites Should Have It

Facebook Like is one of the social plugins offered by Facebook that lets people share your content with their friends.  When you add the Facebook Like button to your own small business ecommerce website anyone who clicks it will have a story appear in their News Feed with a link back to your website.

“Facebook is building another index of the Web,” said Charles Nicholls, Founder and Chief Strategy Officer of SeeWhy. “Only this index it isn’t based on Google’s arbitrary algorithms, it is built based upon people’s likes and preferences.”

Facebook Line; ecommerce marketing
Facebook Like for your small business ecommerce website is a no-brainer. Use the configuration tool to select options and simply copy and paste the resulting code to your website.
(Click for larger image)

When it comes to having Facebook Like on your ecommerce website, Nicholls says this is really a bit of a no brainer because it is a single line of code that you add to point Facebook users to your ecommerce site. By adding Facebook like to your own website, you encourage Facebook visitors to share your site and link back to you in their social network profile, in turn exposing your site to their friends.

Add Facebook Like to Your Ecommerce Site

Understanding how the Like Button works on the Web is pretty easy. Once you have the social plugin added to your website, Facebook users can click that Like Button your page and news of this activity and is added to their own public activity stream.  All of their Facebook friends will see their friend has "Liked" your page, and they can also click the activity and be taken directly to your page.

The good news for ecommerce site owners is that Facebook Like is easy to put on your website.  It's a simple matter of getting a line of code and deciding where on your webpage you want to display the Like button.  Nicholls recommends that you should include Facebook Like on your homepage and also on your individual product pages.

To get started you'll want to visit the Like Button Social Plugin Page on the Facebook Developers website.

Facebook offers two Like Button implementations:  XFBML and Iframe. The XFBML version is more versatile, but requires the JavaScript SDK.  For people with less technical and website design know-how, the Iframe version is much simpler to add to your own ecommerce website.

The Facebook Developer’s Page offers a Web-based configuration tool to help you get the code required to add to your website.  When you use the configuration tool you simply choose your options for the following design attributes:

  • URL:  Enter the URL you want the Like action to be connected to (e.g. your website URL). If you use the XFBML version, the code will default to the current page
  • Layout Style: Choose Standard or Button Count.  Standard will display text to the right of the Like Button and profile pictures below the button. Button Count will display how many people clicked the Like button in small text beside the button
  • Show Faces: If you choose the Standard layout, you can also check Show faces to display profile photos below the Like Button
  • Width: The width, in pixels, you want the plugin to display on your website
  • Verb:  Choose "Like" or "Recommend". This is the text that appears with the button
  • Font: The font used in the plugin for text display
  • Color Scheme: Choose a light or dark scheme. This is the color of the button displayed on your website

Then, you will click the "Get Code" button on the configuration tool and a pop-up window will display the XFBML and Iframe code you will choose to copy and paste to your own website.

Using Open Graph Metatags

As mentioned earlier, the Facebook Like Button is a part of Facebook’s Open Graph initiative. While this next step is completely optional, if you are going to implement the Facebook Like feature on your website, you should add Open Graph metatags to your webpage. 

Adding the Facebook Open Graph meta tags to your webpage, tells Facebook who you are so that your link will show up in the correct places on a users' Facebook profile, outside of their activity stream.  If for example, a person likes a movie in your Web shop that has been tagged for Open Graph, your public website will be listed in that user’s favorite movies link in their Facebook profile.  It is a little code for a lot of exposure and links on Facebook.

Depending on the data you provide using the Open Graph protocol, your pages show up in different places in Facebook, such as in user profiles, in search results and in people’s News Feed. The Open Graph protocol specifies four tags that are required with additional optional optional tags you can also use:

  • og:title -- The title of your object as it should appear within the graph, e.g., "The Rock"
  • og:type -- The type of your object, e.g., "movie." See the complete list of supported types
  • og:image -- An image URL which should represent your object within the graph. The image must be at least 50 pixels by 50 pixels and have a maximum aspect ratio of 3:1
  • og:url -- The canonical URL of your object that will be used as its permanent ID in the graph

These four tags, along with examples and an explanation of additional tags you can use are listed on the Open Graph Protocol page on the Facebook Developers site. 

There is More to Like than Just Facebook Like

The biggest problem for most small ecommerce site owners is not getting plugins such as Facebook Like on their website, but managing the social plugins. At times it may feel like you are managing two websites: your ecommerce site and Facebook.

When you look at what Facebook is becoming in terms of a referrer, most everyone sees it climbing their Web analytics, gradually and becoming more and more important. For this reason, ecommerce websites especially should look at adding the Facebook Social Plugins to their website.

In addition to Facebook Like, which Nicholls recommends ecommerce site owners add first, there are two more social plugins that should be considered. One is Facebook Recommendations and the other is Facebook Login.

Facebook Recommendations  is a simple iframe you can drop into your page, or as with using Facebook Like, when you use the XFBML version you can have more control and options. The XFBML version of Facebook Recommendations basically pulls together the top recommendations from your site that Facebook has found.

This social plugin lets you show personalized recommendations to users. In generating the recommendations the plugin considers all the social interactions with URLs from your site. Since the content is hosted by Facebook, the plugin can display personalized recommendations even if the user has not logged into your ecommerce website but is logged in to Facebook. It also provides you with a personal mini-index of what people like on your site.

The other social plugin that Nicholls recommends small business ecommerce site owners use is Facebook Login.  With login enabled, anyone can login in on your ecommerce website with his Facebook credentials -- allowing you to capture his information from Facebook.

With that captured information you can later market to this Facebook user with email and social media marketing -- and ecommerce remarketing-- tactics to help drive conversions and ultimately acquire new customers and increase sales.

While Login is also important, it takes more time to implement and requires use of the Facebook API.  Instructions on how to use this Social Plugin can be found on the Facebook for Websites Developer Page.

Nicholls recommends that ecommerce site owners start by adding the Facebook Like Button first, and then integrate Facebook Recommendations followed by Facebook Login.  He said that while Recommendations requires more of your website real estate and Login requires some development knowledge for using the API, he believes the benefits to small business ecommerce site owners are worth the effort to go beyond Facebook Like.

Vangie Beal is a veteran online seller and frequent contributor to She is also managing editor of You can tweet with her online @AuroraGG.

Do you have a comment or question about this article or other e-commerce topics in general? Speak out in the E-Commerce Forum. Join the discussion today!

Comment and Contribute
* Required Field
Your email address will not be published

Note: No advertising, no spam, no keyword in name/nickname field. Thank you!

Free Resources

Subscribe To Our Daily Newsletter