这个博客网站终于做好了

搭建过程

年初的时候我提到过希望搭建一个自己的博客网站,这件事在7月末的时候终于提上的日程。

老实说,在这之前我对于搭建网站没有一点知识储备。会一点点编程,但仅限于本科期间在课上学习的有限知识,就连github我都是在搭建过程中注册的。但为了博客网站,但总归还是要试一下看看水深不深。

hugo框架尝试

最初在搜教程的时候首先指向的是hugo框架

根据他们官网自己的描述,这是世界上最快速用来搭建网站的框架。

实际使用下来,是不是最快速暂且不论,但如今如果想要搭建一个网站,通过这种框架已经将门槛降到了很低。如果想使用hugo搭建一个静态网站,基本流程就是

下载hugo → hugo生成框架 → 下载并安装一个主题 → 调试主题 → 撰写一篇文章 → 上传到github并代理网站

如果想要一个动态网站,或者想让自己的网址个性化一些,那么还需要

购买或租赁一个服务器 → 购买一个域名并备案 → 解析域名、服务器代理

已经很简洁了,其实大部分工作并不在制作网页本体上,而是让这个网页工作,对于网页本体的功能和外观需求,一个主题已经解决了绝大部分。

然而即使已经如此简单,实践过程还是一堆问题。

安装hugo没什么问题,同时我发现了一个比较好用的工具chocolatey,最大的用途在于将很多软件和插件的安装简化为了一句命令行,比如安装chrome就是一句

choco install googlechrome

比起通常方法要痛快一些。

用hugo在本地生成一个网站框架如图:

需要关注的几个文件夹:content放着博客文章,static放着文章内引用的媒体文件例如图片、音频。themes放着使用的主题,config即配置文件,通常该文件是和主题紧密挂钩的,public为将以上框架编译好的html形式的文件,将public上传到github后就可以了。

这过程中的小插曲还蛮多的,例如我按步骤将public上传后,迟迟不见页面在外网的显示。后来才知道从2020年10月起,github将默认分支从master改为了main以适应政治正确的需要。

但hugo使用最大的问题在于版本与主题的适配并不完美

b站直接搜索hugo博客搭建可以看到不少教程,但完整的教程主要都是两年前的

现在最新的hugo版本是0.117.0,如果用这个版本生成框架,配置文件的名称直接叫hugo.toml而不是config.toml,这种还算是不影响工作的小改动。

但有一些主题在启动时会产生报错,我解决的笨办法主要靠回退hugo版本

事实证明这是有效的,回退版本后可能主题A可以工作,主题B不能工作,但回退成更老的版本就变成A不能工作B可以工作。

另外更为头痛的问题是“主页”归档标签下,网址显示404,尝试了很多主题后都产生了这个问题,我意识到这可能不是主题的问题。在网上搜索后好像都没有遇到过像我这种问题,只能回头尝试更多的主题,唯一一个没有这种问题的是主题jane

jane主题突出一个简洁,依照这个主题我搭建了一个版本,目前也还挂在网上,即:

迷鹿屋beta (yuntian52s.github.io)

写了一些文章体验后,我不太满意的地方主要有以下三点:

  1. 插入多媒体的方式繁琐。如果想要在文中插入一张图片,需要另外去static文件夹放上这张图片,再回到文中通过代码插入。如果后期文章逐渐增多,为了维护方便,图片肯定会依照一种规范,通过文件夹分类。而如果图片路径修改,文中的插入代码里的路径也要修改,这种手动档插入方法很不适应。

  2. 网站的功能扩展问题。hugo的功能扩展主要通过shortcodes,通常主题会自带一些shortcodes。例如如果我想要内嵌一个b站视频,但主题又不支持,我就需要自己写一段html格式的shortcodes,并放在layouts去实现。
    这种模块化的解决方式当然很好,但考虑到我目前不得不使用这个主题,如果进行功能扩展将会是很大的工程。虽然可以copy代码,但万一有基础功能搜又搜不到,搜到了又不兼容,这处理起来会很头疼。

  3. 美观上的问题。文章编写的语法是Markdown,为了探索这个主题的表现程度,我用Markdown的语法写了
    Markdown语法,其中表格的表现如图所示。

说实话我不太喜欢,考虑到以后我会将自己阅读过的书籍、观看过的影视作品整理起来,表格功能是一定会使用的,目前这种显示方式差强人意。

hugo很好,只是我不够专业。深思熟虑后,我还是放弃了hugo。

Wordpress框架尝试

在逛了逛别人的博客后,Argon主题的效果让我十分心动,而且很多博客都使用的该主题,该主题的运行需要使用Wordpress或者Hexo框架,Hexo有些类似于Hugo只是相比于Hugo更早诞生,而Wordpress似乎是一个更广泛的解决方案。

这一次教程显得靠谱了很多,虽然还是会有一些小问题,但都是只要愿意去搜就可以解决的。

另外地,还是花了一点点前在服务器以及域名上面。由于我目前还是学生,具有学生优惠,支撑一个小网站的云服务器的租金还是可以接受的。

那Wordpress是什么呢,如果说Hugo是一个框架,那Wordpress更像是一个框架的框架。我把我现在正在面对的画面展示出来就一目了然。

这个仪表盘界面下,经过Argon主题的安装,左侧一栏直接多出了很多选项。这些选项几乎就是为了博客搭建服务。

想写文章,直接点进写文章就好了。

不支持Markdown?直接去插件商店下载一个Markdown插件就行。

配置页面,直接去“外观-菜单”修改。

主题外观,“Argon主题选项”给了你长的离谱的自定义选项。

另外一个意外收获的功能就是“说说”,除了传统的博客文章以外,日常的三言两语靠说说就可以了,也是大家最常用的“朋友圈”“微博”等功能。

但“说说”讲究一个便捷性,我想说什么一定最好拿起手机就写,而不会等到有机会使用电脑时再去写。

这同样也是使用云服务器和Wordpress好的地方,只要我能登录这个仪表盘页面,我可以使用任意智能设备去发表说说。而且,由于说说本质上也是一种文章,相比于朋友圈微博,我也可以使用Markdown语法,可以插入音频和视频。

八月初我不幸二阳,趁着症状减轻的休息期间搭建的这个网站。搭建这个网站的效率比想象的要快很多,虽然标题“终于”二字好似我花费了很大的时间成本,实际上基于Wordpress的这个网站从零到搭建完成只用了4天。

第一天学习Wordpress并开始搭建,第二天主题能够工作,第三天搬运文章、配置页面,第四天配置主题并添加一些小工具。域名我是之后买的,需要时间的反而是个人信息同步和备案审查。

感兴趣的同学如果也想搭一个玩玩,可以参考以下教程:

【视频教程】基于WordPress的个人博客网站搭建教程

【文字教程】Echo's blog-建站

【更详细的文字教程】Bensz-学习地图,直接跳转到3.6Wordpress一节。

这个博客用来做什么

这两年,驱动我做这些事的起点,往往是脑海中不经意间划过的一个想法。最初可能只是“今天中午吃点不一样的”,变成“我想要去看一本什么书”,又变成“我要做什么事”。

如果你是一位BMS玩家,你肯定知道这个网站HAKULA†CHANNEL。这个网站主要是HAKULA的个人站,在很长一段时间内都作为国内最全的BMS资源整合站和主流BMS启动器LR2的优秀教程。

所以这个想法的诞生其实很简单,就是“别人的这个东西我好喜欢,我也想要一个!”,准确说我绝大部分想法都是这样产生的,它不是凭空产生,只是“我也想要”。但更重要的是,这些东西不是以商品的形式出现和获得。

如果非要问“这个博客用来做什么?”,目前我总结成了以下几点。

  1. 作为读者和观众,会分享在豆瓣上对一些作品的感想和评价。

  2. 作为玩家,分享在B站上的一些游戏成就和作品的评价(以BMS为主)。

  3. 作为学生,有一些个人的学习笔记可以分享出来。

  4. 作为迷鹿屋本身,会用文字记录未来的想法与感悟。

  5. 这个博客不仅仅是作为一个个人的内容平台,而且会作为督促自己表达的工具。至少很长一段时间里,我还是太沉默了。

上面教程中,第一篇文章在搭建博客前问了一个问题,Bensz-你需要个人博客吗?这篇文章带给我不小的启发。从兴趣、定位、坚持和商业用途几个方面展开。包含几个主要观点:

  1. 个人博客像是一个对外窗口,也是一个自我表达的平台,没有内容、篇幅、形式的限制。每次写文章就像是与自己对话,这种感觉很奇妙。
  2. 我对于个人博客在促使自己保持长期输出状态的作用十分感兴趣。我很期待自己可以一直坚持写作。
  3. 如果写博客只是给自己看的话,没有太大的意义,也不建议你去折腾了。
  4. 写作的时候,可以设想一下潜在受众。我的博客,对于某些学生党,比如刚刚读本科的小伙伴来说是有一定的参考价值的。个人博客的精髓之一,就是它对于某些人来说可能是有帮助的
  5. 就算你经常写博客,也不一定会变得非常厉害的。想要切实地提高自己,可能只有多与大佬交流、多了解大佬观点、多实践、多思考等。
  6. 坚持写博客的理由:系统整理知识以便于自己复习;系统整理的知识对某些人可能是有帮助的;回顾过往,认识自己的不足;可以给亲朋好友看。
  7. 在视频娱乐横行的年代,个人博客很难实现盈利,所以个人意义应该要大于商业意义。
  8. 相比于内容平台的优势:无发文限制,写作、修改、观看体验好,外链支持好,所有权自主,不可能倒闭。

关于设想潜在受众,我联想到以前看到过的一种说法,用于表达作曲的三个视角:

  1. 第一人称视角即描述,核心观念为我说的算,以个人自称成立,习惯否认宏大叙事区别公众共识

  2. 第二人称视角即建构,核心观念为你说的算,与集体描述主义关系密切,因此也是咱们说的算

  3. 第三人称视角即规定,和弦观念为ta说的算,为规定主义,树立一些具体实践为榜样,并无条件服从。

这种说法虽然划分出三种视角,其实就是如何平衡“自我”“大众”的问题,我找了两个比较极端的例子。

这首是作为“大众的”例子,听感上最能让主流接受,套路化的进行,规整的节奏,重复的段落,让这首曲子实在太大众了。

这首是作为“自我的”例子,这首在绝大多数人看来甚至不是一个曲子,里面充斥着太多噪音,有时候也会用一种高情商的说法叫“实验音乐”。

自我与大众的二难,不仅仅出现在作曲,甚至只要是创作都会遇到这个问题。但作为一个初期的创作者,需要意识到二者并不完全对立“自我的内容,大众的形式”是一个不错的回答,这也是设想潜在受众的必要之处,避免自嗨。

这是一篇迷鹿屋的介绍v2.0

这是一篇迷鹿屋的介绍v1.0

“迷鹿屋”最早是一个公众号,诞生于2021年9月。这个公众号和第一篇文章都是我心血来潮的产物,直到建站前已经有了4篇文章,保持着足足半年一更的高频更新。

除开已有的四篇迷鹿屋正篇,目前网站又更新了三篇文章来确定这个博客网站的属性。

第一篇为Markdown语法,归类于一些小知识。这篇用尽可能精简的语言教你如何使用Markdown语法,Markdown语法是一种非常简单便捷的记录笔记的语法,我建议所有人都可以学习学习。“一些小知识”用来记录短篇的知识性笔记。

第二篇为《语言学的邀请》笔记,归类于读书笔记,这个笔记主要内容是这本书的核心内容摘抄,以及一点点我自己的看法。这篇笔记是我以前的个人笔记,几乎是除开例子以外的观点整理。两万多字很长,但是如果愿意耐心整篇看下来,基本和你亲自读完整本书的收获相当。

第三篇为一些BMS段位体会,归类于BMS。以前我想做一些BMS活动资源的整理,但B站专栏只允许进行3次修改,导致无法长期更新某个固定页面。而且关于BMS的一些活动,我很早以前就有一肚子话想说了。所以这里就是整合BMS相关的内容。

这些就是目前迷鹿屋的全部,可以肯定的是,这将会是个长期运行的博客,我希望迷鹿屋能够尽可能久地存在下去。同时也欢迎大家经常来玩,如果有什么想说的,可以在留言板和评论区留下你的想法。

写于2023.8.18

博客所有原创内容(包括但不限于文章、图像等)除特别声明外均采用CC BY-NC-ND 4.0 协议,任何人均可自由传播,但禁止用于商业用途且必须署名并以相同方式分享。

评论

  1. iPhone Safari 16.6
    6月前
    2023-8-26 10:59:17

    恭喜恭喜~ 个人博客比较核心的一点还是内容、数据都在自己手里,也不会像第三方平台动不动就被屏蔽、审核。
    WordPress 这类动态博客框架确实更加新手友好一点,而且这么多年已经比较成熟,主题、插件也多。Hugo 的话可能你没找到一个好的主题,我在用的 LoveIt 就不错,没遇到过这些问题。另一方面是要注意下载 Hugo extended 版。图片的话,不一定要放在 static 下,可以放在文章同目录下的 assets 里,然后用相对路径,可以参考我的博客在 GitHub 上的源码里的目录组织方式。
    有兴趣也可以加个友链~

    • 博主
      Hakula
      Windows Edge 116.0.1938.54
      6月前
      2023-8-26 11:06:42

      hhhh当然非常乐意添加友链!
      提到的图片的目录,这一点学到了。
      Loveit的话其实是我最早尝试的主题,因为一些教程也以这个为例,但其实遇到的问题是同样的,有可能是你提到的需要extended版,也可能是我自己这边配置有问题,但作为这个领域的纯小白想了想未来维护成本还是算了…

      • Yuntian52
        iPhone Safari 16.6
        6月前
        2023-8-26 11:16:25

        哈哈,生命在于折腾。我一开始完全不懂编程时也是用的 Typecho(和 WordPress 性质类似的框架),后来也迁移到了 Hugo。或许等你之后发现 WordPress 的某些缺陷时可以考虑换 Hugo,之后你可能会发现 Hugo 的维护成本其实更低,只是开始时上手需要些时间,可以等需要时再说~

      • Yuntian52
        Macintosh Safari 16.6
        6月前
        2023-8-26 12:35:46

发送评论 编辑评论


				
|´・ω・)ノ
ヾ(≧∇≦*)ゝ
(☆ω☆)
(╯‵□′)╯︵┴─┴
 ̄﹃ ̄
(/ω\)
∠( ᐛ 」∠)_
(๑•̀ㅁ•́ฅ)
→_→
୧(๑•̀⌄•́๑)૭
٩(ˊᗜˋ*)و
(ノ°ο°)ノ
(´இ皿இ`)
⌇●﹏●⌇
(ฅ´ω`ฅ)
(╯°A°)╯︵○○○
φ( ̄∇ ̄o)
ヾ(´・ ・`。)ノ"
( ง ᵒ̌皿ᵒ̌)ง⁼³₌₃
(ó﹏ò。)
Σ(っ °Д °;)っ
( ,,´・ω・)ノ"(´っω・`。)
╮(╯▽╰)╭
o(*////▽////*)q
>﹏<
( ๑´•ω•) "(ㆆᴗㆆ)
😂
😀
😅
😊
🙂
🙃
😌
😍
😘
😜
😝
😏
😒
🙄
😳
😡
😔
😫
😱
😭
💩
👻
🙌
🖕
👍
👫
👬
👭
🌚
🌝
🙈
💊
😶
🙏
🍦
🍉
😣
Source: github.com/k4yt3x/flowerhd
颜文字
Emoji
小恐龙
花!
上一篇
下一篇