so, the div and call to the fb js: Fb says to put it right after the (body) tag. Any wp plugin that uses it will put it in the footer (wp_footer(), because, well, there is no wp_just_after_body()). I have had a situation once where fb functionality that i needed would only work when this stuff was after the body tag. I dont know js enough to know what the difference is and whether body or footer is the best place for this.
so, the div and call to the fb js: Fb says to put it right after the (body) tag. Any wp plugin that uses it will put it in the footer (wp_footer(), because, well, there is no wp_just_after_body()). I have had a situation once where fb functionality that i needed would only work when this stuff was after the body tag. I dont know js enough to know what the difference is and whether body or footer is the best place for this.
Share Improve this question edited Jul 10, 2012 at 16:46 ShawnDaGeek 4,1501 gold badge23 silver badges39 bronze badges asked Jul 10, 2012 at 16:22 Doug CassidyDoug Cassidy 1,9173 gold badges18 silver badges29 bronze badges 02 Answers
Reset to default 3Just after the opening body tag on each page you want to load it.
More from facebook SDK docs:
The fb-root element must not be hidden using display: none or visibility: hidden, or some parts of the SDK will not work properly in Internet Explorer.
The SDK inserts elements into fb-root which expect to be positioned relative to the body or relative to an element close to the top of the page. It is best if the fb-root element is not inside of an element with position: absolute or position: relative. If you must place the fb-root element inside of a positioned element, then you should also give it a position close to the top of the body or some parts of the SDK may not work properly.
If you need to use js sdk near the footer of your doc it is best to use async and only make your api calls after the sdk has loaded and initialized.
I use. EXAMPLE: assume i have wrapped all of my api calls in functions.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '135669679827333',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true, // parse XFBML
channelUrl : 'https://anotherfeed./emo/channel.html', // channel.html file
oauth : true // enable OAuth 2.0
});
// facebook has been loaded and init, you can call your api functions from here.
if (window!=window.top) {
FB.Canvas.EarlyFlush.addResource("https://anotherfeed./");
setTimeout("FB.Canvas.setAutoGrow(250);", 2000);
toggle('connections'); // my api call
FB.XFBML.parse(loginb); // my api call
}else {
}
// !facebook load and init.
};
// Load the SDK Asynchronously
(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/en_US/all.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
</body>
</html>