Facebook Like Button

delia:

No, the metatags.php is already there. This is a change so belongs in the override folder.

The added code for html header is required by facebook and the the editor may not like the php code inthe middle of it.

By the way, the template file is named correctly in the contribution; I was just calling it the wrong thing here in this thread..

Thank you for the updates and answering my questions Delia, however, the file is named correctly but the mod instructions do refer to tpl_product_info.php instead of tpl_product_info_display.php
Not a biggy for me but might be for someone new to ZC mod installs.

Thanks again,
Stephen

ah, thanks. I'll make that correction.

To those having error with the facebook like button it appears that <meta property="og:type" content="product"/> is the cause of the problem. Temporarily commenting out or removing that meta tag solves the problem. Not exactly sure what's going on with Facebook.

I also noticed that after removing that line, I no longer have access to the admin page when a page is liked. Since the error message is actually related to not been able to connect to Facebook to create the page (when og:type is enabled) it will make some sense to think that's the reason the admin page doesn't exist.

Hopefully, Facebook will solve this issue soon.

Hello, I have used this http://www.numinix.com/blog/2010/06/14/how-to-add-a-facebook-like-button-to-your-zen-cart-product-pages/ and this seems to work quite well.
Maybe someone else would like to give it a try?

Hi. I'm trying to get this to work. I have updated the 3 files like the readme.txt sais, but the like-button does not even show up on the products page.. what to do? :S

It seems like its trying to add a button because the products image moves a bit down when adding the code in products_info_display. But no like button is visible.

ekele:

Hello, I have used this http://www.numinix.com/blog/2010/06/14/how-to-add-a-facebook-like-button-to-your-zen-cart-product-pages/ and this seems to work quite well.
Maybe someone else would like to give it a try?

Ive also used the Numinix add on and it works great!!

But how can I get users who "Like" it to also share it on their profile???

jabbawest:

Excuse me for not including this in one of my previous posts but, how can I edit the look of the widget?
As you can see, or cannot see, the "Be the first of your friends to like this." is lost on my black template.

Thanks so much for this cool addition and I hope the bugs get worked out of it.

Has anybody answered this??:huh:

For the share options I used this add on works great!:clap:

http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=1705

panservolvo:

Hi. I'm trying to get this to work. I have updated the 3 files like the readme.txt sais, but the like-button does not even show up on the products page.. what to do? :S

Do you have a site where we can take a look to see what your code is doing?

BlessIsaacola:

Do you have a site where we can take a look to see what your code is doing?

Sorry, I dont. The site is down at the moment, but I know for sure that the meta tags are working as they should but for some strange reason the buttons are not showing up. When using other codes than this one, they are showing so something is not right. I got the like-button to work like it should using iframe, so there is something strange about the other method.

panservolvo:

Sorry, I dont. The site is down at the moment, but I know for sure that the meta tags are working as they should but for some strange reason the buttons are not showing up. When using other codes than this one, they are showing so something is not right. I got the like-button to work like it should using iframe, so there is something strange about the other method.

Well, it's working on other sites I have taken a look at and it's working on our site as well. Without a site, there's really not much to look at or decode.

You can post the code you're using in your html_header and template file here

BlessIsaacola:

Well, it's working on other sites I have taken a look at and it's working on our site as well. Without a site, there's really not much to look at or decode.

You can post the code you're using in your html_header and template file here

Ok, lets give it a try :) html-header:

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

<meta property="og:title" content="<?php echo META_TAG_FBTITLE; ?>"/>
<meta property="og:site_name" content="<?php echo TITLE; ?>"/>
<meta property="og:image" content="<?php echo META_TAG_FBIMG; ?>"/>
<meta property="og:url" content="<?php echo $canonicalLink; ?>"/>
<meta property="fb:admins" content="XXXX"/>
<meta property="og:type" content="product"/>

Replaced adminid. Not sure if its smart to post it here? Anyways I am 100% sure that its correct.

And heres my tpl_products_info_display:

<!-- bof Facebook Like Button -->
    <p><fb:like></fb:like></p>

    <div id="fb-root"></div>
    <script>
      window.fbAsyncInit = function() {
        FB.init({appId: '161270263913707', status: true, cookie: true,
                 xfbml: true});
		FB.Event.subscribe('edge.create', function(href, widget) {
// Do something, e.g. track the click on the "Like" button here
});
      };
      (function() {
        var e = document.createElement('script');
        e.type = 'text/javascript';
        e.src = document.location.protocol +
          '//connect.facebook.net/en_US/all.js';
        e.async = true;
        document.getElementById('fb-root').appendChild(e);
      }());
    </script>
<!-- eof Facebook Like Button -->

Hope this info might be helpful!

That looks correct. Let us know when your site is back up so We can look at it.

aozhaverm, jabbawest

As far as changing the display, it might well not be possible. Facebook puts its own css on these things. Try putting the code into a division with a css class with a color of white and see what happens.

Great little add-on.

Please accept my apologies if this has been raised but I cannot see it.

The add-on works except one thing.. The correct image is not carried over to Facebook, currently the 'Tell your friends' image is added instead. I have checked and double checked the code added to the files but I am obviously missing something, does anybody have any clues?

Site in question is http://www.foreverbelle.co.uk/

Thanks in advance

Sean

seanruk:

Great little add-on.

Please accept my apologies if this has been raised but I cannot see it.

The add-on works except one thing.. The correct image is not carried over to Facebook, currently the 'Tell your friends' image is added instead. I have checked and double checked the code added to the files but I am obviously missing something, does anybody have any clues?

Site in question is http://www.foreverbelle.co.uk/

Thanks in advance

Sean

Your installation is incomplete. I visited your website and you're missing some of the required meta tag and one of them is the image meta tag.

Thank you for the reply, I had also noticed this and since added the meta tag but I still get an incorrect image displayed in Facebook

Here is the meta tag info as seen in the source:

seanruk:

Thank you for the reply, I had also noticed this and since added the meta tag but I still get an incorrect image displayed in Facebook

Here is the meta tag info as seen in the source:

<meta property="og:title" content="Silver Love Bling Double Ring"/> <meta property="og:site_name" content="Forever Belle"/> <meta property="og:image" content="http://www.foreverbelle.co.uk/images/love double ring.jpg"/> <meta property="og:url" content="http://www.foreverbelle.co.uk/silver-love-bling-double-ring-p-47.html"/> <meta property="fb:admins" content="174717399208075"/> <meta property="og:type" content="product"/>

You're using an app id that's not validated. Check this out:

http://developers.facebook.com/tools/lint/?url=http%3A%2F%2Fwww.foreverbelle.co.uk%2Fblack-and-silver-necklace-p-78.html

If that doesn't work just paste any url from your site into the linter:
http://developers.facebook.com/tools/lint/

Excellent, thanks for the info, I will start there :)

Hi

I found the problem...

I had to change
<meta property="fb:admins" content="174717399208075"/>

to
<meta property="fb:admins" content="entered email address"/>

This still gives an error when using the developer tool but the add-on works.

Cheers