Asciidoctor 图像链接问题

Question

以下的Asciidoc代码创建了一个图片（具有适当的样式等），如果你点击它，你会打开这个图片：

image:./myimage.jpg[my alt text, role="my css styling", link="./myimage.jpg"]

请注意，jpg文件的路径./myimage.jpg是重复的。这不够简洁，容易出错，如果路径很长，维护起来可能会非常不方便。

我的问题是：是否有一种简洁的方法可以实现这种效果，而不需要重复图像的路径，以便在代码中只包含一次图像的路径？

谢谢。

- Jim

Answer 1

可以通过定义属性来实现：

:myimage: ./myimage.png
image::{myimage}[my alt text, role="my css styling", link="{myimage}"]

（还要注意： :: 代替单个:）。

当通过AsciiDoctor运行时，它变成以下内容：

<div class="content">
<a class="image" href="./myimage.png"><img src="./myimage.png" alt="my alt text"></a>
</div>

这显然是更多的文本，但正如您所提到的，维护（特别是对于长文件名或外部图像的URL）变得更加容易。

请注意，在:myimage:和./myimage.png之间需要有空格。

此外，如果您在文档后面重新定义属性，则仅会影响属性的下一次使用。因此，

:myimage: ./myimage.png
image::{myimage}[my alt text, role="my css styling", link="{myimage}"]

:myimage: ./myimage2.png
image::{myimage}[my second alt text, role="my css styling", link="{myimage}"]

将会呈现两张不同的图片：第二个属性定义并没有覆盖第一个。
尽管在这种情况下，人们可能更喜欢使用不同的属性名称。

- 9769953

---

谢谢。这很有帮助。 - Jim

Answer 2

我不知道如何在纯Asciidoc中实现这一点，仍然欢迎对此提出意见。与此同时，我已经解决了这个问题。

我在Jekyll中使用了Liquid模板。我将一个名为myimage的文件放置在_includes目录中。

image:{{ include.p }}[{{ include.t }}, link="{{ include.p }}"]

并使用它调用

{% include myimage p="image-name.jpg" t="alt text" %}

这实际上是一个轻微的简化。完整的说，myimage 是

[.cssstyling]#image:{{ include.p }}[{{ include.t }}, link="{{ include.p }}"]{% if include.c != null %}_{{include.c}}_{% endif %}#

而调用方式可以是以下之一：

{% include myimage p="image-name.jpg" t="alt text" %}
{% include myimage p="image-name.jpg" t="alt text" c="optional caption" %}

- Jim