前言

在 Hugo PaperMod 主题中，默认情况下，文章中添加的基本链接会在当前网页打开，这对用户的阅读体验不是很好，而且也不太方便。所以我想将文章中的链接设置为在新标签页中打开，方便用户阅读。幸运的是（因为懒）这个改善在 Hugo-PaperMod 项目 已经有人提了 PR ，我直接拿下来用了，顺便记录下来。

步骤

步骤 1

（1）在 assets/css/common/post-single.css 添加样式代码

  • .post-content a.external-link

  • .post-content a.external-link::after

assets/css/common/post-single.css
.post-content a code {
    margin: auto 0;
    border-radius: 0;
    box-shadow: 0 -1px 0 var(--primary) inset;
}

.post-content a.external-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.post-content a.external-link::after {
    content: "";
    display: inline-block;
    clip-path: polygon(60% 5%,
            60% 0%,
            100% 0%,
            100% 5%,
            100% 40%,
            94.98% 40%,
            94.98% 5%,
            94.98% 9.59%,
            42.41% 59.2%,
            38.1% 54.64%,
            90.7% 5%,
            60% 5%,
            50% 8%,
            13% 8%,
            8% 8%,
            8% 92%,
            92% 92%,
            92% 50%,
            87% 50%,
            87% 87%,
            13% 87%,
            13% 13%,
            50% 13%,
            50% 8%);
    background-color: var(--primary);
    width: 18px;
    height: 18px;
}

.post-content del {
    text-decoration: line-through;
}

步骤 2

（2）在 layouts/_default/_markup/render-link.html添加代码

如果没有 render-link.html 文件的话，直接新建，再将代码拷贝进去

layouts/_default/_markup/render-link.html
<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}
    {{ if strings.HasPrefix .Destination "http" }} rel="noopener"{{ end }}
    {{ if and site.Params.ExternalLinksIcon (strings.HasPrefix .Destination "http") }} class="external-link"{{ end }}
    {{ if and site.Params.ExternalLinksNewTab (strings.HasPrefix .Destination "http") }} target="_blank"{{ end }}
 >{{ .Text }}</a>

步骤 3

（3）在站点配置文件中添加 ExternalLinksIcon 和 ExternalLinksNewTab 参数

./hugo.yaml
params:
  env: production
  externalLinksIcon: true
  externalLinksNewTab: true

参考

  1. https://github.com/adityatelange/hugo-PaperMod/issues/1612