# Loading images in Markdown node

**URL:** <https://discourse.nodered.org/t/loading-images-in-markdown-node/89292>\
**Category:** Dashboard\
**Tags:** node-red-dashboard\
**Created:** [5 July 2024 08:23 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292 "2024-07-05T08:23:20Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Zugarfot](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@Zugarfot](https://discourse.nodered.org/u/Zugarfot)\
**Post date:** [5 July 2024 08:23 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/1 "2024-07-05T08:23:20Z")

</div>

Hello everyone!

I was trying to visualize an image with markdown, but I am unable to create a link to the image. Using the absolute path to the image did not work.

Node content:

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/d/4/d45a9df7706f2bda993d0bc1ff6964e8ed75e981.png)

Result:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/f/1/f16968a662dd726775a5570fdd32a66d04950ba7.png)

File Path:  
 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/9/499c8b0670ef3a5fdb26c8389da0ae3cd5f758c1.png)

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [5 July 2024 08:40 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/2 "2024-07-05T08:40:42Z")

</div>

Have you tried double back slashes `\\`, as `\` has special meaning in node-red `escape following char`  
Or use forward slashes as they are allowed in windows.

---

<div class="post-metadata">

**Author:** ![Zugarfot](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@Zugarfot](https://discourse.nodered.org/u/Zugarfot)\
**Post date:** [5 July 2024 08:45 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/3 "2024-07-05T08:45:06Z")

</div>

Both suggestions did not work.

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [5 July 2024 08:54 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/4 "2024-07-05T08:54:23Z")

</div>

Show us what you typed.  
Can you access the image direct in browser using ip:1880/file/path/name.png?  
Have set up a httpStatic folder to serve files from, this may be easier to serve using /path\_from\_static/name.png  
[https://nodered.org/docs/user-guide/runtime/configuration#runtime-configuration](https://nodered.org/docs/user-guide/runtime/configuration#runtime-configuration)

---

<div class="post-metadata">

**Author:** ![Zugarfot](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@Zugarfot](https://discourse.nodered.org/u/Zugarfot)\
**Post date:** [5 July 2024 10:19 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/5 "2024-07-05T10:19:48Z")

</div>

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/7/3/735ec72c9d0c14435600230d0af13bea1a8cfdf4.png)

![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/8/f/8fdf906737dc5ccb3bccc6ade84ae75f5375eb9e.png)

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/4/4/44318135e48743037105267aec3ef634cf85e713.png)

I'll try the with the httpStatic config and let you know

---

<div class="post-metadata">

**Author:** ![Zugarfot](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@Zugarfot](https://discourse.nodered.org/u/Zugarfot)\
**Post date:** [5 July 2024 10:53 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/6 "2024-07-05T10:53:01Z")

</div>

Setup the file path and still didn't work. I also tried with double backslashes

 ![image](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/b/a/ba7fe8ebe6f7c9c21f671b0bfded9b53d6773c0d.png)

---

<div class="post-metadata">

**Author:** ![E1cid](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/e1cid/32/77971_2.png) [@E1cid](https://discourse.nodered.org/u/E1cid)\
**Post date:** [5 July 2024 11:02 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/7 "2024-07-05T11:02:08Z")

</div>

I am not a windows user.

My httpStatic is in my .node-red folder in a folder called static. I then put all files i wish to server in there.  
example in static there is a files folder, in that folder is test.png.  
The markdown is  
`![image](/files/test.png)`

You may have a permissions/firewall issue, hopefully a windows user may know more.

p.s. Please paste text in forum, images of text are hard to copy.

---

<div class="post-metadata">

**Author:** ![arturv2000](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/arturv2000/32/88724_2.png) [@arturv2000](https://discourse.nodered.org/u/arturv2000)\
**Post date:** [5 July 2024 11:31 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/8 "2024-07-05T11:31:29Z")

</div>

In windows we need to use double slash...

```js
httpStatic: 'C:\\Users\\user\\.node-red\\public'

```

In the markdown node use:

```auto
![Image Text](/test.png)

```

or

```auto
<img src="/test.png" alt="Test">

```

In this case, the real path (on disk) for image is `C:\Users\\user\.node-red\public\test.png`.

This works when accessing the dashboard locally (127.0.0.1)

---

<div class="post-metadata">

**Author:** ![Zugarfot](https://avatars.discourse-cdn.com/v4/letter/z/9de053/32.png) [@Zugarfot](https://discourse.nodered.org/u/Zugarfot)\
**Post date:** [5 July 2024 11:38 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/9 "2024-07-05T11:38:28Z")

</div>

Thank you both. This configuration worked for me!

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [19 July 2024 11:38 UTC](https://discourse.nodered.org/t/loading-images-in-markdown-node/89292/10 "2024-07-19T11:38:44Z")

</div>

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.