Dropbox Image Embed in HTML Component

Has anyone got an embed of an image working of an image from a DropBox link?

The source image file lives in DropBox.
I generate* a public share link, e.g. https://www.dropbox.com/s/3zfdmmrnfe2e63s/dsc_XXXX.jpg?dl=0 (link obfuscated for privacy reasons) and store that in my database.

I’m trying to embed that into and HMTL component in a pop-up detail view using something like this…

I have created an app and I put the javascript in the tadabase page as instructed (https://www.dropbox.com/developers/embedder) but I’m still not coming right.

Has someone got this (or something similar) to work perhaps?
Or is there another way to do this (aside from me saving* a smaller version of the file in my ‘database’ and using that file to display).

PS:* I’m using integromat to do much of the heavy lifting between DropBox and Tadabase.

Hey @brettlewis,

I tried using the dropbox embedder and did not have any luck BUT there is a much easier solution…

By placing your share link inside of an <img> tag, and modifying the URL slightly, you can embed an image without the use of the embedder.

I followed this video:

1 Like

Many thanks @tim.young - let me give that a try.

1 Like

With a little tinkering I got it to work.

I created another image URL - I removed ‘dl=0’ and appended ‘raw=1’ and I used this HTML…

<p><img src="{!!Link to DropBox Raw!!}" alt="" height="600" /></p>

1 Like