Relative Markdown Links - Markdown Render Hooks

tips & tricks
1

The minimal example for relative markdown links:

[My Article](../my-article/index.md)

Template: /layouts/_default/_markup/render-link.html

<a href="{{ (.Page.GetPage .Destination).RelPermalink | safeURL }}">{{ .Text | safeHTML }}</a>

For more complex example in the test project, follow: https://github.com/bep/portable-hugo-links

5 Likes
2

This solves the problem of relative markdown links to other pages not working for me.

To clear this up for people like me who were initially confused, you create the file /layouts/_default/_markup/render-link.html, then place that code in it.

Is it possible to get this to work for images as well. That is, if I have an image in my content folder and I make a relative link to it, it displays the image?

3 Likes
3

Thank you. This hack works. But I hope there is normal way to do this.

1 Like
4

More infos:

  1. You don’t need to use the theme’s layouts folder, but instead use the layouts folder in the root directory.
  2. More infos on Render Hooks