How to embed a Google Photo album into your site using an animation

Submitted by Nicola Rainiero on 2017-01-31 (last updated on 2017-02-01)

This article is addressed to orphans of Picasa Web Album and its practical function to put an album slideshow in a web page, not to mention the useful filter for Drupal and CKEditor that with a special tag allowed you to embed a specified album without using HTML. Google Photo has replaced this service and does not allow it anymore, but with several steps you can create an animation that can be easily embedded. Let's see how.

Starting from may 2016, Picasa1 was stopped and the collected photos were moved to Google Photo, a new service with less features but with an interface more easy to use. Among all the functions, there was one that I had started to use just before the service was closed: the embedding. I just wanted to share some photos without keeping physically in my website (to save bandwith and space!). I liked very much the slideshow effect and the possibility to incorporate it in my website.

Besides in Drupal 7 there was a fantastic module (Picasa Slideshow Input Filter) that provides an input filter to add a Picasa Webalbum slideshow anywhere, in this manner:

[picasa_slideshow id=5899711285577579185]

where the number was the id of the webalbum in Picasa.

I had tried for a while to embed my album in Google Photos through the use of iframe and the shareable link of the album but the result is always a gray screen.

After googling I found two tips that helped me alot:

Mixing them I have obtained a satisfying solution for me that I want to share with you.

How to embed a Google Photo album into your site using an animation

Limitations

Compared to the albums shared with Picasa, there are some restrictions that it is better to highlight:

  • 50 photos maximum;
  • this is only a gif animation, not a real slideshow;
  • the animation delay (750 ms) is fixed and you need to change it manually using external software or other webapps.

My procedure

Probably it is not the only one, but if you want to create a simple animation that rapresent a series of photos like a slideshow, you can do so:

  • in Google Photo select the photos;
  • create the animation with them;
  • open the animation in Google Drive and create a public link;
  • open the link in a new window;
  • click on the "Embed item" in the menu at the top right of the screen;
  • copy the code and paste it in the HTML source or by your editor using the source button.

Gallery

In the gallery below I summed up the process with some screenshots.

  • 1. Picasa was an image organizer and image viewer for organizing and editing digital photos, plus an integrated photo-sharing website, originally created by a company named Lifescape (which at that time may have resided at Idealab) in 2002. In July 2004, Google acquired Picasa from Lifescape and began offering it as freeware. "Picasa" is a blend of the name of Spanish painter Pablo Picasso, the phrase mi casa (Spanish for "my house") and "pic" for pictures. Picasa. (2017, January 26). In Wikipedia, The Free Encyclopedia. https://en.wikipedia.org/w/index.php?title=Picasa&oldid=762141171


Related Content:

Nicola Rainiero

A civil geotechnical engineer with the ambition to facilitate own work with free software for a knowledge and collective sharing. Also, I deal with green energy and in particular shallow geothermal energy. I have always been involved in web design and 3D modelling.

Add new comment

The content of this field is kept private and will not be shown publicly.

Plain text

  • No HTML tags allowed.
  • Web page addresses and email addresses turn into links automatically.
  • Lines and paragraphs break automatically.
CAPTCHA
This question is for testing whether or not you are a human visitor and to prevent automated spam submissions.