Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

HOW TO: Facebook "Like" Button in OSCommerce


Jayman11

Recommended Posts

This was cake after doing a little research online. Adding the "Like" button to your oscommerce site is simple using their java version instead of that iframe stuff.

 

Here you go:

Step 1: Get yourself an Application ID from here.

 

Step 2: Add this code to your header, footer, or wherever you want the like button to show, put it as the first line above the <?php :

 

<fb:like
     href="<?php echo HTTP_SERVER . $_SERVER['REQUEST_URI']; ?>"
     layout="standard"
     show_faces="true"
     width="<?php echo BOX_WIDTH-30; ?>"
     action="like"
     font="trebuchet ms"
     colorscheme="light"></fb:like> 

 

Step 3: Add this code to the bottom of either /includes/footer.php (pre rc3) or includes/template_bottom.php (rc3), making sure to substitute "your app id" with your actual app id:

 

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
 FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
 FB.Event.subscribe('auth.sessionChange', function(response) {
   if (response.session) {
     // A user has logged in, and a new cookie has been saved
   } else {
     // The user has logged out, and the cookie has been cleared
   }
 });
</script> 

 

And that is it! I put the button in my column_right.php and changed the button style from "standard" to "button_count" so that it didn't have all the wording that seemed to stretch the site out funny on certain screen resolutions.

 

Oh yeah, the only thing I couldn't figure out was how to get the button to center in the column_right.php. If anyone knows let me know. I think I'm just having a brain fart from being so excited over this working! LOL

 

Thanks to Gary for this code on Club osCommerce!!

Link to comment
Share on other sites

  • Replies 80
  • Created
  • Last Reply

ok found an issue.....for some reason it won't show the button in IE but works fine in every other browser. What am I missing here???? Anyone?? This is driving me nuts! LOL

I know IE is such a pain!

 

I had to change this on many of my files....

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

It helped with a code I was using in my footer.php file

Try adding that code to one of your pages.... ie. conditions.php.... just to test first.

Find

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">

Replace with

<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Hope that helps.

Also.. can you provide a pick or link to check out your work?

 

Edit: Oh.. also had to change this in the files as well... that code change the way description and text was displayed in IE... it centered everything.

So.. I had to change the following as well.

Again... try in condition.php file first.

Find

<td class="main">

Replace with

<td class="main" align="left">

That "Can" you're about to open... has worms!

Don't say I didn't worn ya.

n. pl. cans of worms Informal - A source of unforeseen and troublesome complexity.

Link to comment
Share on other sites

This was cake after doing a little research online. Adding the "Like" button to your oscommerce site is simple using their java version instead of that iframe stuff.

 

Here you go:

Step 1: Get yourself an Application ID from here.

 

Step 2: Add this code to your header, footer, or wherever you want the like button to show, put it as the first line above the <?php :

 

<fb:like
     href="<?php echo HTTP_SERVER . $_SERVER['REQUEST_URI']; ?>"
     layout="standard"
     show_faces="true"
     width="<?php echo BOX_WIDTH-30; ?>"
     action="like"
     font="trebuchet ms"
     colorscheme="light"></fb:like> 

 

Step 3: Add this code to the bottom of either /includes/footer.php (pre rc3) or includes/template_bottom.php (rc3), making sure to substitute "your app id" with your actual app id:

 

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
 FB.init({appId: 'your app id', status: true, cookie: true, xfbml: true});
 FB.Event.subscribe('auth.sessionChange', function(response) {
   if (response.session) {
     // A user has logged in, and a new cookie has been saved
   } else {
     // The user has logged out, and the cookie has been cleared
   }
 });
</script> 

 

And that is it! I put the button in my column_right.php and changed the button style from "standard" to "button_count" so that it didn't have all the wording that seemed to stretch the site out funny on certain screen resolutions.

 

Oh yeah, the only thing I couldn't figure out was how to get the button to center in the column_right.php. If anyone knows let me know. I think I'm just having a brain fart from being so excited over this working! LOL

 

Thanks to Gary for this code on Club osCommerce!!

 

First thank you very much, by sharing with us your project, i was looking for this for awhile, can't wait to try this...

 

You are doing awesome, if possible this should be made as a contribution aswell, many many congratulations

Link to comment
Share on other sites

Hi,

If i have KissMT & Canonical Headers, USU 5, do i still need the Header Tags? (i have social bookmarks addon also) all are working, except that when adding to socials images aren't going through... all the rest works very well (i.e description tags, and title tags that are automatically generated).

 

I'm pleased with those, but what would Header Tags do, and does it complement/substitute the former.

 

I would like my meta tags all automatically generated with no duplicates, which KissMT can acomplish.

 

Thanks in advance

Francys

Link to comment
Share on other sites

You can kill 11 birds with one stone by installing the Header Tags SEO. It includes page title tags plus 10 social networking bookmarks on every page.

 

But, that is just one option...

 

Thanks, my idea was to just have the facebook, the rest to me are just a waste. If I can get this to work in IE properly I will be satisfied. By putting it in the column_right.php above my shopping cart it is right in between login and shopping cart which is center of where just about everyone looks anyway. Plus having it in that one file should save the energy of having to add it to individual pages since that column is always shown. I really hate IE! Google - fine, Firefox - fine, opera - fine, IE - no worky. LOL

Link to comment
Share on other sites

Where do you think best place to put this piece of code is?

 

I'm using STS and template, and I have put this in my template.

You could try in your catalog/index.php

Fire up your site and click View Source. It should be in the top after <!doctype.....

Link to comment
Share on other sites

I'm using STS and template, and I have put this in my template.

You could try in your catalog/index.php

Fire up your site and click View Source. It should be in the top after <!doctype.....

 

Hmmm tried that manually with not luck in my index which I thought would do it too. Where do you have your "like" button located on your site?

Link to comment
Share on other sites

Hmmm tried that manually with not luck in my index which I thought would do it too. Where do you have your "like" button located on your site?

 

I have it in catalog/product_info.php

Do you have a link to your site?

Link to comment
Share on other sites

interesting, adding those codes you guys suggested doesnt make it work but it does do something different, it makes IE give an error code to me regarding an unrecognized character.

Link to comment
Share on other sites

Change this in your index.php :

<html dir="LTR" lang="en">

 

with this:

<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">

 

If I wanted to put the Like button in a column instead of just on the main page (index.php), do you know what edit needs to be made for the button to show up in IE? I'm having the same issue where it's working in Firefox but as usual IE causes problems...

Link to comment
Share on other sites

Can we add this to just one column (let's say information box) instead into each and every product?

 

Or, a facebook box within index.php, to show up once every time you return to the home site...

My idea is that people like the "store", not just a specific product.

Link to comment
Share on other sites

Can we add this to just one column (let's say information box) instead into each and every product?

 

Or, a facebook box within index.php, to show up once every time you return to the home site...

My idea is that people like the "store", not just a specific product.

 

Not sure on that, I know you can do it by using the addthis button, which what I have switched to until I figure out some code issues. It works great with addhtis right now in IE and other browsers. I have it in my column_right and when someone clicks like which on the index/front page then it likes that, if they are on a product page and hit it, it likes that product and registers each like individually each time so works how it should basically.

Link to comment
Share on other sites

Thank yoou very much :thumbsup:

 

i wouldn't use addthis button in a oscommerce shop, since it's a third party application and some information can be collected by them.

 

i think the best is to use like they have these forums.

Link to comment
Share on other sites

  • 3 weeks later...

Hello,

 

is it possible to add this on each product description site ? (product_info.php)

 

Can anyone explain me what i need to do if i want that ?

 

Which codes need to be added ? and where.. ?

 

Thanks.

Link to comment
Share on other sites

  • 1 month later...

hi there,

 

to prevent session ids in the links posted on facebook just add the following line to the spiders.txt

 

facebookexternalhit

 

greetz

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...