折腾了半个 Hugo 主题

LMS
5.5K+ 26

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

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

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

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 发布内容,搞个图片也不方便,木木同学说有插件,无形当中又要多个东西折腾,而且意味着得花钱钱找地方另外存储图片。

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

THE END

评论 26

  1. 点赞可以用Cloudflare kv 或者 upstash 来实现吧

  2. 王云子
    🏅🏅🏅

    最近失恋???记得你不是都有孩子了 :arrow:

  3. 最近失恋???我怎么记得是个抠脚大叔来着。

  4. 看第一句我也懵了。。。 :twisted: :twisted: :twisted:

    话说之前几个月前也折腾过hugo的主题,但是最后折腾根据数据自定义分页没办法实现,又折腾会了hexo。

  5. 自己用hugo最大的原因是数据在本地,而且是md格式,随时浏览,不像wp需要数据库才行。服务器出啥问题都无所谓~~
    本地一份,nas里自动同步一份,提交的时候github里一份~~

      1. Hugo 支持页面级资源,放里面就好了,缺点是仓库体积会增加

      1. 首页这么难都搞定了,文章页不更简单 :lol:
        可以考虑单纯做成说说页面,感觉这种主题更适合发短文说说这种类型,长文看估计毫无体验感可言.....,另外也发不了类似文章形式的,例如文字夹杂图片,而这种只能文字+九宫格图片

    1. 好像wordpress有个朋友圈的主题卖,不过人家功能完善,我就一个首页。

  6. 所以是恋爱阻拦了你进步!你值得更好的人!

  7. 「最近失恋」
    是我时空错乱了吗,我怎么记得你有娃了。

    1. 确实有点时空穿越回来没接上的感觉,这就失恋了?

    2. 哈哈哈,随便写的,看了木木的一条memos随便写的。 :mrgreen:

  8. 没看出来啊~~
    啥效果

发表评论

Submit