title: Javascript SDK right after opening <body> tag not working
body: <p>Hello everyone this is my problem: the FB developers site states that, in order to initialize de Javascript SDK: "The best place to put this code is right after the opening <code>&lt;body&gt;</code> tag."</p>
  
  <p>In the Header.php of my Wordpress-based blog, i have this code:</p>
  
  <pre><code>&lt;/head&gt;
  
  &lt;body &lt;?php body_class(); ?&gt;&gt;
  
    &lt;div id="fb-root"&gt;&lt;/div&gt;
    &lt;script&gt;
      window.fbAsyncInit = function() {
        FB.init({
          appId      : XXXXXXXXXXXXXXX,
          status     : true, 
          cookie     : true,
          xfbml      : true
        });
      };
      (function(d){
         var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
         js = d.createElement('script'); js.id = id; js.async = true;
         js.src = "//connect.facebook.net/en_US/all.js";
         d.getElementsByTagName('head')[0].appendChild(js);
       }(document));
    &lt;/script&gt;
  
  &lt;div id="pagewrap1"&gt;
  
          &lt;div id="headerbg"&gt;
  
              &lt;div id="header"&gt;
              &lt;?php include (ABSPATH.'wp-content/flashfader/flashfaderhtml.txt'); ?&gt; 
  
              &lt;/div&gt;                
  
          &lt;/div&gt;&lt;!-- headerbg END --&gt;
  
  &lt;/div&gt;&lt;!-- ENDof #pagewrap1 --&gt;    
  
  &lt;div id="pagewrap2"&gt; 
  
  &lt;div id="access" role="navigation"&gt;
  
              &lt;?php wp_nav_menu( array( 'container_class' =&gt; 'menu-header', 'theme_location' =&gt; 'primary' ) ); ?&gt;
  
  &lt;div id="iconfacebook"&gt;
  &lt;a href="http://www.facebook.com/name" title="Facebook"&gt;&lt;img src="png"; /&gt; &lt;/a&gt;
  &lt;/div&gt;    
  &lt;div id="icontwt"&gt;
  &lt;a href="http://twitter.com/name" title="Sígueme"&gt;&lt;img src="png" /&gt;&lt;/a&gt;
  &lt;/div&gt;    
  &lt;div id="iconfeed"&gt;
  &lt;a href="feed" title="Suscribirse RSS 2.0"&gt;&lt;img src="png" /&gt;&lt;/a&gt;
  &lt;/div&gt;
  
      &lt;div class="search-form"&gt;
              &lt;?php $search_text = "Buscar..."; ?&gt;
                  &lt;form method="get" id="searchform" action="&lt;?php bloginfo('home'); ?&gt;/"&gt;
  
                  &lt;fieldset class="search"&gt;
  
                  &lt;input type="text" value="&lt;?php echo $search_text; ?&gt;" name="s" id="s" onblur="if (this.value == '') {this.value = '&lt;?php echo $search_text; ?&gt;';}" onfocus="if (this.value == '&lt;?php echo $search_text; ?&gt;') {this.value = '';}" /&gt;
  
  &lt;button class="btn" title="Buscar"&gt;Search&lt;/button&gt;    
  
                  &lt;/fieldset&gt;
  &lt;/form&gt;     
  
  &lt;/div&gt;
  
  &lt;/div&gt;&lt;!-- #access --&gt;
  
  &lt;/div&gt;&lt;!-- ENDof #pagewrap2 --&gt;    
  
  &lt;div id="pagewrap3"&gt;
  </code></pre>
  
  <p>And that's where my header.php ends.</p>
  
  <p>Problem is: the registration plug in a dedicated Wordpress page doesn't work, and shows this <a href="http://www.manuelmedina.com.mx/images/FB-registration-problem-1.png" rel="nofollow">image</a>.</p>
  
  <p>But if I place the code in a text widget on the sidebar it works, like in this other <a href="http://www.manuelmedina.com.mx/images/FB-registration-problem-2.png" rel="nofollow">image</a>. You can even see the sidebar margin.</p>
  
  <p>What am I doing wrong with the Javascript SDK? Where should I place it? I need the registration form in a dedicated page. Please help.</p>