I'm trying to add the Facebook registration system into my site in the hope that it might increase the number of users I get signing up, the problem is, is that I'm a bit confused with how to do it...(correctly) I've read through the Facebook help page but it's (surprisingly) a bit confusing. One minute it's telling you to do it one way, then it's telling you to do it another way...

 

I don't want to use the iFrame method, I would like to use the XFBML method with Javascript SDK and PHP SDK, there seems to be 2 ways to include the XFBML method and it doesn't tell you which one to use or if they should be combined, these are the two methods.

 

<div id="fb-root"></div>
<script src="https://connect.facebook.net/en_US/all.js#appId={YOUR_APP_ID}&xfbml=1"></script>

<fb:registration 
 fields="name,birthday,gender,location,email" 
 redirect-uri="https://developers.facebook.com/tools/echo/"
 width="530">
</fb:registration>

 

and...

 

     <div id="fb-root"></div>
     <script>
       window.fbAsyncInit = function() {
         FB.init({
           appId      : 'YOUR_APP_ID',
           status     : true, 
           cookie     : true,
           xfbml      : true,
           oauth      : 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));
     </script>
     <div 
       class="fb-registration" 
       data-fields="[{'name':'name'}, {'name':'email'},
         {'name':'favorite_car','description':'What is your favorite car?',
           'type':'text'}]" 
       data-redirect-uri="URL_TO_LOAD_AFTER_REGISTRATION"
     </div>

 

There may even be one more...

 

I was hoping that someone on this site is using one of these methods and can give me some advice on the best practise to implement this.

anybody done this at all???