Embedding Images in HTML Documents

I am using DPTO to develop content for an application consisting of a collection of small HTML files that use standard code for linking images:

If you are new to HTML formatting, you can use this sample as a guide, to see how the various tags work.

You can even include an image - just put the image into the same place in iTunes file sharing as these entries.

Currently I get the “?” icon indicating the image cannot be found, even though it is in the same group/folder as the HTML file. Where does DTPO store image files for web sites? Will this code even work inside DTPO?

Many thanks for your help.

Regards,

Michael

The problem with the code is the address for the image. Documents in databases are stored in a complex hierarchy of files – take a look inside a database package in the file system and you’ll see a folder “Files.noindex”, deep within which are the image files.

So, where you thought the image was at


src="Sample Image.jpg"

it is actually at


/~/Documents/DEVONthink Databases/Testing 20140417.dtBase2/Files.noindex/jpg/7/Sample Image.jpg

This isn’t helpful for what you want to do – and not portable either.

So, I think the best alternative is to make your file as an RTF file, add your images, formatting, etc… Save that file. And then use Data > Convert > to HTML. You will get an HTML file that has the image embedded as binary data. That will be very portable.

The second alternative is to store your images in a folder outside of DEVONthink, and use the path to the image in the file system. This is a bit more time consuming, and you have to be careful with paths and with exporting your HTML to ensure the links are maintained.

Korm,

Thank you for a very clear explanation. I will give that a try and let you know if it worked and translated to the app.

Many thanks!

Michael