Page 1 of 1

[Markdown] How to support relative image links when exporting

Posted: Tue Nov 28, 2023 11:49 am
by davidjimenez75
One problem on "auto-exporting" markdown comments to .html with images, is there any possibility to allow relative links to images/files?

The exported report.html have links to images hardcoded to the real path folder, so they dont work is you open the .html on web server urls ( For example: http://192.168.1.102/todolist/projectname/todolist.html )

The report.html show the link to the images like this:
```
<img src="file:///T:/projectname/test.jpg" alt="img">
```

I have a shared folder on Linux with project folders + multiples taskslists per project on a intranet with SAMBA and a web server for the visualization in realtime of the .html reports (great combo for small bussiness with multiple people working on projects).

This img urls links will be compatible with HTML on webservers and local opened files "reports.html":

```
<img src="./test.jpg" alt="img">
<img src="test.jpg" alt="img">
```


My testing results on SAMBA + APACHE2 ( Mounted as virtual drive T:\ to a samba intranet server \\192.168.1.102\todolist\ )

----
### MARKDOWN2HTML - Test with images forcing the HTML code IMG on the markdown

- ERROR on markdown previsualization
- OK opening the .html on a web server
- OK opening the .html locally

<img src="./images/test.jpg" alt="test">
<img src="./test.jpg" alt="test">
<img src="test.jpg" alt="test">

----
### MARKDOWN2HTML - Test with images in markdown format

- OK on markdown previsualization
- ERROR opening the .html on a web server
- OK opening the .html locally

![img](./test.jpg)
![img](.\test.jpg)
![img](test.jpg)
![img](./images/test.jpg)
![img](images/test.jpg)

Re: [Markdown] How to support relative image links when exporting

Posted: Fri Dec 01, 2023 9:11 am
by abstr
davidjimenez75 wrote:
Tue Nov 28, 2023 11:49 am
is there any possibility to allow relative links to images/files?
Possibly, if you can help me find a solution...

The reason I now convert relative image paths to full paths was to make relative images work in the editor.

This is a well-known problem.

One idea might be to always convert the markdown content to a physical file so that when the preview browser loads the content it has the necessary context to figure out the relative paths.

I'll give it some more thought...

Re: [Markdown] How to support relative image links when exporting

Posted: Fri Dec 01, 2023 7:21 pm
by davidjimenez75
The problem is only when we view the exported .HTML over a Web Server so maybe this option will do the trick:

- Preferences > Importing/Exporting: [x] Export Markdown relative image links

Option not activated by default (by default export markdown images as "file:///" )

Markdown examples (both works OK in markdown preview)

```
![img](test.jpg)
![img](./images/test.jpg)
```

By Default export markdown to HTML images urls as:

```
<img src="file:///T:/test.jpg" alt="img">
<img src="file:///T:/images/test.jpg" alt="img">
```

With that option activated Markdown to HTML images urls as:

```
<img src="test.jpg" alt="img">
<img src="./images/test.jpg" alt="img">
```

Re: [Markdown] How to support relative image links when exporting

Posted: Fri Dec 01, 2023 11:22 pm
by abstr
Thx for your quick response.

I thought about it overnight and it seems that I already have a solution that I'd forgotten about.

Let me try that and get back to you.

Re: [Markdown] How to support relative image links when exporting

Posted: Sat Dec 02, 2023 1:06 am
by abstr
Here's my solution and its (minor) consequences:

1. If the HTML is being generated for the Markdown Preview pane, I will continue to replace relative paths with full-paths because nothing else will work AFAIK (see previous links).

This should have no impact on anyone.

2. If the HTML is being generated for 'File > Print/Preview' or 'Tools Export', then I will retain the relative paths and instead copy the images to the 'target' folder (TEMP folder for 'Print/Preview', User-defined folder for 'Export') so that the relative links will continue to work when the HTML is loaded into the browser.

The only downside over full-paths is that any images defined like '![img](./image.jpg)' will 'pollute' the target folder.

However, if you store the referenced images in a subfolder (which is most likely anyway) then those images will be copied to a corresponding subfolder in the target folder.

Re: [Markdown] How to support relative image links when exporting

Posted: Sun Dec 03, 2023 2:05 am
by abstr
Fixed in 8.3.A5

Re: [Markdown] How to support relative image links when exporting

Posted: Tue Dec 05, 2023 1:42 pm
by davidjimenez75
Perfect thats a great solution for the relative images issue. ;)

I have found an Apache2 "hack" for realtime replace strings in *.HTML Reports with relatives images from MarkDown over SAMBA + WEBSERVER (Apache2)

Everytime the *.tdl is saved by any user the report .HTML is created (with mod_substitute, Apache2 will replace the wrong "file://" paths)

- SOURCE: https://stackoverflow.com/questions/398 ... -dont-work

Enable mod_substitute on Apache2:

```
a2enmod substitute
systemctl restart apache2
```
Create/edit .htaccess

```
nano ./.htaccess
```

String substitutions for .html files:

```
AddOutputFilterByType SUBSTITUTE text/html
Substitute "s|file:///T:/|../|i"
Substitute "s|file://|https://|i"
```

NOTE: I have the Samba Todolist projects shared folder of the intranet mapped as T:\