This post was updated, see the update logs below this post.
Hi there! Today we're going to do a code that:
- Gets photo albums and photos of a facebook fan page (using Facebook PHP SDK and FQL).
- Display these photos to a webpage (assuming it is your website.).
- Use jQuery Lightbox to make awesome images presentation.
 |
| Show your facebook photos to your website |
This technique has the following Advantages:
1. You save your server disk space.
2. You got instant photo manager (facebook photos)
3. You save bandwidth since the photos shown in your website are loaded from facebook's repository.
4. Please add your comment if you know other advantages.
Risks:
1. When facebook is down (Well, I never encounter facebook was down)
2. Facebook is not responsible if you lost your data. (Read section 15 of their terms)
3. Please add your comment if you know other disadvantages or risks.
2. Our index.php well have the following code.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>Display Facebook Page Photos On Your Website by http://www.codeofaninja.com/</title> <!-- Just adding some style --> <style type='text/css'> body{ font-family: "Proxima Nova Regular","Helvetica Neue",Arial,Helvetica,sans-serif; } .fbAlbumImage, .fbAlbum{ float: left; height: 170px; padding: 10px; width: 150px; } </style> </head> <body> <!-- Just some heading --> <div style='font-size: 16px; font-weight: bold; margin: 0 0 10px 0;'> This album is synchronized with this <a href='https://www.facebook.com/pages/COAN-Dummy-Page/221167777906963?sk=photos'> Dummy Page Album </a> | Tutorial Link: <a href="http://www.codeofaninja.com/2011/06/display-facebook-photos-to-your-website.html"> Display Facebook Photos On Website With FQL And jQuery Lightbox </a> </div> <?php //include the fb php sdk require 'fb-sdk/src/facebook.php'; $facebook = new Facebook(array( 'appId' => 'changeToYourAppId', 'secret' => 'changeToYourAppSecret', 'cookie' => true, // enable optional cookie support )); //defining action index isset( $_REQUEST['action'] ) ? $action = $_REQUEST['action'] : $action = ""; /* * This will show */ if( $action == ''){ echo "<p>COAN Dummy Page Albums</p>"; // select albums from our dummy page $fql = "SELECT aid, cover_pid, name FROM album WHERE owner=221167777906963"; $param = array( 'method' => 'fql.query', 'query' => $fql, 'callback' => '' ); $fqlResult = $facebook->api($param); foreach( $fqlResult as $keys => $values ){ //to get album cover $fql2 = "select src from photo where pid = '" . $values['cover_pid'] . "'"; $param2 = array( 'method' => 'fql.query', 'query' => $fql2, 'callback' => '' ); $fqlResult2 = $facebook->api($param2); foreach( $fqlResult2 as $keys2 => $values2){ $album_cover = $values2['src']; } //show the album echo "<div class='fbAlbum'>"; echo "<a href='index.php?action=list_pics&aid=" . $values['aid'] . "&name=" . $values['name'] . "'>"; echo "<img src='$album_cover' border='1'>"; echo "</a>"; echo "<div>{$values['name']}</div>"; echo "</div>"; } } /* * This will show the photo(s) on the clicked album. */ if( $action == 'list_pics'){ isset( $_GET['name'] ) ? $album_name = $_GET['name'] : $album_name = ""; echo "<div><a href='index.php'>Back To Albums</a> | Album Name: <b>" . $album_name . "</b></div>"; // query all the images in the album $fql = "SELECT pid, src, src_small, src_big, caption FROM photo WHERE aid = '" . $_REQUEST['aid'] ."' ORDER BY created DESC"; $param = array( 'method' => 'fql.query', 'query' => $fql, 'callback' => '' ); $fqlResult = $facebook->api($param); echo "<div id='gallery'>"; foreach( $fqlResult as $keys => $values ){ if( $values['caption'] == '' ){ $caption = ""; }else{ $caption = $values['caption']; } echo "<div class='fbAlbumImage'>"; echo "<a href=\"" . $values['src_big'] . "\" title=\"" . $caption . "\">"; echo "<img src='" . $values['src'] . "' />"; echo "</a>"; echo "</div>"; } echo "</div>"; } ?> <!-- activate jQuery lightbox --> <script type="text/javascript" src="jQuery-lightbox/js/jquery.js"></script> <script type="text/javascript" src="jQuery-lightbox/js/jquery.lightbox-0.5.js"></script> <link rel="stylesheet" type="text/css" href="jQuery-lightbox/css/jquery.lightbox-0.5.css" media="screen" /> <script type="text/javascript"> $(function() { $('#gallery a').lightBox(); }); </script> </body> </html>
There are lots of other album information that you can retrieve. Not only album information, but also other information visible on facebook. Just check the availabe tables that you can query on facebook. Facebook Query Language (FQL) is of great help too since we are already familiar with SQL. We don't have much to study. :)
UPDATE LOGS
February 25, 2013
February 25, 2013
- Changed CSS
- Added some comments on code
- Used the latest Facebook PHP SDK (v.3.2.2)
- Changed the live demo link
- Changed code download link
For FREE programming tutorials, enter your email below and subscribe! :)
157 comments:
grabe.. imba ka .. hahaha..
Thanks dude! :)
Thx, awesome script!
This is an excellent piece of work! However, one of the drawback could be speed... What about a script that replicates the Facebook archive locally?
Hi Mike,
this is great!
question though, when i use my own App_id and App_secret my albums/pictures doesn't show up. but when i use your App_id and my App_secret it shows your albums/pictures. what do i need to do with my facebook account? any Ideas?
how about social graph usage?
@anonymous_1: hmm i think you can use any caching techniques to do that on your server (e.g. http://memcached.org/)
@anonymous_2: i think i didn't post MY app_id and app_secret. can you give those ids you used?
@singapore web design: I will post more about that on my future posts.
thanks for you appreciation. :)
Hi Mike, does this code only works if you have a photo album in a facebook page? I tried to use my ownder ID (553078968) and it doesn't show any photo. By using yours, it works fine.
here is the url to one of my albuns:
http://www.facebook.com/media/set/?set=a.438311583968.209228.553078968
any ideia to help me?
Great.Its working nice.Please also let us know that how can we fetch the profile album.
Hi guys, I also tried and experimented this script with my FB profile pictures, unfortunately, I think this method is not suitable for fetching FB profile pictures. This method is only for Fan Pages.
I could post about how to fetch your FB profile pictures. Please subscribe via RSS or email for updates. Thanks.
Hi Mike!
Very cool stuff. Yours is the only thing like it I have found so far. Have you experimented with Events, Notes, etc? Just curious.
Yes, but not yet with FB notes, be updated by subscribing to this blog. Thanks :)
Hi Mikey, the download link give a redirect loop, and cant get to download the source files :(
It works fine with me. But I also encountered that one time, try clearing your browser cache.
Hi Mike,
While giving your ownerid it is working .and while giving my id. It is not working. Pls clarify my dbt .
Hi Mike,
I got this working on my page and want to thank you , i've been searching for ways to get content from our Facebook fan page for ages!
Maybe you can answer a question for me?...
When I load my page the browser shows 'connecting' but the page is not shown until all the data has fetched from facebook. I realise there are a lot of images being pulled from my gallery so it will take time, but i'm taking about 10 - 20 seconds of inactivity.
Would there be a way to activate the script once the page has displayed, that way i could add a pre-loader or notification so users understand there will be a delay?
My page is www.thebetaspace.com if you want to see it in action. Thanks :)
@Siva: the owner id must be owner id of a fan page only, not profile page..
@GodDanIt: Your welcome, I'm happy to see this script works in your page :) .. hmm about the pre-loader script, maybe you could use the approach I used here http://www.codeofaninja.com/2011/06/paginating-your-data-with-ajax-and.html
Ooooh! That looks good, i'll have a bash at it
and see what happens! :D
Seriously, I can't thank you enough for the original script, and your quick resonse to my question too. Cheers :)
Hi i got an error opening index.php.
What did i do wrong?
Fatal error: Uncaught CurlException: 6: name lookup timed out thrown in /var/www/vhosts/socialmediamove.nl/httpdocs/ht/fb-sdk/src/facebook.php on line 622
@geenidee: it means you have to enable Curl Extension in you php.ini file. You may google "how to enable curl in php ini" on how to do that :)
I enabled curl in the ini file, however, i still get the same message.
Fatal error: Uncaught CurlException: 6: name lookup timed out thrown in /var/www/vhosts/socialmediamove.nl/httpdocs/ht/events/fb-sdk/src/facebook.php on line 622
What am i doing wrong?
I think your server has some issues, it is not given enough time to connect with facebook server. Try to modify your facebook.php with your editor, and find this code (probably line 89)
public static $CURL_OPTS = array(
CURLOPT_CONNECTTIMEOUT => 10,
CURLOPT_RETURNTRANSFER => true,
CURLOPT_TIMEOUT => 60,
CURLOPT_USERAGENT => 'facebook-php-2.0',
);
Modify CURLOPT_CONNECTION to increase its value to, 30 or higher.
CURLOPT_CONNECTTIMEOUT => 30,
it works like a charm!
Thank you!
Hi this looks just like what I need for my website.However I'm getting this error:
Fatal error: Uncaught Exception: 190: Invalid OAuth access token signature. thrown in C:\wamp\www\fb-sdk\src\base_facebook.php on line 668
Any ideas why?
OK my bad, I forgot to enter the app ID. It works great, thank you!
Glad it works for you, you're welcome Itai! :)
Hi, me again :) The large photos in the script are 720px wide as in facebook's photo display page. Is it possible to show instead the high resolution version of the image (the one available by clicking 'download' on facebook)?
The highest image quality is given by the src_big field https://developers.facebook.com/docs/reference/fql/photo/, that's what is already showing in our example when the jquery lightbox appear. I'm not so sure if that is also the high resolution one (the one available by clicking 'download' on facebook)
Hey, nice piece of code. An important note though:
- Your jQuery Lightbox.js file is loading images from http://calleza.com/themes/calleza/js/jquery_lightbox_and_fb/images/ (!)
You're welcome. Good catch @Anonymous! Thanks a lot for that note!
This works awesome...however is there a way to do the same with a profile not a fan page?
There would be a tremendous amount of interest if that can be done
Mark
Hi @Mark, Unfortunately, I didn't find a way to do this with a facebook profile... I guess facebook allow this for fan pages only.
Hello,
I go on the "download" button, but then I cant download the package.
Do I miss something?
Which files do I need to downlad?
This is an awesome script BTW.
Thanks Checker, hmmm... Did you go to the menu File > Download Original? That's on the upper left corner of the download page.
Thank you!
I missed that one.
I will test the script and give feedback!
Alright, good luck! :)
Hi Mike...
I am using all what you have said however it does not display my photos, here is the page and all it displays...
http://funkycakes.richiesheerin.net/photos.php
This is the owner ID I think: 236296496412576
This is my app id & secret, appId: 184215168314424, secret: 29f9ceb9a886d9b3225c879db3ac273a
Cheers
I got it working... YEEEHA!!!
@Richie: Nice one. :)
I keep getting this error - i called my host and CURL is enabled
syntax error, unexpected T_NEW in /homepages/6/d126613682/htdocs/drink/gallery/facebookpix/fb-sdk/src/facebook.php on line 4
Thanks for this wonderful script, it works perfectly!
One question though, is it possible to display all photos from all albums on a single page?
Hi Mike,
I have a couple of company pages on FB, is it possible to use your script to display single albums from these pages too, as at the moment only my albums are displayed.
Cheers
Hi Mike,
I have a couple of company pages on FB, is it possible to display selected (with aid) albums from these pages too, as at the moment only my albums are displayed.
Cheers
I modified the code to display all photos from a fanpage.
Managed to work it out,but it's showing many duplicates of the same images. Any idea why?
@Anonymous: I'm afraid but I don't have any idea on that error, sorry
@JP: I think yes, you have to select all album ids first then loop through the photos table echoing all photos from those album ids.
@arcadio813: I think its a yes too, you just have to get the ids of your fb page albums then use those ids to query your albums. something like multiple: ...WHERE aid = 'your_album_id', other way would be: ...WHERE aid IN( 'album_id_1', 'album_id_2', 'album_id_3')
@Anonymous: could you post your query on selecting images and the link to your fan page? hmmm maybe you uploaded duplicate images on your fan page and that was fetched by our script
Thanks for the reply Mike. Anonymous is me too btw, forgot to use the name/url option. Sorry for the confusion.
Anyway, here's the query I used:
"SELECT pid, aid, owner, src, src_big, src_small, link, caption, created FROM photo WHERE aid IN (SELECT aid FROM album WHERE owner = 205702516132944) ORDER BY created DESC"
I used the COAN dummy page as per the demo to test it out.
Hello Mike!
Seems to be pretty simple. I would try out with your App ID before starting with mine. But I got an error (Fatal error: Uncaught Exception: 190: Invalid OAuth access token signature. thrown in /home/antimon/public_html/beta/fb-test/fb-sdk/src/facebook.php on line 515). I have just uploaded your full package here, without no changes: http://beta.anti-monkey.com/fb-test/. Any idea what could went wrong?
thanx :)
hei, i have problem like:
Fatal error: Uncaught exception 'Exception' with message 'Facebook needs the CURL PHP extension.' in /var/www/fesbuklike/sdk/src/base_facebook.php:19 Stack trace: #0 /var/www/fesbuklike/sdk/src/facebook.php(18): require_once() #1 /var/www/fesbuklike/gallery.php(11): require('/var/www/fesbuk...') #2 {main} thrown in /var/www/fesbuklike/sdk/src/base_facebook.php on line 19
tell us what problem this like??
thx.
is there a way to also pull the LIKE and SHARE buttons as well from a given photo/album as well? Just curious as it'd be more beneficial to not have to take a person away from my site in order to use the social aspects of a facebook album.
I'm getting the following error - Invalid or no certificate authority found, using bundled information
please let me know what I need to do to fix this problem.
Fantastic script!!!!!!
I was going crazy to find a method to display in my website the facebook pics!
But..i have one question..can i show also albums of people or group? how do i?
hello Mike,
great work. though i have not seen it at work
i have this error:
Fatal error: Uncaught Exception: 102: Session key invalid or no longer valid thrown in C:\wamp\www\omafoundation\php-sdk\base_facebook.php on line 1039
thank you for shating the html codes I applied it thorough blogger edit html and its working ...
Vertical Jump Bible
Wao!! its now working on my site, thanks.
Any idea on how to display comment on each picture?
hi mike, just wondering if your script supports video album on facebook too?
not work...
http://www.itemms.com/hive/index.php
http://apps.facebook.com/fbphotoextract/
GETTING THIS
Fatal error: Uncaught Exception: 190: Invalid OAuth access token signature. thrown in /home/socialca/public_html/facebookapplications/fbforweb/fb-sdk/src/facebook.php on line 515
I am getting that same error
@abhishek and @chewie41983: please check your app id and app secret.
Hi I'm trying to get a loading bar working and used the code from your paginating data tutorial as you suggested in a comment in july. It works on the initial page load, but if you click an album it reloads the whole page instead of opening the album. Any ideas to get around this???
problrm :( please help
problem please help :(
Thanks man...great code.. works perfectly !!!
Cheerz,
AJ
Code is working great!
Is there any way to display only 1 album? Basically display the page as if an album was already opened.
I want to split up the photo albums on my website.
I got it to work ;)
Love the script dude. Should be up soon at www.harpersstatuary.com
Check it out. Ill try to check this forum so I can answer some questions if needed.
Thanks Mike for the solid programming!!
Hi Mike,
Thank you for all the extremely helpful posts you have written and initiated.
I am struggling with my first facebook app and your code is very helpful though ...
I can't access my albums, with my app id and secret id I can view your and funky cakes albums but using my owner id: 100002604335685
I receive the error "Fatal error: Uncaught Exception: 102: Session key invalid or no longer valid thrown in ".
I haev made my albums public is there something else that I am missing that you cann see?
Much appreciated,
Moz
Very nice work mike it helps to build a Media RSS feed hope it gets the video url int he album too that would be over hit
should work with public groups ?
Thank you very much
Hi,
Worked out that I needed to Create A Page rather than use my facebook account photos.
Thanks,
Moz
hello,
i would like to show in a jquery slider ( into a .php file for my Facebook page) images from a selected Facebook page album.
I can't find the solution
I'm getting this, any idea's?
Fatal error: Uncaught Exception: 102: Session key invalid or no longer valid thrown in /home/readys/public_html/apartmentgroup/floritas/gallerytest/fb-sdk/src/facebook.php on line 515
Modify http://www.cm77.com/index.php?id=36
Hi Mike,
This is an awesome script, if I only can get it to work!!!!
I'm using wysiwyg to do my webpage and I'm using jQuery to make a photoalbum thats on my server how ever when I'm trying to use your script as is just to see if it works i get the following error:
Fatal error: Uncaught Exception: 190: Invalid OAuth access token signature. thrown in D:\Hosting\6940775\html\Fotoalbum\Facebook\fb-sdk\src\facebook.php on line 515
I have 2 problems, one I'm not a programer I'm a golfpro and I have up to now put a link to the facebook pictures on my webpage, but this is very timeconsuming and requieres constant updates of the webpage. It's so easy just to upload pictures directly to facebook but there is where my second problem comes, most of my clients are 60+ and they dont have facebook. I'm desperate for help and I would be more than happy to pay to get this solved as it is very important to me and my company.
Sincerely,
Manuel.
@Manuel: Hi there! if you want pro help please go to the 'Requests' section of this site and send me your email. let's see what i can do for you. :)
Great knowledge you have shared with us and before read your post i was unaware about it and thought that it is impossible for me to do it, but after read your post i am feeling that it is easy and it will help me a lot.
Thanks, good code.
It is possible to get the photos of users whom you are friends with. Add the following lines before the line
// defining action index
if ($facebook->getSession()) {
echo "You have a facebook session for this app";
} else {
echo "You need to login first - ";
echo 'Login';
}
Whatever URL you are using for testing, this needs to be added in the Website section of the facebook application settings. AAfter clicking on Login, your browser will be redirected back to the same page, upon which the login button now disappears as you are logged into facebook with respect to the application.
Then change your search to the id of the user whom you are interested in. There is no longer a restriction to just pages
Hi, I have a problem, i download file Fb-SDK/src/facebook.php and upload to my localhost to folder "fb-sdk/src/facebook.php". I start /localhost and select folder in browser and browser wrote message error "Parse error: syntax error, unexpected ']' in C:\ComplexWebServer\http_docs\j\fb-sdk\src\facebook.php on line 940". Whre is problems?
Script from 940 line: hashComments:b,cStyleComments:b,multiLineStrings:b,regexLiterals:b}),B={};h(da,["default-code"]);h(y([],[["pln",/^[^]*(?:>|$)/],["com",/^<\!--[\s\S]*?(?:-\->|$)/],["lang-",/^<\?([\s\S]+?)(?:\?>|$)/],["lang-",/^<%([\s\S]+?)(?:%>|$)/],["pun",/^(?:<[%?]|[%?]>)/],["lang-",/^]*>([\s\S]+?)<\/xmp\b[^>]*>/i],["lang-js",/^]*>([\s\S]*?)(<\/script\b[^>]*>)/i],["lang-css",/^]*>([\s\S]*?)(<\/style\b[^>]*>)/i],["lang-in.tag",/^(<\/?[a-z][^<>]*>)/i]]),"default-markup,htm,html,mxml,xhtml,xml,xsl".split(","));
Where is a problem/s? Can you help me pls ? Thank!
Hi Mike...
I am using all what you have said however it does not display my photos, here is the page and all it displays...
http://plur.com.tw/new/FB_photos/index.php
This is the owner ID I think: 206589206046378
This is my app id & secret, appId: 289388427741701, secret: 4ac6fe1b669eed3f8634c31ff6aa9b13
please help me!
Is it feasible to use this code against a user's profile rather than a page -- if the app requested the appropriate permissions: user_photos,friends_photos ?
Mike -- Any ideas? on this
THANK YOU SO MUCH! I've been searching and struggling to create a way for my web customers to organize their own photos on their websites, and this is perfect!!
Hello, thanks very much.
I was wandering if there is a way to limit the query to the latest album, for instance to show only the last 12 albums?
Thanks again...
I got it to work ;)
Love the script .
Can we use this with groups?
Hello ,
i use this. It OK with PAGE ID = 266263583420755
But i can't use with PAGE ID = 295586073833704
i should to do ?
i don't understand it T^T
Hey Mike, thanks for the great script.
I have it implemented, and I can plug in just about any facebook id to get their feed, except the one I am trying to get. Is there something in particular I need to do to the feed on facebook's end to ensure it shows up?
Any help is greatly appreciated.
Here is the page I'm trying to put it on:
http://dev.bigshift.com/music-iframe/
with this ID:167626859995709
Thanks.
Hey Mike..thats a great piece of code ..i made a small implementation of it here..
http://goo.gl/Ti6yo
thats just for a sample..
and Mike the issue i have is with the thumbnails.. can't I get all the thumbnails in one size.. 'coz they look a bit unnatural when they are of different sizes..
Please Help me out . Thanks in advance ...
Rathan
You're welcome @Doe! :)
I know this is late but, at least for others, pleas enable CURL extension in your server. Maybe contacting your hosting company will help. :)
Hi @David, I was unsuccessful when I tried that using this script. Maybe other methods will do..
Hi @Rathan, regarding the thumbnail size, that can be fixed using CSS. You may try this method: define the size of your thumbnail in a div then use something like overflow:hidden
Nice one! Thanks @mensajes!
Hi @Derrick! Haven't tried that. Sorry..
I know this might be late, but yes it's possible http://www.codeofaninja.com/2012/02/display-facebook-videos-to-your-website.html
Hi Mike, thanks for all your hard work. I'm searching for a way for group members on FB to be able to post a public album to the group and allow other members (non-friends) to be able to tag or comment on the photos in the album. Members can post an album, but cannot comment on the photos. Any suggestions? Here's a link to one of my public albums so that you can see what I mean... https://www.facebook.com/media/set/?set=a.10150789080685968.499526.781045967&type=3&l=2defbbcec4
Thanks for any suggestions!
Cheryl
Hi Everyone,
I've had a read through the above messages and cant see where anybody has mentioned my query.
I am getting duplicate albums and incorrect album names, ones that don't even exist!!
My Page: http://alturl.com/xp7qp
Facebook Page: https://www.facebook.com/TheCourtenay?sk=photos
Please help!!! Thank you
Alex
Hi @Alex, Profile Pictures are different from you Wall Photos. If you want to unselect an album you have to do something like:
SELECT aid, cover_pid, name FROM album WHERE owner=your_page_id AND aid != id_you_dont_want_to_select
Thanks for your reply, but it doesn't seem to have worked. I added:
AND aid !=(and the id of the album)
...but the album had a string of 3 number separated by .'s:
https://www.facebook.com/media/set/?set=a.372559612758179.110315.372556249425182&type=3
I see that the last string is the page ID (372556249425182), but not sure what to use for the album ID?
Sorry to be a pain :(
Thank you for the great script!
its so rare to find something that works on the first go.
well done!
I got it to work ;)
Love the script .
Hello! love the script, however I am getting phantom albums that are being created. If i create a new album in facebook & upload 1 picture, it displays in the script normally. However, if I have more than one picture, your script creates a phantom album with the same cover photo, but it's labeled untitled & has no pictures in it... any advice?
I followed your code exactly and don't have any errors, aside from this one... it's really bugging me. The only thing I can think of is that possibly it's an issue with facebook? As this only happens with my newer albums, and not the older ones.
Do you have any idea as to why this is occurring Mike?
If you take a look at the demo, it's generating two untitled albums, with no pictures in them... advice?
Hi Mike! I love this :D Been searching on the net for this for days now. Only question how can I add comments/likes to each photo?
The code works beautifully. I had no problems except for one. When I uploaded it and changed out the APP ID and Secret everything was working. I located the facebook Page ID and swapped it out too. Everything was fine till I clicked on an album. "File not found" Turns out that renaming your file "index.php" will render the program unusable unless you fix line 53 ( echo"<div><a href="RENAMEDFILE" . . ) Works now. Great Code. DONATE TO THIS SITE!
I love it!
Great job man!
Hi Mike, this is really... really... great work dude. You really helped me out today. I added my own twist of incorporating it into ajax as well. I will post my version of the code. However I am having the same problem as two other people who commented here. The problem also existed when using the original form of your code without the ajax.
...it's the phantom albums. I have several blank albums showing up and it's really annoying. See under the gallery section @ www.havanahookah.net/index2.php
thanks in advance...
Paul
Nevermind I used your suggestion to filter out 4 phantom albums. What I think this is could be deleted albums still in facebook's fql databse???? Some of the titles seemed like older, and crappier names to existing albums. I'll ask the original owner of the fan page as im doing this for somebody. Maybe there's an extra column to filter out in the fql query like "status != deleted" or something... who knows maybe a bug? If you could try in your own demo, delete and recreate an album and see what shows up?? Ill try this on my own time but it wont be any time soon. Thanks again dude!
Thanks Patrick! honestly, I haven't tried creating a hack on that feature. Maybe I'd post about that soon.
Thanks, I'm glad it helped. :)
Hi Paul, I'm glad it works for you. I haven't looked at that instance yet (I may find time), but maybe, the deleted albums isn't instantly deleted on facebook's servers. It might take some time before it will be completely removed. Anyway, what is important now is you can filter out what albums must be shown on your client's site. :)
Thanks jdogfantastic, and to your recommendation. :)
Remove any age or country restriction on who can view your page in facebook settings
add this the the end of the fql ORDER BY created DESC LIMIT 12;
Thanks you, this post very help me!!!!
Great code!
I've modified it to load individual facebook pages (as in your personal one) but I'm encountering an issue where if the page fully loads the clicked album isn't visible, but if you press it before its finished loading it works fine. Any help/tips?
www.xkarlbriggsx.co.uk/gallery.php it links to the facebook app, requires authorisation, loads the photos from the users gallery, but as mentioned stops being clickable once its loaded!
Could you show us how to load the gallery via ajax? I took a look at your source but could not figure it out. Thank you very much.
Where should my facebook appID link to?? I have tried my facebook landing page appID and secret code that doesnt seem to work. My question is when i create an appID where should i reference it to?
Great work Mike. Very useful
Thank you very much!
Any idea how to do this, but display the images in a gallery on an iphone application?
Thanks
Hey mike,
Nice code, but i cant figure out how to select only 3 albums out of 30, without having to define 27 of them. That seems a bit ineficient to me xD
Any clues?
Just wondering if there is a way to tell the code to exclude a certain album? (ex: unrelated 'Wall Photos' album)
Thanks!
Hi how did you manage to resize all thumbnail????
i'm trying to do the same thing with no luck. anyone found the correct solution? i believe you have to run multiple queries to filter, but i am not sure.
$fql = "SELECT aid, cover_pid, name FROM album WHERE owner=xxxxYOU ID xxxxx AND name<>'Wall Photos' AND name<>'Cover Photos' AND name<>'Profile Pictures'";
Replace this in to line 28 of the index.php it get rid of profile pics, wall photos & cover photos
GOT IT!
So replace line 28 (this line: $fql = "SELECT aid, cover_pid, name FROM album WHERE owner=188166104626524";)
WITH THIS:
$fql = "SELECT aid, cover_pid, name FROM album WHERE owner=188166104626524 AND name<>'Wall Photos' AND name<>'Cover Photos' AND name<>'Profile Pictures'";
Thanks for posting it here. Something like this will be included in the next version. Thanks again!
Hi mike... nice code but i have a question... because it is not necessary get an user acces toke to do this?
i have the same problem... do you solve it?
Greet work, It solve my problem, Thank you very much
I had this code working fine on a site, thanks for providing it. But, now the gallery section on the site is just blank. I've checked the facebook page owner hasn't deleted their albums. Puzzled. Has anyone else using this reported similar problems?
Hi there, i have to tell you that something is wrong with this code, at first everithing was working just fine, but for several days in my gallery thumbnails of album is not showing. I have went to your page, see where have I mistaken, and on your demo that doesnt work either.. so, did facebook changed something or what is happening?
Daniel
Hi Anthony, there's no need to get user's token since it works for fan pages only.
Hi Steve189 and Daniel, did you see any error messages? Did you try to update your fb php sdk? The code still works for me, it's just the demo of this post isn't updated yet (gonna update if i have time, hehe). And also the latest version still works http://www.codeofaninja.com/2012/05/display-facebook-data-to-your-website.html
if you want to use pics from a user account you need to create login so you can authenticate that user, remeber if your albums are public like fan pages you are good to go but if you have set any type of restrictions then authentication is needed.
jQuery NOOB needs assistance.
Hi~ I'm working on a site for a non-profit animal rescue and I'm hoping to use your script to pull in pics from our FB page (http://facebook.com/LilOrphanHammies )
The page I would like them to pull to is: http://lilorphanhammies.org/scrapbook
I have not yet integrated Lightbox, but I got the impression from everything above that this is the "icing on the cake" as opposed to a mandatory item for function.
I've entered our App ID and Secret. Can anyone tell me what I'm missing/ doing wrong?
Thank you!
Part 2 ;)
photos.php =
||||div style='font-size: 16px; font-weight: bold; margin: 0 0 10px 0; color: #FFF;'>
This album is synchronized with the Havana Hookah
||||a href='https://www.facebook.com/HavanaHookahLounge/photos' target="_blank">
Facebook Photo Album.
||||/a>
||||/div>
||||?php
//include the facebook PHP SDK
require ($_SERVER['DOCUMENT_ROOT'].'/fb-sdk/src/facebook.php');
$facebook = new Facebook(array(
'appId' => 'ENTER YOUR OWN APPID',
'secret' => 'ENTER YOUR APP SECRET',
'cookie' => true, // enable optional cookie support
));
//defining action index
isset( $_REQUEST['action'] ) ? $action = $_REQUEST['action'] : $action = "";
//if there's no action requested
if( $action == ''){
echo "";
$fql = "SELECT aid, cover_pid, name FROM album WHERE owner=########### AND name != 'November 22, 2011' AND name != 'November 17, 2011' AND name != 'November 16, 2011' AND name != 'SEPT 11 2011' AND name != 'NORRIDGE TOBACCO HALLOWEEN PARTY OCTOBER 29 2011'";
$param = array(
'method' => 'fql.query',
'query' => $fql,
'callback' => ''
);
$fqlResult = $facebook->api($param);
echo "||||div class='galcenter'>";
foreach( $fqlResult as $keys => $values ){
//we will do another query
//to get album cover
$fql2 = "select src from photo where pid = '" . $values['cover_pid'] . "'";
$param2 = array(
'method' => 'fql.query',
'query' => $fql2,
'callback' => ''
);
$fqlResult2 = $facebook->api($param2);
foreach( $fqlResult2 as $keys2 => $values2){
$album_cover = $values2['src'];
}
echo "||||div style='padding: 10px; width: 150px; height: 170px; float: left; color: #FFF;'>";
echo "||||a onclick='fetchAlbum(\"" . $values['aid'] . "\", \"" . $values['name'] . "\")' style='cursor: pointer; '>";
echo "||||img src='$album_cover' border='1'>";
echo "||||/a>||||br />";
echo $values['name'];
echo "||||/div>";
}
echo "||||/div>";
}
//when the user clicked an album
//it will show or list all the pictures
//on that album
if( $action == 'list_pics'){
isset( $_GET['name'] ) ? $album_name = $_GET['name'] : $album_name = "";
echo "||||div style='color: #FFF;'>||||span style='cursor: pointer; text-decoration: underline; color:#0033FF;'>||||a onclick=\"loadPage('photos')\">Back To Albums||||/a>||||/span> | Album Name: ||||b>" . $album_name . "||||/b>||||/div>||||br />";
echo "||||script language=javascript>scroll(0,0);||||/script>";
$fql = "SELECT pid, src, src_small, src_big, caption FROM photo WHERE aid = '" . $_REQUEST['aid'] ."' ORDER BY created DESC";
$param = array(
'method' => 'fql.query',
'query' => $fql,
'callback' => ''
);
$fqlResult = $facebook->api($param);
Part 3 :o
//so that jQuery lightbox will pop up
//once the image was clicked
echo "||||div id='gallery' class='galcenter'>";
foreach( $fqlResult as $keys => $values ){
if( $values['caption'] == '' ){
$caption = "";
}else{
$caption = $values['caption'];
}
echo "||||div style='padding: 10px; width: 150px; height: 170px; float: left;'>";
echo "||||a href=\"" . $values['src_big'] . "\" title=\"" . $caption . "\">";
echo "||||img src='" . $values['src'] . "' style='border: medium solid #ffffff;' />";
echo "||||/a>";
echo "||||/div>";
}
echo "||||/div>";
}
?>
||||!-- jQuery lightbox include script -->
||||script type="text/javascript" src="../jQuery-lightbox/js/jquery.js">||||/script>
||||script type="text/javascript" src="../jQuery-lightbox/js/jquery.lightbox-0.5.js">||||/script>
||||link rel="stylesheet" type="text/css" href="../jQuery-lightbox/css/jquery.lightbox-0.5.css" media="screen" />
||||!-- END JLIGHTBOX -->
||||script type="text/javascript">
$(function() {
$('#gallery a').lightBox();
});
||||/script>
...I hope this helps. Sorry if this is all over the place, I did it over a month ago and I just retraced my steps to try and reply with something. It's not perfect but does the job as needed right now. I never got an email notifying me of your response or I wouldve replied back in April. I feel I owe the author of this tutorial that much :)
Mike how do you limit the results of the photo gallery to < 7 per row? I need it to be 4 images per row. Thanks!
I want to go to an album and display on my website only the one(s) I click not all, how this code will vary. What I can not do is retrieve the id of one clicked (selected) photo.
Thanks
N/M Mike I got it! Thanks for an AMAZING script!
Hi Anonymous, what's the actual problem? Any error messages?
The script isn't loading any images and breaks the site template, so I know I'm doing something wrong! If you go to http://lilorphanhammies.org/scrapbook you can get an idea of the problem.
Thanks!
Hi Mike
is it possible to display the like button beside the photo ? I was taking to add the like_count in the FQL , doesnt work. I am trying to add a poll photo by like on my webpage.
Thanks ,,
looking forward to your voice
fai
Hmm. I've tried creating a new FB app, just in case there was a problem with the first one, but I still can't get this to work.
Any ideas?
Thanks!
Still no errors, but it breaks my PHP template and causes an otherwise validating page not to validate. The inclusion of this script causes div's that were closed to read as unclosed tags. Any ideas?
Thanks again!
Still not working for me either :( it was working perfectly to begin with. I didn't alter a thing but suddenly, no photos. I've also created a new FB app and tried that but still, nada.
"102/Session key invalid or no longer valid
How to solve it?
102: Session key invalid or no longer valid
How to solve it, Mike?
How u solve this 102 error Tosin? I am getting same error?
Help me me Mike & Tosin
Hey,
I have a question. Basically if you have a show_photos page with say 3 pages, and you click on a picture on first page and press the next button in the modal window/pop-up only the photos in the first page will be displayed.
In other words, if you have 3 pages you cant view each picture in all of the pages via the modal popup.
What's the way around this?
Thank you :)
Hi, Thanks for your code. I successfully pulled a random members photo from our open group page. However, it takes time to load. Maybe I didnt put the right code or something. Im just an average PHP/FQL programming so bear with me.
Here is out website: http://www.chagalog.org/
If you could create a new tutorial on how to pull members photo from an open group page that is fast loading, that would be great!
Thanks again
@xcodeee - thank you! That's exactly what I needed!
Very helpful and much needed feature.
Hi. I like that app. and wanted to include it in wordpress. It works smoothley until I click on one album. The following link will not work ..
Example link: index.php?action=list_pics&aid=221167777906963_68635&name=Android
So the fotos in the album aren't shown.
Any suggestion or experience in handling this with permalinks ..?
Thanks
Fred
Can anyone who is more familiar with this please help me out? I don't know SQL at all and I need to impliment a client's facebook page photos into their website.
How would I modify this script to display only the photos from one album, instead of all albums?
It works great, I just need to show photos from one album though.
Thanks in advance.
Hi Mike,
Im getting fatal error at run time
Uncaught exception 'Exception' with message 'Facebook needs the CURL PHP extension.' in C:\xampp\htdocs\Facebook_Photo\facebook.php:4 Stack trace: #0 {main} thrown in C:\xampp\htdocs\Facebook_Photo\facebook.php on line 4
Hi Mike, thanks for the awesome App.
However I cant seem to display my own photo's. Ive read your comments to others. But Im not sure how to find my owner ID or how to set access to users?
The URL is http://www.graceandfavourthelabel.com.au/fb_test/
And the
'appId' => '503288736354725',
'secret' => '7fae72353b28f273f07bc6a27bdcc6f9'
Could you please help me. Cheers.
New comments are not allowed.