Question

我有一个带有JavaScript和Gulp的Hugo网站。
我想自动检测<a>链接并设置其格式，以便添加“外部链接”图标和“ target = _blank”。

现在，我使用一些JavaScript在客户端浏览器中完成此操作：

// EXTERNAL LINKS
$(document.links).filter(function() {
  return this.hostname != window.location.hostname
      && this.hostname != "domain-name-base-url.com"
      && this.hostname != "another-domain-name-base-url-to-be-treated-as-internal.com"
}).attr('target', '_blank').addClass("external");

但是出于性能原因，我想在构建时这样做。

如何将其移至构建后的gulp任务？我用.pipe(replace...)尝试了一些东西，但无法做到。我什至可以在Hugo建立时做到吗？

如果有人知道更简单的方法来实现这一目标（允许用户键入Markdown来忽略链接是外部链接还是否链接，并在构建时添加“ target = _blank”和图标）...任何神奇的方法库还是最佳做法？

Answer 1

您不必花时间尝试开发解决方案，只需手动替换任何外部链接即可。

通过 Markdown 2.5.2 ，您可以使用以下语法

[link](url){:target="_blank"}

如果这不起作用，请使用常规HTML

<a href="http://example.com/" target="_blank">Hello, world!</a>

有关here中的Hugo内部和外部链接的更多信息。

Answer 2

更新：您还可以在模板中执行此操作，方法是使用replace函数将该属性添加到所有锚元素：

{{ $content := replace .Content "<a " "<a target=\"_blank\" " | safeHTML }}
{{ $content }}

您可以配置Hugo的降价处理器Blackfriday，将其添加到config.toml文件底部，以在新标签页中打开链接：

[blackfriday]
  hrefTargetBlank = true

从Blackfriday options文档中：

hrefTargetBlank

默认值：false
  Blackfriday标志：HTML_HREF_TARGET_BLANK
  目的：true在新窗口或标签中打开（外部链接）绝对链接。 target="_blank"属性通常用于外部链接，而Blackfriday则对所有绝对链接（ref）都使用。如果他们在整个内部都使用绝对链接，也需要内部链接（例如，将canonifyURLs设置为true或通过absURL来使用）。

如何在构建时格式化外部链接？

2 个答案: