Shortcodes help needed

support
1

So I want to do the following:

![alt text][1]

lorem ipsum ...

[1]: http://www.lorem.com/image.jpg`

This should render:

<a href="http://www.lorem.com/image.jpg">
   <img src="http://www.lorem.com/image.jpg" alt="alt text" />
</a>
<p>Lorem ipsum ...</p>

I know I can do this by doing the following markdown:

[![alt text][1]](http://www.lorem.com/image.jpg)

lorem ipsum

[1]: http://www.lorem.com/image.jpg

Which kinda beats the purpose of using the reference to have all my links in the same place and in a easy place to change them.

So now I was wondering if I could use a shortcode to render this but I’m not really sure how to do it.

in the markdown I want to write something like:

{{% ![alt text][1] %}}

But I’m not sure how to extract the [1] link from the markdown and use it to render the correct html.

I would be ok also with a shortcode like this:

{{% alt="alt text" link=[1] %}}

Can anybody point me in the right direction?

2

I’m not sure shortcodes is the right medicine.

Isn’t what you’re looking fore reference-styled links, as described here:

http://daringfireball.net/projects/markdown/syntax#link

I’m pretty sure they work fine with Blackfriday in Hugo.

3

In Markdown there are

referenced style links:

 [text to link][1]
 whatever text
 [1]: URL

or referenced style images:

 ![alt text][1]
 whatever text
 [1]: src for img

Both do work very well with Blackfriday, but what does not exist is a combo of the two. ie.

[![alt text][1]][2]

whatever text

[1]: src for img
[2]: URL

I my case the [1] and [2] would be the same, but that does not matter as with referenced style links/images you can reuse the reference multiple times throughout a markdown file.

I searched already a long time for a solution but none exist. That’s why I want to use a shortcode, but I can’t seem to figure out how to do it.

4

Ok, after some more trying, it seems that below does work. I must have made some typos when first trying it out.

1 Like