title: Facebook Connect and then display user's first+last name and profile picture
body: <p>I'd like new users to be able to 'connect' with the use of the fb connect button on my site and once connected it will display their first+last name and profile picture.</p>
  
  <p>If the user is already connected, the connect button turns into a logout.</p>
  
  <p>Going by the docs, i've implemented the following code;</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;
        &lt;title&gt;test full name and photo&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
        &lt;div id="fb-root"&gt;&lt;/div&gt;
        &lt;script src="http://connect.facebook.net/en_US/all.js"&gt;
        &lt;/script&gt;
        &lt;script&gt;
           FB.init({ 
              appId:'xxxxxxxxxx', cookie:true, 
              status:true, xfbml:true 
           });
           FB.api('/me', function(user) {
             if(user != null) {
                var image = document.getElementById('image');
                image.src = 'http://graph.facebook.com/' + user.id + '/picture';
                var name = document.getElementById('name');
                name.innerHTML = user.name
             }
           });
         &lt;/script&gt;
             &lt;div align="center"&gt;
             &lt;img id="image"/&gt;
             &lt;div id="name"&gt;&lt;/div&gt;
             &lt;/div&gt;
      &lt;/body&gt;
   &lt;/html&gt;
  </code></pre>
  
  <p>The only problem is that it does not display the facebook connect button and when I try and insert it, the code breaks.</p>
  
  <p>Any help would be much appreciated!</p>
  
  <p>recap: website checks if the user has connected and has a valid session, if not, display fb connect/login button, if yes, display the logout button, either way it should show the user their name and profile photo.</p>
  
  <p>Thank you!</p>