Below is the default Facebook JavaScript SDK code, with the appid of my blog in it :
<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_US/sdk.js#xfbml=1&version=v2.8&appId=150436614997987";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Facebook requires that you add the code right after the opening <body> tag in your blog's html to enable Facebook social plugins work on your blog.
Unfortunately, adding the code to your Blogger blog might throw some xml error. So, in this post, I want to share with you, how to add the Facebook JavaScript SDK to Blogger themeswithout throwing xml error.
Steps
Sign in to your Blogger dashboard, click on "Theme"
Click on "Edit HTML"
Use "CTRL F" to find the opening <body tag
Right below it, paste this code :
<div id='fb-root'/>
<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_US/sdk.js#xfbml=1&version=v2.8&appId=150436614997987";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Change the highlighted appid to the application id of your blog.
Click "Save Theme".
If saved successfully, it will look like this:
If you don't know your blog app id, use the code below:
<div id='fb-root'/>
<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_US/sdk.js#xfbml=1&version=v2.8&appId=";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Alternatively,
Add <div id='fb-root'/> below the opening <body tag
Copy the script part of the default code and parse it.
After parsing it, paste it directly below the <div id='fb-root'/>
Click "Save Theme"
I hope this helps.
No comments:
Post a Comment