DESIGNED DEVELOPED DELIVERED

Mob: 07760 392284edward@ee-web.co.uk

ee-web thinks... a bit

Go on, make my day ... leave a comment

Adding FB like box code to wordpress

October 29th, 2014 by Edward

The standard answer out there seems to be ‘use a plugin’ – but I wanted to do it from scratch. The fb code for the like-box says something like ‘put this code as close as possible to the <body> tag – but again the advice I found seem to have that ‘it will work anywhere in the page’ type of attitude – and I am sure they are right, but I wanted to follow the FB instructions.

After some digging around with thematic I found out that this can be hooked like this:

add_action('thematic_before','fb_like_box_setup',5);

– I guess you could use a different index number…

Adding to the ‘thematic_before’ hook places the code directly after the body tag. Cool!

Now I created the function ‘fb_like_box_setup and pasted in the fb code. But this threw all sorts of errors – the code needs echoing out, and in the end, after good old stackoverflow, I came up with this:

function fb_like_box_setup(){       
 $fbData='   <div id="fb-root"></div>
<script>(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_GB/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, "script", "facebook-jssdk"));</script>';

echo $fbData;
}

In effect put the whole lot into avariable, and echo that.
But there’s more

the original fb code is like this:

<div id="fb-root"></div>
<script>(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_GB/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

notice that in the line


}(document, 'script', 'facebook-jssdk'));</script>

the ‘ have been replaced with ” – single with double. So the problem is to do with ‘ and ”

Sorted!

categories

Edward owns and runs ee-web design and has been building websites for over 12 years. He is passionate about... most things really

Was this post helpful or interesting? Spread the news.

Leave a comment

*


tag