功能代码

创建 /layouts/shortcodes/inlink.html

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
<div style="height: 150px;margin: 1em auto;position: relative;
        box-shadow: 0 2px 4px rgb(0 0 0 / 25%), 0 0 2px rgb(0 0 0 / 25%);
        border-radius: 15px;padding: 23px;max-width: 780px;background: var(--entry);">
    {{ $url := .Get "src" }}
    {{ with .Site.GetPage $url }}
    <div style="font-size: 22px; font-weight: 600">
        <a target="_blank" href="{{ .Permalink }}" style="box-shadow: none">{{ .Title }}</a>
    </div>
    <span style="font-size: 14px; color: #999">
        日期: {{ .Date.Format ( default "2006-01-02") }}
        {{ if .Params.tags }}&nbsp;
        标签:
        {{ range .Params.tags }}
        #{{ . }}&nbsp;
        {{ end }}
    </span>
    <div style="font-size: 14px; line-height: 1.825;max-height: 75px; overflow: hidden;margin-top: 5px;">
        {{ .Summary | plainify}} ......
    </div>
    {{ end }}
    {{ end }}
</div>

使用方式

1
2
{.{< inlink src="posts/blog/Shortcode:文章内链.md" >}}
# 卡片获取的文章长度默认是70,需要在hugo.yaml配置文件添加 summaryLength: 90,即设置为90

其中,inlink 匹配短代码模板 inlink.html ,之后填的 bitcron-auto-article-refer 是文章 md 的文件名。

效果