其实搬家也没有想象中那么难，不过动起来确实是件难事。

前言

有些事我怕写到后面就忘了就先说了

1. 本地预览能省下大部分的上传次数，但部分特效（忘了是哪些了，不过只占很小的一部分，基础装修是都可以看的）本地没法预览，waline 的装修也不行。
   1.1 本地预览使用方法：在你hugo本地文件的根目录右键，选择Git Bash Here，然后在打开的框里输入 hugo server，之后如果没有报错的话打开浏览器输入localhost:1313就可以了.
   1.2 如果报错的解决方案：复制下来找ChatGPT。
2. 在markdown文档的编辑中，Vicial Studio Code 比 Obsidian好用.
   
3. 在工厂的装修中使用了大量的
   #669988作为，呃，元素……？因为这是八潮瑠唯的应援色，，，

---

搬家

  事情的起因其实是notionnext上个月的时候图片同步坏了，一开始还以为是我的问题，但是后来发现所有认识的使用者都出现了这个问题，就顺理成章地鸽了。
  然后陆续有两个认识的人搬家到了hugo，那个时候我就在想我一定也要搬走——然后一个月过去了，，，
  当然一个原因是我懒，不想动。不过主要原因大概是我狂野生长的畏难情绪。
  我之前搭过好几次hugo基础的静态博客，进度最靠前的一次大概是什么都装好了但是更换了主题之后满是事故，塔塔老师说有什么问题可以问ta但是，我不知道哪里出了问题……总之后来就搁置了一直没动。

  最后大家知道为什么之前几次都没成功吗，因为塔塔老师教程里说换主题最好就直接fork仓库，复制content文件夹就可以了。而我，复制了主体文件夹……事情过去两天了我现在想起来都会大喊我之前到底在干什么啊！！！

我发誓我之后一定逐字逐句地看教程，再也不囫囵吞枣了！

  说回搬家，我大概经历了：

• 删掉仓库
• fork普通的hugo仓库（？）
• 重新换成cactus魔改版主题的仓库
• 更改整体及细节名字
• vercel免费推送额度上限
• 出事故
• 莫名其妙出事故
• 调了半天又好又没好
  好崩溃啊好崩溃啊好崩溃啊好崩溃啊 好崩溃啊 好崩溃啊 ……
• 放弃了换了个新域名
  

倒腾仓库

  这一步首先是把基于notionnext的博客炸掉，这个应该不用多说，总之就是删库跑路。在此期间，我顺便删除了此前搭建hugo、waline等一系列东西时产生的建筑废料，真的很多，想要一次性全删除完的话还是比较累人的

写到这里我想起来我只删了vercel的建筑废料，github的还给我忘了，算了，下次一定。

  把vercel处理得相对来讲比较容易观看之后，我开始按照塔老师的 这个教程 开始建站，一直到更换主题为止都很顺利，因为这个过程我已经重复了好几遍，甚至不需要打开这个教程……可能这也是过于自信产生的过失，我连续好几次都死在这个地方。
  总之在fork完仓库之后这个博客好像是跑起来了！
  

给工厂挂匾

  主要参考的是 这一篇 只要仔细看对照着来基本不会出现差错——总之猫头气球生产工厂堂堂开业！
  插播一个教训：logo不支持gif格式

图纸装订

  其实一开始我想偷懒看能不能直接用空间相册当跳转这样既不用给钱也不用维护。

  然后理所当然地失败了。

  ↑获得这样的反馈之后我乖乖地去找爱海的装修记录了→■■Loading：《hugo 装修日志 01》■■
  中途又出现了一点事故，我最开始试图使用的是smmr图床，但是连不上，完全连不上，求助小爱获得了不如直接使用github的建议，经过一系列操作（主要是参考→这一篇）总之像合成大西瓜一样合成了大图床。

之后我发现之所以我的图床没法生效不是smmr出事故了，是我写路径的时候把https://写成了https;//,我一直以为是smmr有病非要写成这样殊不知原来病的是我……

  之后就是很顺利地插入了gif格式的首图，请用猫猫！

更换地图地址

  这个事情说来话长……我原先使用的域名商是namelio ，这个域名商的购买网页做得相当现代，但是域名管理页面却很古早你到底是什么人。加上又不支持中文，原先用notionnext的时候就一知半解地在折腾。
  这回折腾hugo到一半不知道怎么回事这个域名就进不去了，狂热查找错误之后发现可能是ssl证书 的问题，但是我跑到域名商和cloudfire都看了，发现ssl证书到期都至少是明年年初。整半天终于给我整不会了。
  事情进行到上述步骤的时候我已经很崩溃了，又联想起这域名商明年要涨价，我就干脆换了dynadot 重新购入了新域名ccaatthouse.icu。

非常喜欢这个新的域名的后缀，不仅是ICU，而且从事实上来说它也确实对我的博客进行了一个抢救。没有你我怎么活啊

  整体使用感受好多了，管理界面也简单易用，关键是有中文，感觉整个世界都变得清晰了一点。其实也不是看不懂英文，不过我的英语水平你也知道.jpg而且中文毕竟是母语嘛理解起来就没有隔阂。

---

装修

概览

  总的来说参照塔塔的博客主题参考书（？）来做就好了，塔老师写得非常清楚！
  基本上就放置一些零碎的软装环节。
  短代码大部分参考自鹤辞的这篇博客Hugo | 在 Stack 主题上可行的短代码们，小部分是ChatGPT生成。

非常重要的事前准备

  直接fork过来的主题仓库中，是没有custom.css文件的，首先需要在static\css自己创建一个。
  第二步是在config.toml文件中的[ params]下添加：css = ["/css/custom.css"]（不确定是否一定要在params下面加，总之我是放在这里生效了我也不敢动它了）

颜色块预览

  本来前言的碎碎念3想放在这里的，不过不知道为什么放在这一行之后就会莫名其妙换行，问了人工智能说是因为这行代码太长了所以自动换行了……没修好总之先这样了。
step 1: 将以下代码复制到custom.css文件中

/*颜色预览*/ 
.color-preview {
    display: inline-block;
    border: 1px solid #ccc;
    margin-right: 0; /* 都可根据需要进行调整 */
    width: 10px;
    height: 10px
}

step 2：在想要使用颜色块的地方插入：

<div class="color-preview" style="background-color: #669988"></div>

这是示例：

文本位置调整

我没有在我的css文件中找到相应的代码，所以大概是直接在想要调整的地方插入就可以了，这个大概是html的语法（吧）

<div style="text-align: left;">这是文本居左</div>
<div style="text-align: center;">这是文本居中</div>
<div style="text-align: right;">这是文本居右</div>
&emsp;&emsp;这是首行缩进 
（&emsp;占据一个汉字的位置，想缩进几格就插入几个）<br>这是换行

  这是首行缩进 （ 占据一个汉字的位置，想缩进几格就插入几个）
这是换行

markdown语法中的各种格式

*斜体* **加粗** ***斜体加粗*** 
<u>下划线</u> ~~删除线~~

斜体 加粗 斜体加粗
下划线 删除线

以上的大家都可以混搭使用，删除线如果不在句尾就不要包含标点符号，否则会导致失效。

飘落的emoji

  对不起我好偷懒……不过看完小爱讲得我已经不知道怎么组织自己的语言了就干脆引用了小爱的话（。）

“用的是塔老师修改过后的 Mengru 老师的代码，首先在static/js里新建一个 js 文件，把下面的代码贴进去。”

console.log("Script started executing");
;(function () {
    const Config = {
       snow: ['🍂','🍁','👻','🎃','☔','(^.༝.^)ﾉ','🎈',], // 雪花的样式，可以放不同的雪花，或者任何 emoji，每次生成新雪花时会随机挑选其中一个
        speed: 10, // 雪花从生成到落到最底端所经历的时间，单位是秒。数字越小落得越快
        dom: document.getElementsByTagName('body')[0], // 下雪的区域，可以保持不变，这样就是全屏下雪
        interval: 800 // 生成一片雪花的时间间隔，单位是毫秒
    }
    if (!Config.dom) {
        throw Error('错误提示')
    }
    const $canvas = document.createElement('div')

    useStyle($canvas, {
        width: '100%',
        height: '100%',
        position: 'fixed',
        top: 0,
        left: 0,
        pointerEvents: 'none',
        zIndex: 100
    })

    setInterval(() => {
        const $snow = document.createElement('div')
        $snow.innerText = Config.snow[rand(0, Config.snow.length - 1)]
        useStyle($snow, {
            display: 'inline-block',
            color: Config.color,
            fontSize: rand(20, 30) + 'px',
            position: 'absolute',
            top: 0,
            left: rand(0, 100) + '%',
            transition: 'transform ' + Config.speed + 's linear' + ',opacity ' + Config.speed + 's linear',
            transform: 'translateY(-100%)',
            opacity: Math.random() + 0.3
        })
        setTimeout(() => {
            useStyle($snow, {
                transform: 'translate(0, ' + getComputedStyle($canvas).height + ') rotate(480deg)',
                opacity: 0
            })
            $snow.addEventListener('transitionend', () => {
                $snow.remove()
            })
        }, 100)
        $canvas.appendChild($snow)
    }, Config.interval)

    function rand (from, to) {
        return from + Math.floor(Math.random() * (to - from + 1))
    }
    function useStyle (dom, style) {
        for (let sKey in style) {
            dom.style[sKey] = style[sKey]
        }
    }

    Config.dom.appendChild($canvas)
})()
console.log("Script finished executing");

然后打开layouts\partials\header.html，在文件前面引用:

<script src="/js/刚刚新建的js文件的名字.js"></script>

  这个飘落特效可以飘落文字！

waline评论区

更新版本

1. 修改github对应仓库中package.json文件中@waline/vercel版本号为最新
2. 需要更改hugo文件中layouts\partials\comments\cactus_comments.html

<head>
  {{ if not .Site.IsServer }}
  <script src=

=后的链接为

//cdn.jsdelivr.net/npm/@waline/client@v2/dist/waline.mjs

关闭自带的ip和操作系统显示

在vercel 中添加环境变量（settings-environment variety）

Key	Value
DISABLE_REGION	ture
DISABLE_USERAGENT	ture

配置完之后记得找个最近的deploy右键redeploy一下
key一定要大写

其他的补充

  忘记了总之复制代码的时候记得写备注，不然之后会看不懂。