HUGO

External link in a new tab with Goldmark and images

I have upgraded to Hugo v0.64.1 and tested the new Goldmark renderer. I used @PrasadPen tips to open external link in a new tab and noticed that some images failed to render.

Looking at my site content I found several Markdown link containing images [![my image](/local/image)](https://example.com), that are now rendered as text <img src="/local/image" alt=“my image”>. After reverting @PrasadPen’s tips, the images are rendered correctly, but I lost the ability to open external link in a new tab.

Do you have any tips on how to work with image and link in Goldmark? I looked at goldmark.linkContext but there seem to be no method to work with HTML.

1 Like

Push, same here :wave:

I’m encountering the same problem here. No “image” in links seem to work with Goldmark. Has anybody been able to found a workaround?

I had a look at this and I reproduced what is described in this topic.

But then when I looked at the page source in the browser I saw the Go templates #ZgotmplZ error indicating that unsafe content reached a CSS or URL context at runtime.

That got me intrigued so I entered {{ .Text | safeHTML }} just to see what would be outputted.

Well…guess what… the render-image.html markdown hook kicked in.

The link with the target="_blank" attribute was outputted empty and the image was outputted right after it by the markdown image hook.

I think that the way to output the desired HTML for markdown image links would be to enter them like so: [img.jpg](https://gohugo.io)

then within the render-link.html markdown hook template add a condition that checks whether there is an img extension (.jpg , .png etc) within the .Text variable and consequently add the necessary markup to output the image within the link.