2

Disclaimer: I am woefully behind the times when it comes to social/Facebook integrations. i.e. I don't know what I don't know, so my apologies if this is a simple obvious thing.

I've installed the Facebook Connect and Like Free extension from Magento connect. With this extension enabled, I can see the following HTML code on the catalog_product_view page.

<fb:like href="http://magento-1-9-0-0.dev/test/test-product.html" layout="standart" show_faces="false" width="450"  colorscheme="light"></fb:like>

However — no Facebook like button is rendered on my page. I've placed some Start and End debugging around the section of PHP which renders this

<?php if($this->helper('facebookfree/active')->isActiveLike()):?>
Start
<fb:like href="<?php echo $this->helper('core/url')->getCurrentUrl()?>" layout="<?php echo $this->helper('facebookfree/active')->getLikeLayout()?>" show_faces="<?php echo $this->helper('facebookfree/active')->isFacesLikeActive()?>" width="<?php echo $this->helper('facebookfree/active')->getLikeWidth()?>"  colorscheme="<?php echo $this->helper('facebookfree/active')->getLikeColor()?>"></fb:like>
End
<?php endif?>

And nothing shows up between those words in my browser.

enter image description here

I know/assume fb:like isn't a standard HTML element, but what's supposed to render this as an actual like link?

I was getting an error in my console about the URL not matching my facebook application's URL settings, but I corrected that.

This is a stock, non production system with a mostly fresh install of 1.9 CE. It's also running from a local development instance on my laptop.

Also, if I let the page sit there for 45 seconds, I get the following error in my javascript console.

fb:like failed to resize in 45s

Improve this question

2 Answers 2

Reset to default
3

Step 1: Skip the extension (if you only want "Like" buttons).

Step 2: Get the latest snippet from: https://developers.facebook.com/docs/plugins/like-button/

Step 3: Use the HTML5 snippet (works with any doctype) instead of XFBML.

What you're likely missing is the Fackbook (yep) JS SDK. Normally FB wants you to place this right after the <body> tag opens. Either the extension is doing this wrong, it's outdated, it's missing or can't override the <html> tag with FB's SDK namespace (not needed in the HTML5 snippet), or there's a JS error blocking execution.

Otherwise it should just render. You can test the snippet manually just by dropping both groups of code into the same place.

Improve this answer
5
  • +1 for good general advice, but I'm working on an extension that's trying to be as compatible with the popular Magento extensions as possible. i.e. I'm trying to get the BelVG extension to work so I can build features for other people using the BelVG extension. This makes bailing and doing it myself a non-viable option (otherwise, I'd be all over that)
    – Alana Storm
    Commented Aug 1, 2014 at 21:42
  • Well, look for the JS snippet in your page source first. Otherwise nothing triggers the FB markup.
    – Brendan Falkowski
    Commented Aug 1, 2014 at 21:45
  • @AlanStorm if you load the page and wait ~45s are you seeing a "fb:like failed to resize in 45s" error?
    – Reid Blomquist
    Commented Aug 1, 2014 at 21:55
  • @ReidBlomquist Yes, I am. Is that a known thing with known science to solve?
    – Alana Storm
    Commented Aug 1, 2014 at 22:00
  • This might help, but am not certain it will resolve your issue, when I set up the extension with RWD it looked like the like button/iframe had a width of 0 stackoverflow.com/questions/21876808/…
    – Reid Blomquist
    Commented Aug 1, 2014 at 22:05
1

That was an un-fun way to spend the afternoon. There were myriad problems, but they boiled down to the BelVG extension using the text standart for the layout when they should be using standard. When the Facebook like iframe was handed standart as a parameter, it returned no like buttons.

Red herrings here included

  • The above mentioned "fb:like failed to resize in 45s", likely triggered by an empty iframe. ALl the CSS rules I found to "fix" this targeting the wrong HTML elements (although I'm sure they were right at the time)

  • That the various versions of the extension and Facebook's own code used appId, app_id, and omitted the application id completely, leading to wasted effort of trying to figure out if this was needed at all

  • That's there's various versions of the "Javascript SDK", each with different initialization parameters, leading to wasted effort trying to figure out if the like syntax had changes over the years.

I eventually solved this by diffing a generated iframe src for a Facebook provided code snippet with a the code generated by the Magento extension, and swapping parameters until it started working.

Anyone that deals with the various third party Facebook technologies on a regular basis has my pity and sympathy.

Improve this answer
1
  • 1
    Thank you for your research. I'm sorry that you faced this bug :-( For a long time fb:like had default value for "standard" attribute and this bug did not affect the output. Extension is updated. Thank you one more time
    – Pavel Novitsky
    Commented Aug 3, 2014 at 9:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.