折腾了半个 Hugo 主题

    最近失恋刚好有空,所以想找个东西折腾,于是就搞起了 Hugo 的主题,花了两天时间,参考了一些主题语法,顺便也请教木木老师,最终弄了个下面的半个“朋友圈”主题。

    hugo-quan
    hugo-quan

    手机滚动截屏的,比较长,我把后面的给隐藏了,点击可以看大图,不过好像也没啥好看,图片压缩的太利害了。

    整体是照着微信朋友圈作的,目前其实就一个首页的样子,分了几个功能:

    1. 正常文字发布,两三小段还可以,长篇大幅的不好看。
    2. 区分图片数量分别为1、2、3及以上的显示,超过 3 其实就是 9 宫格了。
    3. 搞了个外链的样式,可以自定义外链Logo,也只能自定义,没有 api 获取 favcion 或者缩略图的。
    4. 使用木木老师的 bilibili 短代码功能,直接插入 B 站的视频。
    5. 可以使用短代码插入外链的视频或者音频,html5 播放器播放的,支持自定义封面。
    6. 使用木木老师推荐的 Aplayer + Meting 实现短代码插入网易云,好像其他的也可以,不过没试过。
    7. 虚假的位置显示,需要手动填写,不是自动生成。
    8. 黑白模式,这个没啥好说的。

    因为基本不了解 go 语言,模板里面 html 和 go 语言混合着看起来其实挺吃力的。再加上 Hugo 主题不像 Wordpress 那样可以无视 Wordpress 本身折腾主题,Hugo 主题需要配合 Hugo 设置、内容预设、主题关联 3 个方面才能真正搞定,所以挺麻烦的。

    做完了首页,突然就感觉进入贤者模式,好像没啥意思,尤其一些功能我实现不了,好像就作了个空壳。

    1. 右下角预设的两个点点,是点赞和评论,Hugo 是静态博客,不知道怎么实现点赞,Hugo 也没有评论,得第三方评论,这个自定义就比较差,估计搞不了想要的结果,刚好 docker 现在又被强,也懒得去部署评论测试了。
    2. 上面说的位置的信息,纯手工输入,原汁原味,自欺欺人。
    3. 用 Hugo 发布内容,搞个图片也不方便,木木同学说有插件,无形当中又要多个东西折腾,而且意味着得花钱钱找地方另外存储图片。

    总体感觉,静态博客还是适合有技术的搞,它把博客从原来简单的提交到显示,变成了内容和存储两件非常具体的技术性问题。

    发表回复

    您的电子邮箱地址不会被公开。 必填项已用*标注