How to Add the Facebook “Like” Button for TomatoCart

Written by Kemin Bao Saturday, 9 July 2011

There are currently more than 500 million active users spending over 700 billion minutes per month on Facebook, according to Facebook’s own data.

To convert those users into customers, you can add a “Like” button with Facebook’s API.

It only takes a few minutes to tap into the Facebook community.

Step 1. Update Your Template’s Metadata

Firstly, you will want to include several lines of metadata in your page template.

Using a file manager tool in TomatoCart, you can easily add code. In the admin panel, go to Start->Tools->File Manager. On the left hand side, select the file you want to edit. To add metadata, we select templates/glass_gray/index.php

Click the edit button and add the code after the <head> tag:

<meta property="og:title" content="<?php echo $osC_Template->getMetaPageTitle(); ?>" /> <!-- this code retrieves the post title-->
<meta property="og:site_name" content="<?php echo STORE_NAME; ?>"/><!-- yout sotre name-->

For the more information about meta tag, click here.

 

Step 2. Add the “Like” Button

There are two Like button implementations: XFBML and Iframe. The XFBML version is more versatile, but requires use of the JavaScript SDK. It is best to use the XFBML approach. To add the button to a product’s info page, you need to edit the  templates/glass_gray/content.products/info.php  file:

Add the code:

<tr>
<td colspan="2">
<fb:like href="" layout="standard" show_faces="true" width="270" action="like" font="segoe ui" colorscheme="light" />
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml  : true  // parse XFBML
});
</script>
</td>
</tr>

After:

<tr>
<td colspan="2">
<p><?php echo $osC_Product->getShortDescription(); ?></p>
</td>
</tr>

You can generate this code here.

That is all! The “Like” button has been added to your product info page!

Looking for quality TomatoCart Hosting? Look no further than Arvixe Web Hosting.

Tags: , , , , , , , ,

This entry was posted on Saturday, July 9th, 2011 at 12:10 pm and is filed under cPanel/Linux Hosting, TomatoCart. You can follow any responses to this entry through the RSS 2.0 feed. You can skip to the end and leave a response. Pinging is currently not allowed.

8 Comments

  1. John   |  Tuesday, 12 July 2011 at 6:46 pm

    Using the code provided, I am having an issue with it generating the meta page title and store name. The button itself works great, and post to FB….just not getting the meta info with it. Any suggestions?

  2. Kemin Bao   |  Friday, 15 July 2011 at 6:46 am

    Hi John,
    sorry for late reply,
    i checked the code and found the problem. There are some errors with the meta code.
    You can try the below code again.

  3. Annette   |  Tuesday, 29 November 2011 at 8:15 pm

    i have an issue it shows in every browser bar ie

  4. Mike Hoffman   |  Wednesday, 30 November 2011 at 4:13 pm

    It shows in every browser bar? Can you elaborate please?

  5. Kyoichi   |  Sunday, 04 December 2011 at 7:07 am

    anyway to remove “Be the first of your friends to like this”

  6. Jarik Oosting   |  Monday, 02 January 2012 at 11:24 am

    @Kyoichi: Change layout=”standard” in layout=”button_count” or layout=”box_count”

  7. allsaints   |  Monday, 16 January 2012 at 12:35 pm

    My spouse and I stumbled over here by a different page and thought I may as well check things out. I like what I see so now i am following you. Look forward to looking into your web page for a second time.

  8. kiko   |  Sunday, 11 March 2012 at 5:32 pm

    It is true that the button “like” appears but when I click the page bouttom fb is “TomatoCart” but I want her to be the society page of the site. Please help me this is urgent.

Leave a Reply






5 − four =