Fetch Picasa or Google Plus photos using jQuery

In this post, I am going to share a jQuery plugin called "Pimax" which allows you to fetch photos from Google+ or Picasa account. Pimax displays a photo gallery from your Picasa/G+ albums. The Public albums are pulled from your account and displayed on your website. You can add a public album or add some images to your G+ account; it will be reflected on your website with this plugin!

Related Post:

• Fetch photos from Picasa using jQuery
• Fetch photos from Flickr using jQuery
• Top jQuery Photo Tagging Plugins

Features:

• You can customize width and height of the widget on your website. - columns for the thumbnails can be customized (Example: you can now have a 3/4/5-column layout for the pics displayed.)
• The widget itself is responsive; given a width or % for the widget, the inner contents will re-size accordingly.
• Parts of the plugin like header/tabs can be hidden as per requirement.

How to use:

Put below javascript code on your page. Specify Google User Id in a piece of javascript as shown below. Ex: jquerybyexample@gmail.com.

OR You may also enter your Google+ profile URL.
Ex: http://plus.google.com/110764258896584230255.

 var googleUserName = "jquerybyexample@gmail.com"; 
 // or use "http://plus.google.com/110764258896584230255/photos"
 //optional parameters-----------------------------------------------
 var albumNames = ["BlogPictures","Blog Pictures"];
 var pathToLoadingImage = "./loader.gif";
 var pimaxColumns = 3; 
 var pimaxWidgetWidth = 900;
 var pimaxWidgetHeight = 1000;

Include the jQuery plugin if not done already. Now, include the plugin pimax.min.js before the end of your body tag. Add a div element. This div will contain the Pimax widget and display your Albums and images. That's it..You are done!

<div id="pimax"></div>

You can find out the description of these variable define in above code at their official website.


Feel free to contact me for any help related to jQuery, I will gladly help you.