Question

I have been fighting this for a while, and I just cannot make a facebook ‘like’ button appear reliably. It appears about 2/3 or 3/4 of the time for me, in any browser, on any page on my site, such as this one: https://www.liveset.com/events/142-blindpilot-new-orleans-live

I’m using the following code:

<div class='fb-like' data-href='https://www.liveset.com/events/142-blindpilot-new-orleans-live' data-layout='button_count' data-send='false' data-show-faces='false'></div>
.
.
.
<div id='fb-root'></div>
<script>
  //<![CDATA[
    (function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));
  //]]>
</script>

We’ve replicated this across numerous browsers and OSs with all extensions disabled. There’s only one like button on the page. Our OpenGraph tags are valid, and if they weren’t, why would it only fail part of the time?

There are no Javascript errors. all.js loads correctly, and has content. The fb-like div is simply not filled out with an iframe; it remains exactly as it is in the page source. Simply nothing happens.

The problem is easily replicated by visiting the site above and reloading a few times.

Answer 1

I couldnt replicate the issue with 15 reloads, but I have seen this issue quite a few times on sites with alot of dynamic content, or dynamic loading content. Notice how the last thing on your site to load is the facebook button? Likely it is on their end, timing out. I tend to have this issue when other things must load, they take awhile and then facebook cant complete in time for the browser to load it.

* On a side note, trying removing google analytics and quantcast(if you use it) and see if you can replicate the issue then. Let me know.