gpt4 book ai didi

asciidoc - 如何为现有的 Asciidoctor Asciidoc 宏创建自定义 HTML 输出?

转载 作者:行者123 更新时间:2023-12-04 08:54:27 46 4
gpt4 key购买 nike

例如,我想添加 loading="lazy" 归因于我的所有图像,例如:

image::myimage.jpg[]
但默认 HTML <img>元素输出没有那个属性。
也许这是在: Creating custom HTML with asciidoctor 上被问到的但这个问题还不够清楚,我无法确定。

最佳答案

这记录在:https://asciidoctor.org/docs/user-manual/#provide-custom-templates但感觉像一个最小的例子会是有益的。
主文件

image::myimage.jpg[]
template_dir/block_image.html.erb
<%#encoding:UTF-8%><div<%= @id && %( id="#{@id}") %> class="<%= ['imageblock',@style,role].compact * ' ' %>"<%
if (attr? :align) || (attr? :float)
%> style="<%= [("text-align: #{attr :align};" if attr? :align),("float: #{attr :float};" if attr? :float)].compact * ' ' %>"<%
end %>>
<div class="content"><%
if attr? :link %>
<a class="image" href="<%= attr :link %>"><img src="<%= image_uri(attr :target) %>" loading="lazy" alt="<%= attr :alt %>"<%= (attr? :width) ? %( width="#{attr :width}") : nil %><%= (attr? :height) ? %( height="#{attr :height}") : nil %>></a><%
else %>
<img src="<%= image_uri(attr :target) %>" loading="lazy" alt="<%= attr :alt %>"<%= (attr? :width) ? %( width="#{attr :width}") : nil %><%= (attr? :height) ? %( height="#{attr :height}") : nil %>><%
end %>
</div><%
if title? %>
<div class="title"><%= captioned_title %></div><%
end %>
</div>
这是从 https://github.com/asciidoctor/asciidoctor-backends/blob/master/erb/html5/block_image.html.erb 复制的默认模板, 但通过添加 loading="lazy" 修改 HTML .
文件
gem 'asciidoctor', '2.0.10'
gem 'concurrent-ruby', '1.1.7'
gem 'tilt', '2.0.10'
我们需要安装那些额外的 gems 才能工作。
编译:
asciidoctor --template-dir template_dir main.adoc
就是这样,输出 HTML 现在包含 loading="lazy" .
在 Asciidoctor 2.0.10 中测试。

关于asciidoc - 如何为现有的 Asciidoctor Asciidoc 宏创建自定义 HTML 输出?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/63917971/

46 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com