Can Markdown Preview show local images?

Is it possible to use local images (iCloud Files, Dropbox, other?) in Drafts so that the Markdown Preview action shows the image in the preview? For example, if image 1234.jpg exists in the Drafts folder in Files, then something like this in Markdown to render an image in preview:

![Local Image](\images\1234.jpg)

I know we can access local files in iCloud Files with the FileManager object, just curious if there is a way to preview images with Markdown too.

Unfortunately not. How would you address them as there isn’t a file store as such? (Unlike Editorial, which maps part of Dropbox.)

I was thinking it could assume the Drafts folder was the top level folder in the Files app like it does for the FileManager action with Javascript (reference). I know we can read files from that location, would just be cool if we could show images from it too.

I’m not necessarily recommending the approach, but…

If you had an action that processes the Markdown, reads in the image placeholders, then reads in the corresponding file, converts it into base 64, substitutes that as base64 image HTML back into the Markdown for the corresponding image, then converts that whole Markdown content into HTML and then previews that. I think that might technically work.

1 Like

Drafts can only use the hosted image links (Dropbox, iCD, etc) as far as I know.

This approach has been in the back of my mind…terrifying and taunting me. I see that we have the same nightmares. :slight_smile:

This is the only reason I still have Bear on my phone. :(:tired_face:

1 Like

Am I missing something here?

To me it seems that

[My image](/Users/pdl/Desktop/img.jpeg) works as well as
<img src="file:///Users/pdl/Library/Mobile Documents/iCloud~com~agiletortoise~Drafts5/Documents/Library/Templates/Graphics/logo.png" width="150" alt="Logo"> in a template with style sheet.

The images does not show up in preview but when you e.g. print the preview to a pdf document.

The first entry you have is a Markdown link rather than an image, it’s missing a leading exclamation mark. When changed to be an image, this would have no chance of working on i*OS devices that have no Desktop, but it would reference a file on a Mac … though in my test I couldn’t get it to show in the Print using either no protocol or file. I don’t know if I’m missing something that you did or are proposing.

The HTML markup works for me in the in-dialog print preview on the Mac, but as noted, not in the action-based preview, which is what the thread has been about. Trying the same thing on i*OS, everything is going via actions so I wasn’t able to get the image to work on this.

Sorry, I forgot the exclamation mark in my example, but had it in Drafts!

There is one peculiar thing though. Drafts seem to “forget” the link e.g. when I close and reopen the app on macOS. No, sign of an image. Then, when I drag the link from Alfred again to Drafts window the image is (re)inserted.

What I find very strange is that the link seem to be exactly the same path before and after reopening Drafts. The preview window looks the same (with no image but a symbolic icon that is replaced with the image in the print dialog). Also, it doesn’t help pasting the path but when I drag it from Alfred or Finder all of a sudden the other links are replaced with the image (that was not there before).

You’re right, I didn’t care very much about iOS at this stage. However, I tried this link but was not as lucky,

~/Library/Mobile\ Documents/iCloud~com~agiletortoise~Drafts5/Documents/Library/Templates/Graphics/logo.png

I guess I have to keep my graphics in a local folder so far. I haven’t tested it but am in a process of writing some document and hope that I can get all images printed (to pdf) if they all work at the time of writing and then by dragging one of them when I need to generate the pdf.

Well, I just noticed that if I enable Marked app streaming preview support the images are shown in Marked 2 but not those in iCloud.

The below is due to sandbox security. If you drag a file to an app, that app is given permission to access the path as you have taken explicit action to allow it, but that permission is temporary and does not persist beyond the current session.

1 Like

Ah, I see, thank you for this well-informed explanation. I can live with that, especially if dragging once gives permission to the other files (as it appeared yesterday). Of course I would like to grant Drafts permanent permission if possible, but haven’t found out yet and maybe it’s not possible.