STARIKOVS

I’ve tried to create an image gallery with help of Galleria that gets photos from Picasa album but it does’t work when following an official Galleria manual. So, here’s my example of how to force it work.

Download Galleria

You can download galleria from the official site galleria.io. Create a folder named galleria_picasa and unzip Galleria into galleria_picasa/galleria, so that galleria-1.2.8.min.js will be available at the path galleria_picasa/galleria/galleria-1.2.8.min.js.

Create index.html and include scripts

Create index.html to be accessible at galleria_picasa/index.html.

Galleria utilizes jQuery, so it’s necessary to include jQuery script before others. Then include Galleria script and then the script of Pisaca plugin.

<title>Create an image gallery using Galleria and Picasa</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script src="galleria/galleria-1.2.8.min.js"></script>
<script src="galleria/plugins/picasa/galleria.picasa.min.js"></script>

Notice that you should use the right path to Galleria Picasa plugin! In my case, it’s galleria/plugins/picasa/galleria.picasa.min.js. It’s different in previous Galleria versions.

Create markup and styles for gallery

At this step, it’s time to create a DIV for the Galleria. Also, you can style Galleria’s HTML as you want with help of CSS.

<style>
    #gallery-example {
      width: 700px;
      height: 400px;
      background: #000;
    }
</style>
 
<div id="gallery-example">
</div>

Add script for Galleria

Add script to initialize Galleria and specify some options for Picasa.

<script>
Galleria.loadTheme("galleria/themes/classic/galleria.classic.min.js");
Galleria.run("#gallery-example", {
  picasa: "useralbum:110623521271153614238/Test",
  picasaOptions: {
    sort: "date-posted-asc"
  }
});
</script>

It’s very important to spcify the right user name and album name. To do this, just copy it from the Picasa album URL:

https://picasaweb.google.com/110623521271153614238/Test

This part of URL is what you need “110623521271153614238/Test”.

Make your Picasa album available to all the internet

Your Picasa images will be showed in Galleria image gallery only if the Picasa album is available to all the internet. So, check to rights of the album.