Facebook Photo Gallery Plugin With jQuery - fbGallery
File Size: | 350 KB |
---|---|
Views Total: | 4645 |
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.