Hugo主题PaperMod设置文章内基本链接在新标签页打开
(1)在 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)在theme的 layouts/_default/_markup/render-link.html
添加代码
如果没有 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)在站点配置文件中添加 ExternalLinksIcon
和 ExternalLinksNewTab
参数
params:
env: production
externalLinksIcon: true
externalLinksNewTab: true