Display files from Google Drive and Dropbox
Display images, PDFs and other files from your cloud storages (Dropbox, Google Drive, etc.)
To use and display the images and files in UI Bakery from cloud storage, they need to be converted. Let's check the example of displaying images from Google Drive in the Table and a PDF file from Dropbox.
To use images from Google Drive in your table, it's important to convert the link to them following the pattern:
https://drive.google.com/uc?id=FILE_ID
File_id can be obtained from the image URL itself:

Getting the image id from the link
Here is a sample of a resulting link: https://drive.google.com/uc?id=1XpRlCnpAyA0_dDBjtLFQqRdH8XxCJjA5. This link should be included in your data source.
Please note that the link to the image will be recognized by the system as a Link field type, so in order to display the final image, change the field view type from Link to Image.

To display PDFs from your Google Drive, follow the below steps:
- 1.Obtain a Google Drive link to a necessary file and transform it using the pattern:
https://drive.google.com/uc?id=FILE_ID
File_id can be obtained from the file URL itself:

3. Modify the result with:
return {{ data.base64}}

4. Drag PDF Viewer onto the working area and assign the newly created action to it.

Dropbox links need to be modified in the following way:
- 1.Obtain a dropbox link to a necessary file - https://www.dropbox.com/s/n2gq6ordzbhgenk/test.pdf?dl=0
- 3.The received PDF link can be used in the PDF viewer component
Last modified 1yr ago