How to Display Images on Dynamic Blocks Using Google Drive URLs

Many of you know that after recent Google changes, the old format of image URLs hosted in Google Sheets and mapped to the image fields on Softr blocks no longer worked. However, we have a workaround. It turns out there is a URL format that works.

The image URLs must be in this format: https://drive.google.com/thumbnail?id=xxxxxxxxxxxxxxxxxxxx&sz=s4000, where instead of x’s, you need to replace your image ID.

To illustrate better, here is an image URL that I’m going to use: Boxlab10.jpg - Google Drive.

The image ID in this URL is what is between /d/ and /view: 1LLYIFs5eh9deM09d6JeVMqArrRZBh0aZ. So the URL that I need to use for this image will be https://drive.google.com/thumbnail?id=1LLYIFs5eh9deM09d6JeVMqArrRZBh0aZ&sz=s4000.

I will then add this image to my Google Sheets base and map it to the image field where I want the image to be visible.

3 Likes