Display Images From Google Drive Folder

I am trying to find an example on how to use JS on a webpage to call a list of renderable image links from a specific Google Drive folder. This is for the creation of a slideshow f

Solution 1:

By render-able image links, I assume you mean images that just render in as opposed to just an image link. (kind of got confused a bit by the wording)

If you want to grab an image from google drive and display it on your site, there is a method you have to undergo to do so.

METHOD What you want to do is find the image in your google drive and right-click it and press the, 'Share' button and once you've accessed that menu, open up 'Advanced', which should be in the bottom right corner of the pop-up. From here you should see a share link similar to the one listed below.

https://drive.google.com/file/d/<LONG-ID>/view?usp=sharing

Also on this pop-up, make sure to ensure that the Private image sharing is changed to, 'On - Anyone with the link'. Press 'Done' on that menu.

Next what you need to do is copy the following link:

https://drive.google.com/uc?id=

Then you need to copy the from the original link and paste it after 'id=' in the one listed above.

It should look something like this:

https://drive.google.com/uc?id=<LONG-ID>

And that's pretty much it to my knowledge. I've used this a couple of years back when I was creating a JS banner for a web-page and it worked fine but you have to keep in mind that it does not produce a .jpg or .png link, even so it will work in most cases. I don't think google will have changed their system too much, but if they have, give me a notification and I'll try to see if there's a more recent solution.

I would strongly recommend just downloading and embedding the images into the web-page or using a service such as Imgur as the execution and process is so much simpler.

Have a nice day!