Github仓库地址:Mantyke/stack-theme-mod

本主题由CaiJimmy制作并发布,这个仓库是由Mantyke修改的魔改版本

预览:Demo站

使用方式

从零建立博客:Fork仓库到自己账号下,用Github 注册 Vercel,依次点击Overview → New Project → import刚刚Fork的仓库,设置FRAMEWORK PRESET为Hugo → 点击Environment Variables,设置NAME为HUGO_VERSION,Value为Hugo版本号(如0.89.0) → 点击Add → 点击Deploy,稍等十来秒即可部署完成。下载仓库到本地后使用Github Desktop更新文章。(注,本地预览需安装Hugo,具体请参照Hugo | 一起动手搭建个人博客吧相关内容)

旧博客更换主题:不同主题方式不同,推荐只保留原博客的content文件夹,迁移到本仓库content文件夹后再按情况调整。

魔改内容

调整文章页面为三栏显示(代码来自ShadowySpirits)

文章按年份分类

增加文章字数统计与站点总字数、总篇数显示

修改全站字体为思源宋体

增加一个引用短代码(短代码来自荷戟独彷徨)

添加一个友情链接页面并设置为双栏(友情链接代码来自Bore,双栏代码来自BB_Roin)

一系列基于个人美观喜好的CSS修改

右侧栏增加Categories小部件

部分使用说明

引用样式短代码

(注:实际使用请补全花括号

{< quote >}}}

三月,因久旱不雨,苏轼赴郿,祈雨于太白山之上清宫。数日后,虽有微雨,父老以为不足,于是,再陪宋太守亲往祭祷,回程路上,便见道中有云气自山中来,如群马奔突而至车座左右,苏轼一时好奇心起,开笼收云归家,作《攓云篇》。

{< /quote >}}

三月,因久旱不雨,苏轼赴郿,祈雨于太白山之上清宫。数日后,虽有微雨,父老以为不足,于是,再陪宋太守亲往祭祷,回程路上,便见道中有云气自山中来,如群马奔突而至车座左右,苏轼一时好奇心起,开笼收云归家,作《攓云篇》。

友情链接使用方式

友链头像放在/assets/link-img,友链数据放在/data/links.json

[

{

"title": "小球飞鱼",

"website": "https://mantyke.icu/",

"image": "mantyke.png",

"description": "我们会一起遇见鲸鱼吗?"

},

{

"title": "友情链接2",

"website": "",

"image": "",

"description": ""

}

]

修改页尾信息

站点名称及建站时间请修改以下代码

站点名称及链接:

#位置:layout/partials/footer/footer.html

#位置:layout/partials/footer/footer.html

var s1 = '2022-02-13';//设置为建站时间

s1 = new Date(s1.replace(/-/g, "/"));

s2 = new Date();

var days = s2.getTime() - s1.getTime();

var number_of_days = parseInt(days / (1000 * 60 * 60 * 24));

document.getElementById('days').innerHTML = number_of_days;

其他常见修改

设置博客头像

位置:/assets/img,请将头像命名为avatar.png,替换原头像文件

删除博客头像

位置:/layouts/partials/sidebar/left.html,注释或删去以下部分:

{{ with .Site.Params.sidebar.avatar }}

{{ if (default true .enabled) }}

{{ if not .local }}

{{ else }}

{{ $avatar := resources.Get (.src) }}

{{ if $avatar }}

{{ $avatarResized := $avatar.Resize "300x" }}

height="{{ $avatarResized.Height }}" class="site-logo" loading="lazy" alt="Avatar">

{{ else }}

{{ errorf "Failed loading avatar from %q" . }}

{{ end }}

{{ end }}

{{ with $.Site.Params.sidebar.emoji }}

{{ . }}

{{ end }}

{{ end }}

{{ end }}

修改博客背景颜色

位置:assets\scss\variables.scss

--body-background: #f6f6f6;

指定首页分类标签颜色

位置:content\categories,创建分类同名文件夹后,在文件夹内创建_index.md文件,写入frontmatter

title: "做猫贵在折腾" //分类名称

description: "简介 Blablabla" //不需要可以删了

image: "ffxiv_20210830_230509_817.png" //分类题图,不需要也可以删了

style:

background: "#80aba9" //分类标签底色

color: "#fff"

---

配置各类图标

图标放在:/assets/icons,svg格式,配置方式参考文档

其他参考

其他我站修改及Hugo博客搭建教程可参见以下文章,作者代码水平为0,写作时间跨度较大,参考时务必注意:

Hugo | 一起动手搭建个人博客吧

Hugo | 看中 Stack 主题的归档功能,搬家并做修改

Hugo | 另一篇 Stack 主题装修记录

Hugo | 为 Blog 增加评论区

Hugo | 以正确姿势自动添加文章最后更新时间

Hugo | 在文章中插入轮播图片

Hugo | 第三篇 Stack 主题装修记录,堂堂再临!

如果您喜欢或使用这个魔改版主题成功搭建了自己的个人博客,欢迎到我的个人博客中留言告诉我,我会很开心的!