博客 | 仓库施工日志（更新至2024.07.28）

成功用Hugo搭好个站。主题从meme改成了hugo-theme-stack，大致调了调首页，左栏调好了，但是项目顺序好像变了，我怀疑这是因为我调了weight的数值，不明白。//(Solved.)（weight是权重，影响项目的排序）
几乎完全不懂html！Those Who Loved Him里的正文贴进去后消失了，很神秘，前端完全没有显示出来。//(Solved.)（最后决定把文章删掉了。后来一想，文章贴过去却没有显示，可能是因为标注的时间在博客时间的未来……）

2021-12-06

仔细看了看stack主题的介绍页又研究了会：

确认了在stack主题下，往菜单栏里添加页面的推荐方式。//（不是直接修改config）
搞懂了FrontMatter及所包括的项目是什么意思，学会添加slug来自定义文章链接。
知道了怎么给分类/标签添加图片。知道了CSS、px、em等缩写是啥意思。//（呃但是后来又忘了）
添加《仓库施工手册》来记录学习过程与tips，简化了《仓库施工日志》。
解决了插入本地图片不成功的问题：添加超链接后你没在英文符号 [ 前加英文感叹号 ! ！正确的格式是 ![操作：输入想要显示出来的描述文字](图片文件名.文件格式) 。而且Markdown文件的文件名要改成index才行。
解决了左栏项目顺序发生变化的问题：你调了weight的值！而且每一个页面都调成了不同的值，不变才有鬼（原来这个weight真的是权重的意思）。
添加网站icon。

2021-12-07

还能靠自己修的已经所剩无几了，感觉剩下的就是想修也无从修起，为什么呢，因为我确实一点也不懂码（一点也不懂）。为什么，竟会痛苦。相比起来卡文都堪称一种幸福体验……不禁对天问一句how。

学会添加任务列表。
添加《链接收藏》。
添加《待写集》。

第二次大装修（2022-03-17至2022-03-19）

2022-03-17

心血来潮点进《日志》里的参考文章，一看：我擦！之前搭个站时参考的那篇博客的博主直接给出了stack主题魔改版的说明与GitHub仓库，我立马冲过去研究一下。

于是本站终于得以再次更新（还是大更新！装了好多东西又修了好多东西），装修内容具体参考《Hugo | Hugo-stack-theme主题魔改版》。

将stack主题替换成stack魔改版。

这里我要提一嘴：stack主题前不久更新了（应该算是大更新），到GitHub上下载的主题压缩包的名字变成了hugo-theme-stack-master，比旧版多了个master。而魔改版主题的压缩包叫Hugo-stack-theme-mod-master，这个www打了mod，倒也对！

成功安装Waline评论区。
添加访问统计功能。代码可以直接参考不蒜子-极简网页计数器，也可以在不蒜子的基础上advance一把，比如我用的这个：

 <br />本站访客数<span id="busuanzi_value_site_uv"></span>人次
        <span id="busuanzi_container_site_pv"> 总访问量<span id="busuanzi_value_site_pv"></span>次 </span>
        <span id="busuanzi_container_page_pv">本文阅读量<span id="busuanzi_value_page_pv"></span>次</span>

学习正确的文章更新方式：值得注意的是，如果你更新个站文章的方法是「删除旧文件，并复制粘贴新文件」，那么这篇文章底下显示的阅读量会清零——所以最好不要这么做。

2022-03-18

昨天才感慨说：感觉博客的功能已经很是齐全——甚至还有了专门放友链的页面——除非换主题（或是更新主题），否则个站的大更新应该到此就该暂告一段落了（虽然这才第二次）。之后就是整理文章和搬运文章了！

结果今天就又修了好多东西（基本都是为了美观），没想到吧！这一切都得归功于我淘到了好多经验贴，不过，唉，你当初怎么就不会善用搜索！总之最后还是把想修的都修上了。

删除主題里的vibrant.js插件，删除主題里的photoswipe灯箱插件。
修改文章页字体设置，缩短文章行距。
缩短目录里的标题行间距。
目录内容适当左移。
使“相关文章”栏里的文章显示文章日期（原本能看见的信息只有标题）。

这一步造成了一点小问题。我现在套着的主题是stack魔改版，相较于原版，魔改版的“相关文章”栏其实已经进行了一定程度的美化，具体表现在：一，魔改版里的文章块被压缩了。二，魔改版里的文字居中显示。

由于我一开始未能发现这点（真是令人伤心……），导致在进行这一步修改后，“相关文章”栏的显示一度让我以为，这个小小的修改带来了大大的问题。意识到魔改版的修改后，我才明白这一步带来的真正问题在哪儿：首先，得搞明白部分标题左飘与这步修改有无关系。其次，日期显示它不居中啊！看着太别扭了。

我现在的想法是：其一，个别文章的标题不居中，大概是因为标题太长了。我不认为标题显示与这一步的修改有关，毕竟可以看出，短标题的显示效果还是居中的。这个有点令人头疼，不知道怎么修。其二，日期应该也能像标题一样居中显示。要实现这个效果，仿照魔改版相关部分的代码来改一下日期部分的代码也许能行。

加深菜单栏文字的颜色。

默认的字体颜色太淡了！而且点击也不会使文字高亮，看得眼睛有点费力。

PS：其实也可以实现选中高亮效果，但高亮好像有点麻烦……直接把整个菜单栏的颜色加深更简单。

PPS：魔改版送了高亮功能，但因为我基本只点“主页”选项，导致一开始并没有发现这点……

修改全站的滚动条样式（a.k.a.美化滚动条）。

默认的滚动条是很粗的方形长条，让人一看就不禁感慨年代感（年代感）。修完后全站的滚动条都变成细的圆角长条了（但是手机端看到的还是方形长条）！确实让人看着心情愉快。

美化选中样式
为个站加了loading动画。

参考《为网站加入Loading加载页 | Add loading page to your site》，为个站加入了一段loading动画。

其实我一开始发现网站还能插入加载动画时，脑子里冒出的第一个想法是“我要把大王的片段给塞进去”！如果能实现我想要的那种效果的话，当然是不管怎样都要把大王的片段放进去！！！后来发现这可能有点难……要么是本身难以实现这点，要么是实现这点对我来说很难。

总之这个想法先暂时搁置了！我可能得先理解loading加载页的实现原理是个啥……

2022-03-19

今天小改一把。

修改默认模式下的代码块的背景与字体颜色。文件途径为 根目录/assets/scss/variables.sass 。

默认的那个黑底白字真的要看瞎眼……代码块的背景色我直接copy了黑暗模式下代码块的字体色，而字体色则copy了黑暗模式下代码块的背景色——当然，这个背景色我还小调了一下。

普通装修项

2022

2022-03-22

解决站点图标只在首页显示的问题。

第一步：将Icon命名为favicon.png；

第二步：打开 根目录的/static/img 文件夹，如果没有这个文件夹，则新建一个；

第三步：将Icon放进上述文件夹里，并打开config.yaml修改favicon栏，具体为 favicon: /img/favicon.png 。

注意：img前带/。如果漏了/，写成img/favicon.png，那么就会出现只有首页显示Icon的情况。

删除超大Avatar。

打开 根目录/layouts/partials/sidebar/left.html ，删除以下部分即可。

        {{ with .Site.Params.sidebar.avatar }}
            {{ if (default true .enabled) }}
            <figure class="site-avatar">
                <a href="{{ .Site.BaseURL | relLangURL }}">
                {{ if not .local }}
                    <img src="{{ .src }}" width="300" height="300" class="site-logo" loading="lazy" alt="Avatar">
                {{ else }}
                    {{ $avatar := resources.Get (.src) }}
                    
                    {{ if $avatar }}
                        {{ $avatarResized := $avatar.Resize "300x" }}
                        <img src="{{ $avatarResized.RelPermalink }}" width="{{ $avatarResized.Width }}"
                            height="{{ $avatarResized.Height }}" class="site-logo" loading="lazy" alt="Avatar">
                    {{ else }}
                        {{ errorf "Failed loading avatar from %q" . }}
                    {{ end }}
                {{ end }}
                </a>
                {{ with $.Site.Params.sidebar.emoji }}
                    <span class="emoji">{{ . }}</span>
                {{ end }}
            </figure>
            {{ end }}
        {{ end }}

缩小菜单栏里图标与描述之间的距离。

打开 根目录/assets/scss/partials/menu.scss ，找到menu>li>svg，修改margin-right栏的数值。我调的是15px。

2022-03-23

在菜单栏添加“留言板”。

新的东西新的问题，注意到“搜索/归档/友链”页之后，我还得研究研究怎么：隐藏标题与页尾（感觉可以抄友链页里的代码？）；隐藏右侧栏；在page底下开评论区（应该和Front Matter有关？）。

2022-04-27

解决“引用块长得跟代码块一模一样”的问题：你没用对引用代码！//（代码块引用和平常看到文字引用是两种引用……以及，事实是，魔改版的说明里明确给出了引用样式短代码的说明……只是我一直没有注意到罢了（望天）。）

MarkDown官方教程给出的引用语法是 > 引用内容 ，而Hugo现在能用的引用语法如下：

{< quote >}
我说你怎么不告诉你爹，你爹来自大海，大海会包容一切。

他说：大海！他叹：大海！你可知大海带来了一切，又可将一切收回。没有人真的是大海的眷者。
{< /quote >}

PS：实际用的时候，首行与尾行都有两层大括号
PPS：这个引用代码在stack主题下渲染出来的效果确实只有一个左引号（but why），不要担心。

我说你怎么不告诉你爹，你爹来自大海，大海会包容一切。

他说：大海！他叹：大海！你可知大海带来了一切，又可将一切收回。没有人真的是大海的眷者。

关于引用代码，还可以看看这篇文章Getting to know Hugo shortcodes。

2023

2023-05-01

解决了疑问：正确添加了文章，发布时间填为今天/此时此刻，成功上传后，主页却不显示？//（参考文章《Hugo平台博文指定时间之后不显示?》）

我擦，闹了个乌龙。前一阵子不是终于又登上个站捣鼓了一下嘛，结果发现不知道为什么某几篇文章贴是贴上去了，github上看着也没显示有问题，但主页就是不显示！今天又贴了另外一篇，也是如此。跑去搜索一通，然后改动某处的细节看了看，以为终于发现了问题何在：时间标为2023年的文章无法显示！

结果再一搜，好吧！神速破案，不是时间标为2023年的文章就无法显示，而是超过“当前时间”的文章都无法出现……部署的锅。我再看看。

好耶，在config里加了个变量 TimeZone: Asia/Shanghai ，把站点的时区改到上海后就可以让文章以当前的时间发布而不至于无法显示了。

2023-07-17

Waline相关问题

Waline

Valine评论系统出现504错误→错误码详解

应用被归档之后，没有办法激活

Waline 评论系统的介绍与基础配置

waline在GitHub上的讨论区

在留言板页面底部开启评论功能，实装留言板。

其实还是没琢磨出来要怎样才能在page页底下开评论区！最后的做法是把留言板的文件从page移到post里变成文章页，再在config里把文章页的链接链到菜单栏里。迂回一下，至少变成post后，底下是有评论框的……好吧，起码留言板终于实装了！

2023-07-20

购买并成功配置新域名。

在NameSilo上购买域名，参考Namesilo DNS 域名解析教程和常见问题解决方法汇总，Namesilo 域名购买及使用教程（附 Namesilo 优惠码），以及vercel官方的这篇文章Domains Overview，成功配置新的域名！

啊啊啊啊啊妈呀域名可算都解析成功了，带www和不带www的都能成功跳转到个站了，感天动地了呀TT啊呀唯一遗憾的是换域名之后，网站的访问数据会清空，好吧但是问题不大，也没什么所谓。呵呵总之这下又可以直连了。至今没想明白原先那个自动分配的域名怎么就突然给墙了……

新发现，带www.的和不带www.的还能是不同的两个网站，啊！？当我在vercel上给两个地址都选上 Assigned to main 、分别点进去却发现访问数还能有不同的时候，真是不禁感到两眼一黑……看完www.和不带www.的域名有什么区别？这篇文章之后了解了，这还要选一个当主域名啊，好吧！

终于拥有个站评论区的管理员身份——这下才算真正完成Waline的部署！

第二次重新部署，终于拥有管理员（Admin）的身份……真的要流下泪来。

第一次部署没成功。第二次部署成功了（serverURL记为A），但在五百来天后我发现我忘记了一开始注册的账号密码，按【忘记密码】也没用，这下定当不成Admin，遂删vercel和github上的项目重新部署，于是有了第一次重新部署。

第一次重新部署成功了（serverURL记为B，A和B是不同的URL），并且在重新部署成功后，我立马注册了账号，然而很意外地，这个账号竟然没有Admin身份！大为震惊的我在评论区连发多条评论以作测试，并到处搜来搜去，最后终于确认，在后台页面的左上角没有显示管理选项的账号，真的不是Admin……这下真的要两眼一黑的我决定彻底重新部署，不仅删了vercel和github上的项目，还把个站根目录底下的 config.yaml 和 \layouts\partials\comments\provider\waline 里的serverURL（B）也删掉，然后还把LeanCloud的应用也删了！彻底重新开始！这就是第二次重新部署。令人感动的是这次注册的账号终于是Admin了……哇简直要哭了好吗。

把《日志》中【参考】部分的第三条从“高级装修技巧”改为“stack主题更多相关一览”。

因为经验贴真的很多啊！？先存一下，日后再作具体更新。

添加“返回顶部”按钮。这个按钮在移动端也看得到。

代码部分，参考《Hugo Stack主题装修笔记》和《Hugo｜自定义 hugo-theme-Stack》。

SVG图标部分，参考《一行代码实现一键返回顶部 | Back to top in one line of code》

在归档列表里面显示文章副标题/简介

参考《Hugo Stack主题装修笔记》

第一步：
找到 根目录\assets\scss\partials
定位到 .article-list--compact ，在这部分添加如下内容
.article-subtitle {
 margin-top: 6px;//这个值决定文字部分是否上移或下移，带-号的会往上走，不带则往下走
 font-size: 1.5rem;
 @include respond(md) {
 font-size: 1.6rem;
 }
}

第二步：
找到 根目录\layouts\partials\article-list
 <h2 class="article-title">
 {{- .Title -}}
 </h2>

在上面这段的下边加上下面这段
 <div class="article-subtitle">
 {{- .Params.description -}}
 </div>

唯一的问题是标题和描述粘到一起了，我得看看咋把描述往下拉拉……好，解决了，调 margin-top 就行。

草，但是调了之后发现描述和时间又分太开了！好，这个也解决了，找到 根目录\assets\scss\partials ，定位到 .article-time 并修改它的 margin-top 即可。

2023-07-21

在保留《仓库施工日志》的同时，将精简后的《日志》命名为《仓库施工总览》。

2023-08-20

研究一下短代码，还是想不明白为什么>引用块和反引号引用块在本博客内看着一模一样……不应该啊。

自定义 Hugo Shortcodes 简码

来写一些好玩的 Hugo 短代码吧

深入探究 Hugo 短代码

2023-09-22

解决了手动TOC无法跳转的问题。

先放参考：Markdown 文档中文内锚点链接跳转（中文）

编辑《Roman Holiday》那篇博客时在为如何实现页内文字跳转而发愁，到处点击琢磨的时候突然解决了一个大问题——“为什么手动打出来的TOC无法跳转”。

原因竟在于在那种情况下标题是【跳转到的链接】而链接里不能有中文。。。。也就是说标题里不能有中文，否则就不到了。这么一想到倒也非常合理，但还是喷了！我说为什么《Fallen Arcadia》里的那个TOC只有Michael那个标题能够点击就跳呢……

标题里不能有中文这还真是个问题，毕竟这样一来就不够直观了。但是呢！如果我们在博客开头放个手动TOC并在其中附加中文描述，那是不是就跟原本的情况差不太多？草！天才啊，就这样了，完美的解决办法，什么新东西也不用加。

把博客slug里的连字符通通替换为下划线。