Display Facebook Photos On WordPress or Website using PHP and Graph API

Display Facebook Photos On WordPress or Any Website

Hey guys! Today we’re gonna display Facebook photos on WordPress websites or any website made with PHP! Actually, you can do it in other programming language as well, other than PHP, as long as it can parse a JSON string. You just have to follow our code pattern here.

Our source code is useful if you want your Facebook pictures to be shown in your website in a synchronized way.

Once you uploaded an image in your fan page, it will be seen automatically in your website too.

This post will cover the following content:

1.0 Source Code Overview
2.0 Advantages and Risks
3.0 Final Output Demo
4.0 Step by Step Programming (Steps 1-8)
5.0 How to Display Likes and Comments?
6.0 What People Have Been Saying
7.0 Download Source Code
8.0 Related Source Codes
9.0 You Don’t Like Coding?

Let’s get started!

1.0 Source Code Overview

Today we’re going to do a code that:

1. Gets photo albums and photos of a Facebook fan page (using Facebook Graph API).

2. Display these photos to a webpage (assuming it is your website) beautifully with Bootstrap. It is also responsive so it’s one advantage for mobile devices. If you’re not yet familiar with this awesome front-end framework, see our step by step Bootstrap tutorial here.

3. Use Bootstrap Image Gallery extension to make awesome image pop up presentation. This extension is fully responsive and touch enabled. Good for every mobile device!

2.0 Advantages and Risks

This technique has the following advantages and risks.

2.1 Advantages

  1. You save server disk space because the photos don’t reside in your hosting provider.
  2. You got instant photo manager which Facebook photos. It become’s awesome and new features are added frequently.
  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.

2.2 Risks

  1. When Facebook is down, your website with this feature will be down as well. But I almost never encounter Facebook was down.
  2. Facebook is not responsible if you lost your data or any disruptions on it Read section 16.3 of their legal terms.
  3. Please add your comment if you know other disadvantages or risks.

3.0 Final Output Demo

It is important to know where we are going. You can view the LIVE DEMO HERE. Video demo coming soon.

4.0 Step by Step Programming

Now here’s the fun part!

Step 1: Create index.php and with the following basic HTML code.

<?php
$page_title = "Photo Albums";
?>
<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title><?php echo $page_title; ?></title>

    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
	<style>
	.col-md-4{
		margin: 0 0 2em 0;
	}
	</style>
</head>
<body>

<div class="container">

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

</body>
</html>

Step 2: Inside the DIV with a “container” class, put the page title, specify the Facebook page ID and decode the JSON string from a graph API URL.

<?php

echo "<div class='col-lg-12'>";
	echo "<h1 class='page-header'>{$page_title}</h1>";
echo "</div>";

$fb_page_id = "221167777906963";

$json_link = "http://graph.facebook.com/{$fb_page_id}/albums?fields=id,name,description,link,cover_photo,count";
$json = file_get_contents($json_link);

$obj = json_decode($json, true, 512, JSON_BIGINT_AS_STRING);

$album_count = count($obj['data']);
?>

Step 3: Loop through the retrieved content. Put the following code under $album_count variable on step 2 above. It links to another PHP file called photos.php where the use can view the photos inside the album.

for($x=0; $x<$album_count; $x++){

	$id = $obj['data'][$x]['id'];
	$name = $obj['data'][$x]['name'];
	$description = $obj['data'][$x]['description'];
	$link = $obj['data'][$x]['link'];
	$cover_photo = $obj['data'][$x]['cover_photo'];
	$count = $obj['data'][$x]['count'];

	// if you want to exclude an album, just add the name on the if statement
	if(
		$name!="Profile Pictures" &&
		$name!="Cover Photos" &&
		$name!="Timeline Photos"
	){

		$show_pictures_link = "photos.php?album_id={$id}&album_name={$name}";

		echo "<div class='col-md-4'>";
			echo "<a href='{$show_pictures_link}'>";
				echo "<img class='img-responsive' src='http://graph.facebook.com/{$cover_photo}/picture' alt=''>";
			echo "</a>";
			echo "<h3>";
				echo "<a href='{$show_pictures_link}'>{$name}</a>";
			echo "</h3>";

			$count_text="Photo";
			if($count>1){ $count_text="Photos"; }

			echo "<p>";
				echo "<div style='color:#888;'>{$count} {$count_text} / <a href='{$link}' target='_blank'>View on Facebook</a></div>";
				echo $description;
			echo "</p>";
		echo "</div>";
	}
}

Step 4: Create photos.php with the following PHP code the retrieves value from a GET request. We’ll get the album ID and Name that can be used to the page title.

<?php
$album_id = isset($_GET['album_id']) ? $_GET['album_id'] : die('Album ID not specified.');
$album_name = isset($_GET['album_name']) ? $_GET['album_name'] : die('Album name not specified.');

$page_title = "{$album_name} Photos";
?>

Step 5: Under the code on step 4 above, put the following basic HTML code.

<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title><?php echo $page_title; ?></title>

    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

</head>
<body>

<div class="container">

</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

</body>
</html>

Step 6: We’ll include the Blueimp gallery extension so the we can view our photos beautifully. Our basic HTML code will look like the following code.

<!DOCTYPE html>
<html lang="en">
<head>

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title><?php echo $page_title; ?></title>

    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">

	<!-- blue imp gallery -->
	<link rel="stylesheet" href="http://blueimp.github.io/Gallery/css/blueimp-gallery.min.css">
	<link rel="stylesheet" href="Bootstrap-Image-Gallery-3.1.1/css/bootstrap-image-gallery.min.css">

	<style>
	.photo-thumb{
		width:214px;
		height:214px;
		float:left;
		border: thin solid #d1d1d1;
		margin:0 1em 1em 0;
	}

	div#blueimp-gallery div.modal {
		overflow: visible;
	}
	</style>
</head>
<body>

<div class="container">

</div>

<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->
<div id="blueimp-gallery" class="blueimp-gallery">
    <!-- The container for the modal slides -->
    <div class="slides"></div>
    <!-- Controls for the borderless lightbox -->
    <h3 class="title"></h3>
    <a class="prev">‹</a>
    <a class="next">›</a>
    <a class="close">×</a>
    <a class="play-pause"></a>
    <ol class="indicator"></ol>
    <!-- The modal dialog, which will be used to wrap the lightbox content -->
    <div class="modal fade">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" aria-hidden="true">&times;</button>
                    <h4 class="modal-title"></h4>
                </div>
                <div class="modal-body next"></div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default pull-left prev">
                        <i class="glyphicon glyphicon-chevron-left"></i>
                        Previous
                    </button>
                    <button type="button" class="btn btn-primary next">
                        Next
                        <i class="glyphicon glyphicon-chevron-right"></i>
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>

<script src="http://blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script>
<script src="Bootstrap-Image-Gallery-3.1.1/js/bootstrap-image-gallery.min.js"></script>

<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->

</body>
</html>

Step 7: Inside the DIV tag with a “container” class, put the page title HTML, specify the JSON url and decode the JSON string.

<?php
echo "<h1 class='page-header'>";
	echo "<a href='index.php'>Albums</a> / {$page_title}";
echo "</h1>";

$json_link = "http://graph.facebook.com/{$album_id}/photos?fields=source";
$json = file_get_contents($json_link);

$obj = json_decode($json, true, 512, JSON_BIGINT_AS_STRING);

$photo_count = count($obj['data']);
?>

Step 8: After the $photo_count variable on the code above, loop through the values using the code below:

for($x=0; $x<$photo_count; $x++){

	$source = $obj['data'][$x]['source'];

	echo "<a href='{$source}' data-gallery>";
		echo "<div class='photo-thumb' style='background: url({$source}) 50% 50% no-repeat;'>";

		echo "</div>";
	echo "</a>";

}

5.0 How to Display Likes and Comments?

Coming Soon.

6.0 What People Have Been Saying About This Code?

I’m so glad that other people are delighted by this code, here are some of them!

“The code works beautifully.” – jdogfantastic

“This wonderful tutorial has allowed me to do something totally over my head. Thank you!” – Handy

“Hey this is a great and useful script!” – Konstantinos

“Hi Mike, this is really… really… great work dude. You really helped me out today.” – Paul

“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!!” – Doe

7.0 Download Source Code

You can get the source code by following the whole, step by step tutorial above. But isn’t it more convenient if you can just download the complete source code we used, and play around it?

If you download the source code, you can also get the additional feature of auto-loading more pictures as you scroll down the ‘photos’ page. It can load all the pictures on your album even if it has hundreds of pictures!

There’s a small fee in getting the complete source code, it is small compared to the value and skill upgrade it can bring you, or income you can get from your website project or business.

The price is currently small for a limited time only. DOWNLOAD THE SOURCE CODE by clicking the GREEN button below.

You can get the complete source code, free code updates and free email support from me as well. DOWNLOAD THE SOURCE CODE by clicking the green button below.

Thanks for your support, it keeps this website alive!

8.0 Related Source Codes

Did you know that you can also display other Facebook data to your website? I’ve created tutorials on them too, see the following:

6.1 Display Facebook EVENTS On WordPress or Website

6.2 Display Facebook FEED On WordPress or Website

6.3 Display Facebook VIDEOS On WordPress or Website

6.4 Facebook Scripts

9.0 You Don’t Like Coding?

You don’t have to code to use this feature on your website, what if there’s an easy way? Yes there is an easy way to do it! It will work on ANY website.

I’ve made a demo for WordPress websites, it works on blog posts, WordPress page or widgets. VIEW THE DEMO HERE. Go to the live demo and contact me if you want a 7-day free trial!

The Code of a Ninja Resources

  • Ivan Tinonas

    grabe.. imba ka .. hahaha..

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    Thanks dude! :)

  • http://webandall.be/ Kenny

    Thx, awesome script!

  • Anonymous

    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?

  • Anonymous

    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?

    • http://www.lvshaolin.com/ Kevin Kawada

      Remove any age or country restriction on who can view your page in facebook settings

  • http://www.sgwhois.com/ singapore web design

    how about social graph usage?

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @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. :)

  • http://www.diogo-andrade.co.cc/ Diogo Pessoa de Andrade

    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?

    • http://www.blogger.com/profile/08140105777214904348 Jonas

      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.

  • http://hubpages.com/profile/vivek+dubey Vivek Dubey

    Great.Its working nice.Please also let us know that how can we fetch the profile album.

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    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.

  • Anonymous

    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.

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    Yes, but not yet with FB notes, be updated by subscribing to this blog. Thanks :)

  • http://www.blogger.com/profile/12039350925693305653 Linx

    Hi Mikey, the download link give a redirect loop, and cant get to download the source files :(

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    It works fine with me. But I also encountered that one time, try clearing your browser cache.

  • http://www.blogger.com/profile/16050573004099272528 Siva

    Hi Mike,

    While giving your ownerid it is working .and while giving my id. It is not working. Pls clarify my dbt .

  • http://www.blogger.com/profile/14650129639069779450 GodDanIt

    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 http://www.thebetaspace.com if you want to see it in action. Thanks :)

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @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

  • http://www.blogger.com/profile/14650129639069779450 GodDanIt

    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 :)

  • http://www.blogger.com/profile/12483693266629956643 geenidee

    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

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @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 :)

  • http://www.blogger.com/profile/12483693266629956643 geenidee

    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?

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    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,

  • http://www.blogger.com/profile/12483693266629956643 geenidee

    it works like a charm!
    Thank you!

  • Itai

    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:wampwwwfb-sdksrcbase_facebook.php on line 668

    Any ideas why?

  • Itai

    OK my bad, I forgot to enter the app ID. It works great, thank you!

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    Glad it works for you, you’re welcome Itai! :)

  • 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)?

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    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)

  • Anonymous

    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/ (!)

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    You’re welcome. Good catch @Anonymous! Thanks a lot for that note!

  • Anonymous

    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

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    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.

  • Checker

    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.

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    Thanks Checker, hmmm… Did you go to the menu File > Download Original? That’s on the upper left corner of the download page.

  • Checker

    Thank you!
    I missed that one.

    I will test the script and give feedback!

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    Alright, good luck! :)

  • http://www.blogger.com/profile/11787345398905781615 Richie

    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

  • http://www.blogger.com/profile/11787345398905781615 Richie

    I got it working… YEEEHA!!!

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @Richie: Nice one. :)

  • Anonymous

    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

  • http://www.daylight-music.co.cc/ JP

    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?

  • http://www.blogger.com/profile/15738201368809568335 arcadio813

    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

  • http://www.blogger.com/profile/15738201368809568335 arcadio813

    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

  • Anonymous

    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?

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @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

  • http://www.daylight-music.co.cc/ JP

    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.

  • Anonymous

    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 :)

  • Anonymous

    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.

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      I know this is late but, at least for others, pleas enable CURL extension in your server. Maybe contacting your hosting company will help. :)

  • http://www.blogger.com/profile/16294802289264035095 hkysk8r86

    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.

  • http://www.blogger.com/profile/16294802289264035095 hkysk8r86

    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.

  • stefano

    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?

  • http://www.blogger.com/profile/05646445967855646617 Tosin Orojinmi

    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:wampwwwomafoundationphp-sdkbase_facebook.php on line 1039

    • Anonymous

      How u solve this 102 error Tosin? I am getting same error?
      Help me me Mike & Tosin

  • http://www.blogger.com/profile/08321956999218134746 sologake

    thank you for shating the html codes I applied it thorough blogger edit html and its working …
    Vertical Jump Bible

  • http://www.blogger.com/profile/05646445967855646617 Tosin Orojinmi

    Wao!! its now working on my site, thanks.

    Any idea on how to display comment on each picture?

  • http://www.blogger.com/profile/15614951210277421924 edlaffp

    hi mike, just wondering if your script supports video album on facebook too?

  • http://www.blogger.com/profile/17816023604187509236 byan
  • http://www.blogger.com/profile/03032413405141222914 abhishek

    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

  • http://www.blogger.com/profile/00687290364020208436 chewie41983

    I am getting that same error

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @abhishek and @chewie41983: please check your app id and app secret.

  • Anonymous

    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???

  • http://www.blogger.com/profile/10112306474579973410 Abdul Majeed

    problrm :( please help

  • http://www.blogger.com/profile/10112306474579973410 Abdul Majeed

    problem please help :(

  • AJ

    Thanks man…great code.. works perfectly !!!

    Cheerz,
    AJ

  • http://harpersstatuary.com/ Sam

    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.

  • http://harpersstatuary.com/ Sam

    I got it to work ;)

    Love the script dude. Should be up soon at http://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!!

  • Anonymous

    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

  • Metacowboy

    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

  • moz

    Hi,
    Worked out that I needed to Create A Page rather than use my facebook account photos.
    Thanks,
    Moz

  • franck

    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

  • http://www.glenwheeler.co.uk/ Glen Wheeler

    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

    • http://www.blogger.com/profile/02636206962827518064 Anthony Mosquera

      i have the same problem… do you solve it?

  • Anonymous
    • http://www.blogger.com/profile/14228411709350927260 nummell

      Hi how did you manage to resize all thumbnail????

  • http://www.trivselgolf.com/ Manuel

    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:Hosting6940775htmlFotoalbumFacebookfb-sdksrcfacebook.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.

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    @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. :)

  • http://www.kooldesignfactory.com/ web design services

    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.

  • http://www.caliboweb.es/ CaliboWeb

    Thanks, good code.

  • http://www.blogger.com/profile/07238792683258141291 elgordo

    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

  • http://www.blogger.com/profile/00909581668281217087 Nias

    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:ComplexWebServerhttp_docsjfb-sdksrcfacebook.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”,/^<!–[sS]*?(?:–>|$)/],[“lang-“,/^<?([sS]+?)(?:?>|$)/],[“lang-“,/^<%([sS]+?)(?:%>|$)/],[“pun”,/^(?:<[%?]|[%?]>)/],["lang-",/^]*>([sS]+?)</xmpb[^>]*>/i],["lang-js",/^]*>([sS]*?)(</scriptb[^>]*>)/i],["lang-css",/^]*>([sS]*?)(</styleb[^>]*>)/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!

  • http://plur.com.tw/ billy

    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!

  • http://huntsolutions.com/ David Hunt

    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

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Hi @David, I was unsuccessful when I tried that using this script. Maybe other methods will do..

  • http://www.blogger.com/profile/13580900816374688295 Little Doe Design

    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!!

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      You’re welcome @Doe! :)

  • marcello

    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…

    • http://www.lvshaolin.com/ Kevin Kawada

      add this the the end of the fql ORDER BY created DESC LIMIT 12;

  • http://mensajes-claro.com/ mensajes claro

    I got it to work ;)

    Love the script .

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Nice one! Thanks @mensajes!

  • Derrick

    Can we use this with groups?

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Hi @Derrick! Haven’t tried that. Sorry..

  • http://www.blogger.com/profile/04691954712923781505 Peerawat Iemkhoksung

    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

  • http://www.blogger.com/profile/02486760501087998552 pixelneer

    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.

  • http://www.blogger.com/profile/18150184744265433278 Rathan Kalluri

    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

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      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

  • Anonymous

    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

  • Anonymous

    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

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      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

    • Anonymous

      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 :(

  • Anonymous

    Thank you for the great script!
    its so rare to find something that works on the first go.
    well done!

  • http://tedateo.com/ mensajes claro

    I got it to work ;)

    Love the script .

  • patrick

    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?

    • http://befreewithus.com/photos/ patrick

      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?

  • http://www.blogger.com/profile/01436775834919241041 Patrick Jane

    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?

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Thanks Patrick! honestly, I haven’t tried creating a hack on that feature. Maybe I’d post about that soon.

  • http://www.blogger.com/profile/17316844406426623491 jdogfantastic

    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!

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Thanks jdogfantastic, and to your recommendation. :)

  • Anonymous

    I love it!
    Great job man!

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Thanks, I’m glad it helped. :)

  • http://www.sparkedimage.com/ Paul

    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 @ http://www.havanahookah.net/index2.php

    thanks in advance…
    Paul

    • http://www.lvshaolin.com/ Kevin Kawada

      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.

    • http://www.blogger.com/profile/03522740912796105203 Paul Zmuda

      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);

    • http://www.blogger.com/profile/03522740912796105203 Paul Zmuda

      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 :)

  • http://www.sparkedimage.com/ 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!

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      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. :)

  • Igor

    Thanks you, this post very help me!!!!

  • http://www.xkarlbriggsx.co.uk/ Chris

    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?

    http://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!

  • Anonymous

    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?

  • http://intertech.com.mx/ Intertech

    Great work Mike. Very useful
    Thank you very much!

  • http://www.blogger.com/profile/04775461452756583358 ClubBooking

    Any idea how to do this, but display the images in a gallery on an iphone application?

    Thanks

  • http://www.timdmp.com/ Bart

    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?

  • http://www.blogger.com/profile/13580900816374688295 Little Doe Design

    Just wondering if there is a way to tell the code to exclude a certain album? (ex: unrelated ‘Wall Photos’ album)
    Thanks!

    • http://www.blogger.com/profile/15110698983677798765 Beth Gilomen

      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.

    • http://www.blogger.com/profile/10681792632664637650 xcodeee

      $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

    • http://www.blogger.com/profile/09042013618209736886 Unknown

      @xcodeee – thank you! That’s exactly what I needed!

  • http://www.blogger.com/profile/13580900816374688295 Little Doe Design

    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'”;

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Thanks for posting it here. Something like this will be included in the next version. Thanks again!

    • http://www.blogger.com/profile/09042013618209736886 Unknown

      Very helpful and much needed feature.

  • http://www.blogger.com/profile/02636206962827518064 Anthony Mosquera

    Hi mike… nice code but i have a question… because it is not necessary get an user acces toke to do this?

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Hi Anthony, there’s no need to get user’s token since it works for fan pages only.

  • Anonymous

    Greet work, It solve my problem, Thank you very much

  • http://www.blogger.com/profile/02171414265373571459 Steve189

    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?

  • http://www.blogger.com/profile/01009362454291957892 Daniel Ilicic

    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

  • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

    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

  • Anonymous

    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!

    • http://www.blogger.com/profile/05733400401287031490 Mike Dalisay

      Hi Anonymous, what’s the actual problem? Any error messages?

    • Anonymous

      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!

    • Anonymous

      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!

    • Anonymous

      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!

  • John

    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!

  • http://www.blogger.com/profile/02514124868692421094 Greglim

    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

  • John

    N/M Mike I got it! Thanks for an AMAZING script!

  • fai

    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

  • http://www.blogger.com/profile/02171414265373571459 Steve189

    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.

  • Anonymous

    “102/Session key invalid or no longer valid

    How to solve it?

  • Anonymous

    102: Session key invalid or no longer valid

    How to solve it, Mike?

  • Kevin

    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 :)

  • http://www.chagalog.org/ AllanC

    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

  • http://www.blogger.com/profile/17736977341108949438 Frederick Kuhrt

    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

  • http://www.blogger.com/profile/14138233289064412027 Jessica Iaquilino

    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.

  • Chris

    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.

  • http://www.blogger.com/profile/05636425468933590200 Pawan

    Hi Mike,
    Im getting fatal error at run time

    Uncaught exception ‘Exception’ with message ‘Facebook needs the CURL PHP extension.’ in C:xampphtdocsFacebook_Photofacebook.php:4 Stack trace: #0 {main} thrown in C:xampphtdocsFacebook_Photofacebook.php on line 4

  • http://www.blogger.com/profile/12992317459388806323 Melanie Onesti

    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.

  • http://www.kylepasciutti.com/ Kyle Pasciutti

    I don’t see anyone else having this problem, but I’m having a 500 Internal Server Error while trying to run this code… Page is: http://zombieleader.com/gallery/test/ Funny thing is, I have this exact code working beautifully on another page… I’ve tried changing the PHP permissions for the page in question, but still no luck. Any help would be most appreciated!

    • ninjazhai

      @mikavlimki:disqus and @KyleP555:disqus , would you show us your code? So we have some clues debugging it..

  • Pingback: Google