Here's a diff of the custom vs inbuilt shortcodes:
#+begin_src diff
--- Original figure shortcode
+++ Custom figure shortcode
@@ -1,6 +1,6 @@
<figure {{ with .Get "class" }}class="{{.}}"{{ end }}>
- {{ with .Get "link"}}<a href="{{.}}">{{ end }}
+ {{ if .Get "link"}}<a href="{{ .Get "link" }}"{{ with .Get "target" }} target="{{ . }}"{{ end }}{{ with .Get "rel" }} rel="{{ . }}"{{ end }}>{{ end }}
<img src="{{ .Get "src" }}" {{ if or (.Get "alt") (.Get "caption") }}alt="{{ with .Get "alt"}}{{.}}{{else}}{{ .Get "caption" }}{{ end }}" {{ end }}{{ with .Get "width" }}width="{{.}}" {{ end }}{{ with .Get "height" }}height="{{.}}" {{ end }}/>
#+end_src
Above is an hyperlinked image with the HTML attributes set as
=#+attr_html: :width 10% :target _self= in Org.
- The =width= attribute of /10%/ must apply *only* to the image, and
not to the link.
- And the ~target="_self"~ attribute must apply *only* to the link,
and not the image. So, clicking that image will open the linked
image in the same browser tab because the =target= is set to
="_self"= (*Hugo v0.37+* --- fixed in {{{hugopr(4382)}}}).
-----
#+attr_html: :width 10% :target _self
Above limitation is not posed if the image is inlined:
[[https://orgmode.org/img/org-mode-unicorn-logo.png][https://orgmode.org/img/org-mode-unicorn-logo.png]] i.e. the =target=
attribute will be added to the =<a>= tag correctly, as the =figure=
shortcode is not used for inline images.
Here's an inline hyperlinked image with the exact same HTML
attributes: [[https://orgmode.org/img/org-mode-unicorn-logo.png][https://orgmode.org/img/org-mode-unicorn-logo.png]]. So,
clicking this image too should open the linked image in the same
Here's a diff of the custom vs inbuilt shortcodes:
```diff
--- Original figure shortcode
+++ Custom figure shortcode
@@ -1,6 +1,6 @@
<figure{{with.Get"class"}}class="{{.}}"{{end}}>
- {{ with .Get "link"}}<ahref="{{.}}">{{ end }}
+ {{ if .Get "link"}}<ahref="{{ .Get "link"}}"{{with.Get"target"}}target="{{ . }}"{{end}}{{with.Get"rel"}}rel="{{ . }}"{{end}}>{{ end }}
<imgsrc="{{ .Get "src"}}"{{ifor(.Get"alt")(.Get"caption")}}alt="{{ with .Get "alt"}}{{.}}{{else}}{{.Get"caption"}}{{end}}"{{end}}{{with.Get"width"}}width="{{.}}"{{end}}{{with.Get"height"}}height="{{.}}"{{end}}/>
```
- The `width` attribute of _10%_ must apply **only** to the image, and
not to the link.
- And the `target="_self"` attribute must apply **only** to the link,
and not the image. So, clicking that image will open the linked
image in the same browser tab because the `target` is set to
`"_self"` (**Hugo v0.37+** --- fixed in `hugo` PR #[4382](https://github.com/gohugoio/hugo/pull/4382)).
---
Above limitation is not posed if the image is inlined:
<ahref="https://orgmode.org/img/org-mode-unicorn-logo.png"target="_self"><imgsrc="https://orgmode.org/img/org-mode-unicorn-logo.png"alt="org-mode-unicorn-logo.png"width="10%"/></a> i.e. the `target`
attribute will be added to the `<a>` tag correctly, as the `figure`
shortcode is not used for inline images.
Here's an inline hyperlinked image with the exact same HTML
attributes: <ahref="https://orgmode.org/img/org-mode-unicorn-logo.png"target="_self"><imgsrc="https://orgmode.org/img/org-mode-unicorn-logo.png"alt="org-mode-unicorn-logo.png"width="10%"/></a>. So,
clicking this image too should open the linked image in the same