Facebook Photo Gallery Plugin With jQuery - fbGallery
| File Size: | 350 KB |
|---|---|
| Views Total: | 4660 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
fbGallery is a very small jQuery plugin for Facebook API that fetches public photos from any Facebook Page and displays them in a beautiful grid gallery with image lightbox integrated.
How to use it:
1. Load jQuery library and the fbGallery plugin's files into the html file.
<link rel="stylesheet" href="fbgallery.css"> <script src="//code.jquery.com/jquery.min.js"></script> <script src="fbgallery.js"></script>
2. Set the Page ID, Access Token and Excluded Album ID as follows:
var appId = 'APP ID'; var pageId = "PAGE ID"; var excludedAlbums = ["Album ID 1","Album ID 2"]; var accessToken = 'Access Token';
3. The JavaScript to initialize the plugin and generate the Facebook gallery inside a container element:
window.fbAsyncInit = function() {
FB.init({
appId : appId,
xfbml : true,
version : 'v2.8'
});
FB.AppEvents.logPageView();
$("#gallery-container").fbGallery({
accessToken: accessToken,
pageId: pageId,
excludedAlbums: excludedAlbums,
});
};
4. Don't forget to load the Facebook Javscript SDK:
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
This awesome jQuery plugin is developed by friendsocial. For more Advanced Usages, please check the demo page or visit the official website.











