Jump to content

Archived

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

Jayman11

HOW TO: Facebook "Like" Button in OSCommerce

Recommended Posts

this worked perfectly with the exception of IE8. is it working for anyone else in IE8? working perfectly in Firefox, Safari, Opera a Chrome.

 

i was able to resolve the issue. it was an code location issue. not sure why it mattered to IE8 but moved it and it's working now in all browsers. thanks for the code!

Share this post


Link to post
Share on other sites

I was using the XFBML code as given on facebook page

 

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="button_count" show_faces="false" width="450"></fb:like>

 

on my product info but then i noticed the problem with the fb_xd_fragment pages (people were landing on my site as

http://www.mysite.com/product_info.php?products_id=945?fb_xd_fragment

 

and i couldnot understand why

 

 

Has the problem with fb_xd_fragment been resolved????

 

** people landing on

http://www.mysite.com/product_info.php?products_id=945?fb_xd_fragment 

get a blank page

Share this post


Link to post
Share on other sites

aaahhh - what a waste!

 

Guys, simply go to your product_info.php file (parent folder) and try adding the following:

 

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo HTTP_SERVER . $_SERVER['REQUEST_URI']; ?>" show_faces="false" align="right" width="350"></fb:like>

 

This will quirey the server for the product URL and in turn use the full url as the link on FB to your site.

The 'like' box within your product page will also use a 1+1+1 etc method, as more people like the product the box will add each.

 

I recommend the code be added in/around that of the product part number section. Looks good and seems to fit well.

 

Dont see any need to change any of the other code, and this has been tested in Win Enviro's - running IE, Firefox as well as Linux OS running Chrome and Firefox, also works on the Galaxy Sgoogle browser!

 

This is great! Are there any disadvantages to doing it this way? For example, with the other methods that require a facebook developer ID are you able to track the number of likes by product or something like that which you perhaps cannot do using this method? This method is really easy and looks great on my products listing.

 

Enjoy!

:thumbsup:

Share this post


Link to post
Share on other sites

i was able to resolve the issue. it was an code location issue. not sure why it mattered to IE8 but moved it and it's working now in all browsers. thanks for the code!

 

 

Can you post where in the code you located the FB code? I am still not able to get it to display in IE8. UPDATED

 

thanks to surfinagain I kept poking around and trying it in different locations to get it to work in IE8. My site is pretty modified, but the code worked well for me when place in these lines

 

 

if (tep_not_null($product_info['products_model'])) {

$products_name = $product_info['products_name'] . '<br><span class="smallText">[' . $product_info['products_id'] . ']</span>';

} else {

$products_name = $product_info['products_name'];

}

?>

<tr>

<td><table border="0" width="100%" cellspacing="0" cellpadding="0">

<tr>

<td class="pageHeading" valign="top"><?php echo $products_name; ?></td>

<td class="pageHeading" align="right" valign="top"><?php echo $products_price; ?></td>

</tr>

 

</table></td>

</tr>

<tr>

<td><?php echo tep_draw_separator('pixel_trans.gif', '100%', '10'); ?></td>

</tr>

<tr>

<td class="main">

 

 

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo HTTP_SERVER . $_SERVER['REQUEST_URI']; ?>" show_faces="false" align="right" width="350"></fb:like>

 

<?php

if (tep_not_null($product_info['products_image'])) {

?>

<table border="0" cellspacing="0" cellpadding="2" align="right">

<tr>

<td align="center" class="smallText">

Share this post


Link to post
Share on other sites

Anyone know how to make a "like" button to product page.

 

I have STS and SEO Header tags installed.

I think it has to mod beacuse the url are not the orginal when I use Header tags.

 

Big thnaks!

Share this post


Link to post
Share on other sites

I am trying to add the likes this button to an infobox but no luck... does anyone know how to do this

Share this post


Link to post
Share on other sites

This partially works for me.....

 

However I have one.. issue...

the image that facebook uses for the link is not of the product? (its using one of the banner links/adverts)

how do i force facebook to use the product image?

 

Cheers

Luke

 

 

Problem solved with correct URL, Big thanks to Sam's contribution "Sam's Remove & Prevent duplicate content with the canonical tag": http://addons.oscommerce.com/info/7163

 

So here are the steps to install the Like button iFrame version:

Add, at the very bottom, before the last ?> in catalog/includes/functions/html_output.php this code:

 

// remove duplicate content with canonical tag by Spooks 12/2009
function CanonicalLink( $xhtml = false , $ssl = 'SSL' ) {
global $request_type;
$rem_index = false; // Set to true to additionally remove index.php from the uri
$close_tag = ( false === $xhtml ? ' >' : ' />' ); $spage = '';
$domain = ( $request_type == 'SSL' && $ssl == 'SSL' ? HTTPS_SERVER : HTTP_SERVER ); // gets the base URI

// Find the file basename safely = PHP_SELF is unreliable - SCRIPT_NAME can show path to phpcgi
if ( array_key_exists( 'SCRIPT_NAME', $_SERVER ) 
		&& ( substr( basename( $_SERVER['SCRIPT_NAME'] ), -4, 4 ) == '.php' ) ) {
		$basefile = basename( $_SERVER['SCRIPT_NAME'] );
} elseif ( array_key_exists( 'PHP_SELF', $_SERVER )
		&& ( substr( basename( $_SERVER['PHP_SELF'] ), -4, 4 ) == '.php' ) ) {
		$basefile = basename( $_SERVER['PHP_SELF'] );
} else {
// No base file so we have to return nothing
return false;
}
// Don't produce canonicals for SSL pages that bots shouldn't see
$ignore_array = array( 'account', 'address', 'checkout', 'login', 'password', 'logoff' );
// partial match to ssl filenames
foreach ( $ignore_array as $value ) {
	$spage .= '(' . $value . ')|';
}
$spage = rtrim($spage,'|');	
if (preg_match("/$spage/", $basefile)) return false;

// REQUEST_URI usually doesn't exist on Windows servers ( sometimes ORIG_PATH_INFO doesn't either )
if ( array_key_exists( 'REQUEST_URI', $_SERVER ) ) {
		$request_uri = $_SERVER['REQUEST_URI'];
} elseif( array_key_exists( 'ORIG_PATH_INFO', $_SERVER ) ) {
		$request_uri = $_SERVER['ORIG_PATH_INFO'];
} else {
// we need to fail here as we have no REQUEST_URI and return no canonical link html
return false;
}	
$remove_array = array( 'currency','language','main_page','page','sort','ref','affiliate_banner_id','max');	
// Add to this array any additional params you need to remove in the same format as the existing

$page_remove_array = array(FILENAME_PRODUCT_INFO => array('manufacturers_id', 'cPath'),
		          FILENAME_DEFAULT	     => array() );

// remove page specific params, should be in same format as previous, given is manufacturers_id & cPath 
// have to be removed in product_info.php only

if (is_array($page_remove_array[$basefile])) $remove_array = array_merge($remove_array, $page_remove_array[$basefile]);

foreach ( $remove_array as $value ) {
		$search[] = '/&*' . $value . '[=\/]+[\w%..\+]*\/?/i';
}
$search[] = ('/&*osCsid.*/'); $search[] = ('/\?\z/');	
if ($rem_index) $search[] = ('/index.php\/*/');	
$request_uri = preg_replace('/\?&/', '?', preg_replace($search, '', $request_uri )); 	

echo $domain . $request_uri . PHP_EOL; // this one I modified
} 
///

 

Place where you want to show Like button in product_info.php this code:

 

<iframe src="http://www.facebook.com/plugins/like.php?href=<?php CanonicalLink( $xhtml = false, 'SSL' ) ?>&layout=standard&show_faces=true&width=450&action=like&colorscheme=light&height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:450px; height:80px;" allowTransparency="true"></iframe>

 

Thats all, works in every browser and browser version

 

:thumbsup:


luke

Share this post


Link to post
Share on other sites

I'm using the following code as instructed here:

Can you post where in the code you located the FB code? I am still not able to get it to display in IE8. UPDATEDthanks to surfinagain I kept poking around and trying it in different locations to get it to work in IE8. My site is pretty modified, but the code worked well for me when place in these lines if (tep_not_null($product_info['products_model'])) { $products_name = $product_info['products_name'] . '<br><span class="smallText">[' . $product_info['products_id'] . ']</span>'; } else { $products_name = $product_info['products_name']; }?> <tr> <td><table border="0" width="100%" cellspacing="0" cellpadding="0"> <tr> <td class="pageHeading" valign="top"><?php echo $products_name; ?></td> <td class="pageHeading" align="right" valign="top"><?php echo $products_price; ?></td> </tr> </table></td> </tr> <tr> <td><?php echo tep_draw_separator('pixel_trans.gif', '100%', '10'); ?></td> </tr> <tr> <td class="main"><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="<?php echo HTTP_SERVER . $_SERVER['REQUEST_URI']; ?>" show_faces="false" align="right" width="350"></fb:like><?php if (tep_not_null($product_info['products_image'])) {?> <table border="0" cellspacing="0" cellpadding="2" align="right"> <tr> <td align="center" class="smallText">

 

Seems to work good, except a similar problem as mentioned here:

This partially works for me.....However I have one.. issue...the image that facebook uses for the link is not of the product? (its using one of the banner links/adverts)how do i force facebook to use the product image?CheersLuke

 

... and another remark is that the text on facebook is also not OK. > The title isn't what I'm expecting and the first part of the text is missing.

 

So, the message isn't good at all. What can we do about that?

 

You can check here...

Share this post


Link to post
Share on other sites

In the meantime I've been trying some things out.

- When trying with the Facebook iframe code my hole page went wrong... but on facebook I saw the correct product picture :blink:

- Searching the net I've seemed to have found a solution, but I don't know how to implement it... Can someone help me out... here is the link

Share this post


Link to post
Share on other sites

Hey JoePyler

looking at your site you seem to have got it working perfectly!

i liked the link and it came up grat on my facbook, complete with the corect image and everthing/.//

AND it works on IE8

 

what is the code exactly that you used?

woul you mind sharing?

 

thanks!

Share this post


Link to post
Share on other sites

I enterd this code in the head section:

<meta property="og:image" content="<?php print 'http://' . $_SERVER['SERVER_NAME'] . DIR_WS_HTTP_CATALOG . DIR_WS_IMAGES . $product_info['products_image']; ?>" />
<meta property="og:title" content="<?php echo $product_info['products_name']; ?>" />
<meta property="og:description" content="<?php echo preg_replace('/[^a-zA-Z0-9\s]/','',preg_replace('/\s+/',' ',preg_replace("/<br>/", "",strip_tags($product_info['products_description'])))); ?>" />

 

And this on the spot were I wished to see the button.

<script src="http://connect.facebook.net/nl_BE/all.js#xfbml=1"></script><fb:like href="<?php echo HTTP_SERVER . $_SERVER['REQUEST_URI']; ?>" show_faces="false" align="right" width="350"></fb:like>

 

:-"

Share this post


Link to post
Share on other sites

thanks doesnt seem to work for me

everything except the image is working

its weird cause when i look in the source of the page it shows the correct URL for the image

but it isnt including a pic in the info on facebook wall

 

do you find it works dometimes and not others

just looked at the code then and it isnt referencing the right inof

but i swear it was just before

its like the facebook side of things only works somtimes and not others...

 

as in the issue is with facebook

dont know

 

hmmm

Share this post


Link to post
Share on other sites

I all

Sorry my english

 

JoPyler

 

The metatags dont return the right code

I just get this:

 

<meta property="og:image" content="http://www.mysite.com/images/" />
<meta property="og:title" content="" />
<meta property="og:description" content="" />

 

I try to put the metatags in every here in the header of the product_info.php

Im using tge v2.2 RC2a

 

:|

 

any ideia ?

Share this post


Link to post
Share on other sites

I all

Sorry my english

 

JoPyler

 

The metatags dont return the right code

I just get this:

 

<meta property="og:image" content="http://www.mysite.com/images/" />
<meta property="og:title" content="" />
<meta property="og:description" content="" />

 

I try to put the metatags in every here in the header of the product_info.php

Im using tge v2.2 RC2a

 

:|

 

any ideia ?

i see your site and in your case the metatags return the right code:

example :

<meta property="og:image" content="http://shop.kitty.be/images/ZIGO-1CPDX2G.JPG" />
<meta property="og:title" content="Zigo - Childpod X2 oranje                                       " />
<meta property="og:description" content="X2 Zigo Childpod 1 of 2 kinderen extra " />

Share this post


Link to post
Share on other sites

I all

Sorry my english

 

JoPyler

 

The metatags dont return the right code

I just get this:

 

<meta property="og:image" content="http://www.mysite.com/images/" />
<meta property="og:title" content="" />
<meta property="og:description" content="" />

 

I try to put the metatags in every here in the header of the product_info.php

Im using tge v2.2 RC2a

 

:|

 

any ideia ?

i see your site and in your case the metatags return the right code:

example :

<meta property="og:image" content="http://shop.kitty.be/images/ZIGO-1CPDX2G.JPG" />
<meta property="og:title" content="Zigo - Childpod X2 oranje                                       " />
<meta property="og:description" content="X2 Zigo Childpod 1 of 2 kinderen extra " />

Share this post


Link to post
Share on other sites

A bigger concern looms.

 

Visit the link below:

 

How to Secure Your Site

 

Pay close attention to "SECURING THE ADMIN" - Yours is vulnerable.

 

It's easier to do a few security fixes now than to clean up a hacked store later.

 

And if you don't secure the admin your shop will be hacked.

 

It's just a question of when...

:o


If I suggest you edit any file(s) make a backup first - I'm not perfect and neither are you.

 

"Given enough impetus a parallelogramatically shaped projectile can egress a circular orifice."

- Me -

 

"Headers already sent" - The definitive help

 

"Cannot redeclare ..." - How to find/fix it

 

SSL Implementation Help

 

Like this post? "Like" it again over there >

Share this post


Link to post
Share on other sites

A bigger concern looms.

 

Visit the link below:

 

How to Secure Your Site

 

Pay close attention to "SECURING THE ADMIN" - Yours is vulnerable.

 

It's easier to do a few security fixes now than to clean up a hacked store later.

 

And if you don't secure the admin your shop will be hacked.

 

It's just a question of when...

:o

 

Tks

Share this post


Link to post
Share on other sites

Just try to put the "head code" right under the "Title" tag.

 

 

Like i say before, anywere i put in the header is the same thing :|

Now is the place were you say

And to put under the title tag i have to put the "meta head code" in the header_includes.php because the title tag comes from there

 

:(

Share this post


Link to post
Share on other sites

Like i say before, anywere i put in the header is the same thing :|

Now is the place were you say

And to put under the title tag i have to put the "meta head code" in the header_includes.php because the title tag comes from there

 

:(

I'm not a specialist, but I would try to put this line

<link rel="shortcut icon" type="image/x-icon" href="http://www.safarisurfshop.com/icon.ico" />

after the 'property' lines.

Share this post


Link to post
Share on other sites

I'm not a specialist, but I would try to put this line

<link rel="shortcut icon" type="image/x-icon" href="http://www.safarisurfshop.com/icon.ico" />

after the 'property' lines.

 

No :(

Nothing about that

 

My head just dont read dose lines:

 

$product_info['products_image'];

 

And

 

<?php echo $product_info['products_name']; ?>

 

Any help?

Share this post


Link to post
Share on other sites

×