Add Facebook Profile Picture after Login?

Here is my code::

//if user is logged in - do this
function login() {
FB.api('/me', function(response) {  
document.getElementById('fb-info-block').innerHTML = 
"Welcome, " + response.name + ".<br /&g开发者_运维问答t;<br />" +
"<fb:like href = 'www.whitbreaddesign.com' show_faces = 'false' width = '100' action = 'like' colorscheme = 'light'></fb:like>";
});
}

Can someone tell me how to add the users facebook profile within this code...I already figured out how to retrieve their name with "Welcome, "+ response.name+"

Any ideas..thanks a bunch...

document.getElementById('something').innerHTML = '<img src="http://graph.facebook.com/' + response.id + '/picture" />';

You need to list fields you are interested in as a second parameter to FP.api:

FB.api("/me", {fields: "id,name,picture"}, function(response) {
    console.log(response.id, response.name, response.picture);
});

Here is a list of all available fields

You could use the FBML tag for profile pics:

var profile_pic_html = '<fb:profile-pic></fb:profile-pic>';

Just add that anywhere on the page, and as long as you have FB Connect's xd_receiver setup, that will show the currently logged in user's profile pic. To show profile pics by UID use:

var profile_pic_html = '<fb:profile-pic uid="'+some_uid+'" ></fb:profile-pic>';

You need to call FB.XFBML.Parse() so that your updated FBML can be parsed into HTML by facebook's javascript. You may be missing that.

Maybe just use XFBML?:

<fb:name uid="loggedinuser" use-you="no"></fb:name>
<fb:profile-pic uid="loggedinuser" size="square" facebook-logo="true"></fb:profile-pic>

Here's an example: http://fbrell.com/xfbml/account-info

you should use "me.id" instead of "response.id":

  document.getElementById('something').innerHTML = '<img src="http://graph.facebook.com/' + me.id + '/picture" />';