Wednesday, August 28, 2013

How to show pictures from Google Plus in any website

This article shows how you can make a slideshow of all the photos from an album in your own Google Plus Photo collection, which can be shown on a website or blog.


Sharing a photo album from Google+ Photos

Google's help-pages note that you can share a Google Photos album using a link - and is a good option for showing your photos to people who are outside of Google+.

But what are the options if you want to show a Google Photos album, not just an individual picture, in your blog or website?
  • Put the link in your website. But that just gives bland, boring text, like click here to see my photos.
  • Put one picture in your website, labelled "click this photo to see the rest", and link it to your Google Photos album. But that just shows one photo - and it takes people away from your website when they go to view your photos.
  • Load each photo from the album individually to your website. That's fine for 2-3 or even 10 photos. But what if you've got dozens or even hundreds - it could take hours!

A better option is to use an embedded slideshow.

To do this, you need to get a small piece of HTML code from Google, and put it into your site. Then when someone looks at your site, the code runs and they the see a slideshow made of the photos your album at the current time.   This means that the pictures on the other website are automatically updated when you change the album in Google Photos (eg when you add, change or remove pictures).

Unfortunately there is no tool to make this type of slideshow code in Google Plus Photos at the moment.

But there is was a very simple work-around which gives you get the code that you need, using existing Google tools.

Using Picasa-web-albums to get the slideshow code

If you have loaded pictures into Google Photos, then you can manage them using either Picasa-web-albums (ref: What is Picasa vs PWA?) or Google Photos.

So, to get the embeddable slideshow display code for a photo album:
  • Navigate to the album that you want to make a slideshow for.
    NB  you need to be viewing the album, not the page of all albums, to get the correct code.
  • Make sure that the security for this album is set to at least "anyone with the link".
  • Choose Link to this Slideshow and then Embed album from the right side bar
  • Copy the HTML code that is provided

What your readers see

Readers using a regular web-browser with Flash enabled should see a slideshow of your pictures.

Readers whose device (eg cellphone, tablet) isn't able to show Flash graphics will most likely just see a black square instead of the album - possibly with a message telling them why this is happening.



Related Articles

What are Picsasa and Picasa-web-albums

How to put 3rd party HTML or Javascript into your blog

Understanding Google accounts

Putting a Picasa-web-albums slideshow into a blog post or website

Share this Article

URL:

HTML link code:

BB (forum) link code:

Subscribe to Blogger-hints-and-tips

FeedBurner will send a confirmation message. Click the verify link in it to start your subscription.

Follow Me on Pinterest Subscribe to Blogger-HAT on Google + RSS subscription icon Follow BloggerHAT on Twitter

3 comments:

  1. my blog post can't auto update (Reading list - follower) since 5 month ago.
    :(
    anyone can help me solve this problem ?

    ReplyDelete
  2. Doesn´t work anymore. Google redirects anyway, even with noredirect in the URL. It goes to even more useless site than Google Photos.

    ReplyDelete