闲逛发现 Valine 1.4.4 已发布,表情改为了图片形式(win下不会再一坨坨)、评论支持楼内回复(不会一直在顶部)、也有取消回复按钮,立马跟近匹配了样式。

废话胶囊,值得拥有

@Elizen 的知识星球,得知还有人折腾了这货 无点赞评论版微博b言b语,原来是基于 LeanCloud 来实现的,无比亲切。

这不,折腾折腾已整合到主题中(这里)。另外,又学了几招。

前端用 AppIDAppKey 来展示,并把 class 的 create 、delete 、update 三项权限设置为「指定用户」,后端用 MasterKey 来更新,避免数据被更改。

你信什么

Don‘t Forget To Smile.

刷完《余欢水》,想起《小丑》这幕,呵呵,听歌听歌。

👩🏻:今天要不要出去玩?

🐑:不要了吧,在家玩也可以。疫情期间,尽量不要出门。

Hugo 自定义文章样式

之前 WordPress 推出不同文章样式,如轻博客一样,发一句话、链接或视频有不同的显示效果。之后,用 Hexo、Bitcron 时都以文件夹形式进行文章分类,并以此为判断条件。

效果见:https://immmmm.com/posts/chat/

content
├── posts
│   ├── chat
│   ├── coding
│   ├── daily
│   ├── reading

chat 目录内的 md 文件是以一句话的模式(头像+时间)显示,怎么实现呢?利用 Hugo 的 .File.DirreplaceRE 正则。

Hugo 显示指定文件夹内图片

效果见文章底部,这些图片非手动一张张插入,文章头部一句 path: 2004gd 搞定!

直接看代码:

{{ if .Params.path }}
    {{$Path := .Params.path}}
    {{- range (readDir (printf "%s%s" "./static/images/" $Path )) -}}<img loading='lazy' src="{{(printf "/images/%s/%s" $Path .Name ) | absURL}}" />{{- end -}}
{{ end }}

当文章中写了 path: 2004gd 表示 Hugo 遍历根目录 /static/images/2004gd 内的图片并显示。

Hugo 总文章数和总字数

前者在某个大神主题中翻到,一句代码:

共 {{ len (where .Site.RegularPages "Section" "posts") }} 篇文章

总字数没有现成参数,官方手册看到 .Scratch.Add 瞎折腾完成:

{{$scratch := newScratch}}
{{ range (where .Site.Pages "Kind" "page" )}}
    {{$scratch.Add "total" .WordCount}}
{{ end }}

新建了个参数累加所有文章的 .WordCount 字数,一般放 footer 头几行,下面是调用代码:

总计 {{$scratch.Get "total" }} 字

臭小子,我,相伴一天,无争吵无游戏,明日继续。星期几?几号?几月?谁都没个准。

Hugo 音乐短代码

感谢 LoveItMetingJS 真方便!

具体源码见:shortcodes/music.html,把这个文件丢入自己的主题文章内插入调用代码即可,已粗暴的把 js 和 css 丢在一起。

Hugo 添加相册页面

效果见: https://immmmm.com/photos/

总有那么一瞬间特别特别想发一张照片,但不是以文章形式发布。

实现思路是程序自动遍历指定文件夹内的图片,并展示在一个页面上。有了思路,剩下的就是看文档、看文档、看文档,此功能利用 Hugo 的 readDir function 函数达成。

日常更新把图片丢到 static/photos 中即可(搭配 Github Action 自动化部署更香):

static
└── photos
    ├── 落樱缤纷.jpeg
    ├── 想象中的自由.jpeg
    └── 儿时登过顶的狮子山.jpeg