Mobile: Render image in Markdown It plugin?

Development Plugins
1

Is it possible to render an image in the viewer from a Markdown It plugin? I have the ressource id and I need a way to convert this into an html image. I got it to work on desktop by inspecting what the src is in a normal image in Joplin (joplin-content://note-viewer/<path>), however this doesn't work on mobile.

Is there a way to do this on mobile?

I've searched a lot for different solutions but most plugins that handle images are desktop-only, so I haven't found any plugin that deals with images on mobile.

2

Why not add the resource to the note text? Then it will render it the usual way

3

lt's a dynamic overview of the frontmatter in other notes and I want to support images in that frontmatter. So adding it to the note text isn't really an option, since it wouldn't be dynamic anymore.

4

What kind of images? Depending on what it is you could always encode them as base64

5

Thanks for the suggestion, I haven't tried that before.
With the help of ChatGPT I got it to work on desktop, but the solution uses the fs module to get the file from the ressource path, which isn't possible on mobile. Is there something I'm missing to get it to work on mobile?

6

It would help to know what you're trying to do

7

Okay sorry, I'll try to be clearer.

I have YAML-based frontmatter in a note like this:

---
title: Book title
cover: ![](:/<resource_id>)

---

And I'm writing a markdown it plugin that searches for notes dynamically, parses their frontmatter and renders the results in a table:

title cover
Book title <image>

I want to add custom support for images, so that they render correctly in the HTML table, which means I need to convert the images into HTML based on the resource_id. I've gotten it to work on desktop, but mobile proves to be more difficult and I'm thankful for any help with that.

8

Is ![](:/<resource_id>) a real Joplin resource? In which case the file should be present in the filesystem and you should be able to display it, even on mobile.

How did you get it working on desktop exactly? Using the data API you can get the path to the resource file: Joplin Data API | Joplin