Home » facebook » facebook api » how to » php » Upload photos to Facebook Fan Page using PHP

Upload photos to Facebook Fan Page using PHP

Arvind Bhardwaj 12/17/2011 89 comments

After writing the article on Uploading photos to Facebook albums, I though it would be a good idea to tell my readers how to upload photos to your Facebook fan page. Uploading photos to the fan page is a bit different from uploading photos to your album. Here we need the access token of your Fan page. If you know the id of your Fan page, it can be found on runtime though. So here is the script to upload the pics.

Live Demo Download Script

PHP Code:

<html>
<head>
<title>WebSpeaks.in | Upload images to Facebook</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<?php
require_once 'library/facebook.php';
$facebook = new Facebook(array(
 'appId'  => $app_id,,
 'secret' => $app_secret,
 'fileUpload' => true
));


//It can be found at https://developers.facebook.com/tools/access_token/
$access_token = '<Your access token>';

$params = array('access_token' => $access_token);

//The id of the fanpage
$fanpage = '330299184793';

//The id of the album
$album_id ='10150418901414794';

//Replace arvind07 with your Facebook ID
$accounts = $facebook->api('/arvind07/accounts', 'GET', $params);

foreach($accounts['data'] as $account) {
 if( $account['id'] == $fanpage || $account['name'] == $fanpage ){
  $fanpage_token = $account['access_token'];
 }
}


$valid_files = array('image/jpeg', 'image/png', 'image/gif');

if(isset($_FILES) && !empty($_FILES)){
 if( !in_array($_FILES['pic']['type'], $valid_files ) ){
  echo 'Only jpg, png and gif image types are supported!';
 }else{
  #Upload photo here
  $img = realpath($_FILES["pic"]["tmp_name"]);

  $args = array(
   'message' => 'This photo was uploaded via WebSpeaks.in',
   'image' => '@' . $img,
   'aid' => $album_id,
   'no_story' => 1,
   'access_token' => $fanpage_token
  );

  $photo = $facebook->api($album_id . '/photos', 'post', $args);
  if( is_array( $photo ) && !empty( $photo['id'] ) ){
   echo '<p><a target="_blank" href="http://www.facebook.com/photo.php?fbid='.$photo['id'].'">Click here to watch this photo on Facebook.</a></p>';
  }
 }
}

?>
 <!-- Form for uploading the photo -->
 <div class="main">
  <p>Select a photo to upload on Facebook Fan Page</p>
  <form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" enctype="multipart/form-data">
  <p>Select the image: <input type="file" name="pic" /></p>
  <p><input class="post_but" type="submit" value="Upload to my album" /></p>
  </form>
 </div>
</body>
</html>

A bit of CSS:

html{
 font-family: "lucida grande",tahoma,verdana,arial,sans-serif;
}
.main{
 width:400px;
 margin:auto;
 border:2px solid #0066CC;
 color:#3B5998;
 padding:20px;
 font-size: 11px;
    -moz-border-radius: 4px 4px 4px 4px;
    border-radius: 4px 4px 4px 4px;
    -moz-box-shadow: 1px 1px 0 #d5d5d5;
 background: none repeat scroll 0 0 #F2F2F2;
}
.text{
 color: #777777;
 border: 1px solid #BDC7D8;
 font-size: 11px;
 height: 15px;
}
.post_but {
    background: none repeat scroll 0 0 #EEEEEE;
    border-color: #999999 #999999 #888888;
    border-style: solid;
    border-width: 1px;
    color: #333333;
    cursor: pointer;
    display: inline-block;
    font-size: 11px;
    font-weight: bold;
    padding: 2px 6px;
    text-align: center;
    text-decoration: none;
}
a{
 color:#3B5998;
}

89 comments

ADEL

December 19, 2011 at 2:18 AM

thnx

Stefan

December 29, 2011 at 6:28 PM

I tried this code with my own app, filled in my id / account /secret key etc. But $accounts = $facebook->api('/MYUSERNAMEHERE/accounts', 'GET', $params); always returns an empty array. What could be wrong. i would be sooo happy if you reply to this cause i did not find a single working example of it beside your live demo. thanks in advance!

Stefan

December 29, 2011 at 7:58 PM

Im also the Admin of the Page where i want to post the picture in the album. I think i am missing something simple, but cant figure it out for hours now :(

Arvind Bhardwaj

December 29, 2011 at 8:29 PM

Hi Stefen,
I believe you may be missing the right access token for the page. The token can be found at It can be found at https://developers.facebook.com/tools/access_token/. Please try with it.

Thanks.

Stefan

December 29, 2011 at 8:51 PM

Glad you found time to answer. I managed to fix the error with the empty array by granting "manage_pages" permissions for my app. But im wondering how YOU did that. As far as i can see in your live demo there is not a single facebook dialog for the user to accept. And thats the thing thats very important for me. I have to use this script for users (which are not admins of the fanpage) they can draw a picture. This picture is supposed to be posted in an album on the fanpage. As i am am saving the script successfully on my server via php it would be wonderful to automatically move it to the album. So im wondering how you did that without a single "ask for permissions" dialog?

Arvind Bhardwaj

December 29, 2011 at 8:55 PM

Actually the App used in the script should have 'manage_pages' permission. After that the users do not need to grant permissions. Its actually the App that is uploading the image, not the user:)

Stefan

December 29, 2011 at 9:22 PM

Hum, i think i dont get it. Where did you give this permissions for your app?

Stefan

December 30, 2011 at 5:04 AM

Ok this is how i finally managed it to run:

1. Created an application
2. Logged in as Administrator on Facebook
3. Got an PERMANENT AccessToken by calling graph.facebook.com/oauth/authorize?type=user_agent&client_id=YOUR_APP_ID&redirect_uri=YOUR_REDIRECT_URL&scope=manage_pages, offline_access, user_photos, publish_stream, manage_pages
4. Filled in the PERMANENT AccessToken in the script
5. Logged Out at Facebook
6. Logged in at Facebook as a Testuser (who has no Admin rights for the Fanpage)
7. Sucessfully Uploaded a Photo to the Fanpage Album via Facebook-Application without being prompet for extended "manage_pages" permissions

So no my App (which needs no special permissions) sends the Picture to the php-Script which can upload/manage the Fanpage because of the
Permanent AccessToken which belongs to the Administrator. I don't know if you did it the same way, but luckily this works for me good enough.

So big thanks for sharing your knowledge, i appreciate that!

Anonymous

January 9, 2012 at 11:20 AM

Where is the 'library/facebook.php' ??

Marcus Belcher

January 23, 2012 at 5:21 AM

This comment has been removed by the author.

Marcus Belcher

January 23, 2012 at 5:22 AM

I believe library/facebook.php is the facebook libraries.

https://github.com/facebook/facebook-php-sdk/tree/master/src

P.s. good guide!

Rob

January 23, 2012 at 6:53 PM

Great post. :) I'm a FB newbie after having two years of programming experience with Twitter.

I'm getting:

"Fatal error: Uncaught OAuthException: Invalid OAuth access token signature. thrown in.."

error. I did use the access token in found in the access token tool.. I replaced the username "arvind07" with the admin user name...

Am I doing this right?

Arvind Bhardwaj

January 23, 2012 at 7:48 PM

@Marcus Belcher, you are right. Facebook library can be downloaded from github or facebook developers site.

Arvind Bhardwaj

January 23, 2012 at 7:52 PM

@Rob, The steps you followed seems to be correct. However guessing the exact cause of the problem is difficult. Make sure all the IDs and tokens are correct and you are not missing anything.
Good luck:)

Amit

January 27, 2012 at 11:28 AM

My token gets expired, how did you managed that?

Arvind Bhardwaj

January 29, 2012 at 6:01 AM

Hi Amit,
You need to provide offline_access permission to your application.

Anonymous

January 30, 2012 at 11:17 PM

How Can I submit the Image directly to the facebook fan page wall instead of the album ??

Arvind Bhardwaj

January 30, 2012 at 11:29 PM

For publishing images to fan page wall, you can use the graph API. Details are present at https://developers.facebook.com/docs/reference/api/

Anonymous

January 31, 2012 at 12:21 AM

Can you provide me with the exact syntax to your above code so that i could post the image to the facebook wall?

Arvind Bhardwaj

January 31, 2012 at 12:37 AM

Currently I do not have the exact code. I may post this article very soon. Keep reading:)