How can I do embed my shared album from Google Photos and make preview of images on my website? How can I do that simply, without having to copy pictures or complicated search to individual image links? Here I will introduce my solution, which you can also try.
Three steps how to do it.
When I wanted to present my photos public on the web, I found out that there was no easy way to do it, in fact, there was no reasonable way.
You can embed yours shared photo album from Google Photos with the code that generates a preview of your entire album with the ability to view photos easily.
1) Get album public link for sharing
In Google Photos application, you must share selected album and get link of it. Choose album – click on menu icon or open album and click on share button and select “get link”. Link look like as
https://photos.app.goo.gl/somehash. Copy this link into clipboard.
2) Create code to embed album
All you need is a link from previous step. Insert to field and press “Create embed code“.
I created tool to basic manage of created code. You can setup dimmensions and some options about component. When you finish, copy result HTML code into clipboard. This code is a final stand alone HTML code – no proxy, no iframes. The only one external component is a “Player” decorator.
See how to make code in Reabr app:
You can find the new version as an extension in the Reabr – online booking manager application.
See how to easily use Reabr to generate gallery embed code in the following post:
How to embed Google Photos album using Reabr.com application
Extracted photos from shared link are not permanent. If you want to generate permanent public photos you can try to copy photos into Public album photo sharing. See more at www.publicalbum.org. If you have any question, contant me.
3) Paste code to your website
Complete code, paste to your site. That’s all.
If you need process some change, such as add new photos, you must create new code of album. I will try to solve this problem in some of the following versions.
Good to known
If you decide not to share the album, just stop sharing it in Google Photos and the photos will not be available anywhere else.
If you want to embed single Google Photos image, you can use my another tool to do it. Perfect for blogs and single image view.
For WordPress users I have prepared a Worpdress Google photos plugin for easy to use in your posts using shortcodes.
Now is available to use Carousel widget to create slideshow with autoplay.
Since version 1.2.32, widgets support videos, see to how make video slideshow for website.
35 thoughts on “How do I embed a Google Photos album into a website?”
thanks. this looks really useful.
Is there any way for it to show the description of each photo that was added in google photos?
Not now, sorry. I’m preparing a tool to solve it.
Thank you – This is an amazing tool! I’ve tried numerous ways to embed Google Photos albums into my sites, and this is by far the easiest, and also the smoothest, player that I’ve been able to find. Images load quickly and it plays nice with Bootstrap responsiveness.
Question: I can’t seem to make the player window any bigger than 480px tall – is there an option that I’m missing?
Keep up the great work – and thanks again!
Many thanks Nick. It was a bug. I fixed it.
How many photos can be added. I am getting only 500 photos in my 2000 photos album?
Now it’s not possible to grab more images.
This is the limit of the current method of processing.
Thanks so much … works wonderfully.
Good job, great!
Thanks for making a useful tool.
So cool! I’ve used it for our event website and it looks great: https://stemgamechangers.github.io
Thank you! It’s fantastic!I’m so happy, that it is again possible to make slideshow from a Google Photos album. It’s works!
BUT how can be used the “Autoplay slideshow at start” function??? It would be perfect, even if that would be also functioned.
Hi Kinga, autoplay not allowed in current version. I preparing new revision and stand alone carousel component with autoplay. Thanks for patience.
Thank you! Please let me know when it’s done. I would be so happy if it would work again as it used to be.
Dear Pavex! I would like to inquire if the “Autoplay slideshow at start” function is already available. Thank you in advance for your reply!
Hi Kinga, yes, now is available in Carousel widget, Check this https://www.publicalbum.org/blog/embed-photos-slideshow-carousel-widget
Good job with the carousel with autoplay!
Thanks Lowmax 😉
Well done indeed. Excellent player and controls. Love the responsiveness and load speed. Keep up the good work!
Many thanks, Ray
Does this support videos that are in a Google photo album?
Hi Mark, not in this revision. In some of the next releases, I want to support spherical pictures and videos.
This is super useful! Thank you!
I wrote a step-by-step tool instruction for Chinese user here in my blog. If that’s ok?
Hi Andylain, it’ very cool, thanks. If some updates will be available, send info to you. Regards, Pavel
Hi. It’s great. What about plugin for WordPress. I’ll buy it.
Hi Vitaliy, WordPress available here /blog/wordpress-google-photos-album-plugin, it’s free to use 😉
Hi, it’s a super useful tool and I built my whole website around it.
But somehow it isn’t working anymore.
I’ve tested it in multiple browsers on multiple devices and even the code creator tool on your site won’t display anything anymore.
Hi Niklas, I made a mistake in the last update (v.1.2.2) :/ I apologize to everyone. I trying to solve it.
Outstanding work, I’ve wanted something like this for so long and this makes life so much easier. Many thanks Pavex, cheers!
Thanks Tim 😉
I really love this tool. It is the best gallery player I have seen. However I cant get the embed to work the way I want it too. I have this problem with other embeds so am not sure why this issue occurs but it is something all gallery embeds share. When I use the gallery player on my webpage it works perfectly, however when I try using it inside a popup button it fails to work. I have tried getting support on this issue but no one seems to know why this happens.
Does anyone know how to get this embed to run correctly inside a popup. I am using magnific popup for my popups, I have tried simple popups and they still dont work.
Hi Nicolas, see this example https://www.publicalbum.org/examples/bootstrap-modal1.html
Hi! Great generator to embed a Google Photos album to web site! Do you have plan for the AMP?
Hi Yusuke, AMP is a good idea. Now i trying write code very small, optimized and fast. Maybe better way such as amp. Can I try something with AMP UI.
Thank you for this great tool.
Any idea how can I remove the black border on top and bottom? Check the reference here – https://i.imgur.com/66nud2Q.png
Hi Maloy, Many thanks. Yes, change dimmensions or set data-background-color=”transparent”.
There is the problem. The iframe with photos is not scrollable on mobile