用Obsidian搭建博客的最简方案：0元0代码0难度无需备案无服务器，专注写作与分享

选择的方案是极简静态博客框架，全程仅需在GitHub点击「Fork」按钮，配合自动化脚本，15秒内即可完成初始化部署
支持基础的响应式布局，桌面端和移动端显示效果均符合预期
视觉效果还可以

但还是过于简易了
而且每次发布都提个issue也还是挺麻烦的

自那以后我也在关注其他的博客实现思路

有两种主流的实现思路
一种是国际思路
但是网络要求高
我在Vercel上尝试部署过，因为网络原因，没成功过
Vercel控制台访问不稳定，部署过程中频繁出现DNS解析失败

另一种是国内思路
网络环境好，访问也很快
但是有备案强制要求：根据《互联网信息服务管理办法》，域名需通过工信部备案，流程耗时15-30天； -
而且技术冗余度高：WordPress对静态博客场景存在「性能过剩」，后台管理界面复杂，非必要功能占比超60%

除此以外
大部分的博客功能强大，界面美观
但是搭建过程比较麻烦
涉及到很多命令行操作
有些需要魔法访问的网络环境
对很多人来说都是一道又一道坎

因此很多实现思路我在尝试过后又选择了放弃

但是今天这个路子真可以推荐大家一试

搭建过程简单，涵盖基本功能，界面美观实用
而且写博客的访问很简单
就跟在Obsidian写笔记一样

博客演示

可以通过

https://obsidiannote.netlify.app
访问查看
也可以通过我自定义的域名进行访问

https://selfbalance.top

主页

动态主题切换：支持明暗模式自动切换，基于CSS变量实现，切换过程无闪烁；

笔记界面

大纲导航系统：右侧自动生成Markdown大纲，支持点击跳转，提升长文阅读体验；

手机端体验也很不错
图片支持双指缩放，链接点击区域扩大，符合移动端交互规范；

支持评论

GitHub评论系统：集成Giscus组件，用户可通过GitHub账号评论，评论数据存储于GitHub Discussions，天然支持Markdown格式；

开启评论需要以下两点要求

笔记添加comment属性
完成Giscus相关配置（下面有配置方法）

简单说下实现思路

基于nolebase精简后的nolebase-template博客模板进行搭建
通过Obsidian完成博客笔记的撰写
通过Github desktop提交更新
利用Netlify部署网站页面

看似很复杂，但其实配置起来很简单
依旧是
0元！0代码！0难度！
无需备案 无需服务器！
搭建自己的博客

以下是逐帧教学

简易的搭建步骤

访问以下链接

https://github.com/Jackiexiao/nolebase-template
进入Nolebase-temolate仓库

点击fork，让它成为自己的仓库

访问Netlify

https://app.netlify.com

基于现有项目创建站点

选择Github，授权一下自己的账号

选择刚刚创建的nolespace-template

注意：
此处需要将Publish directory里的dist修改为.vitepress/dist

.vitepress/dist
注意不要有多余的空格，以及漏符号

同时此处支持给自己的项目命名
我这里的命名是obsidiannote
如果不命名的话
netlify会随机起个名字

然后点击Deploy开始部署

等待building成功
变绿就是部署好了

点击给出的链接即可访问

https://obsidiannote.netlify.app/
以下是模板网页的效果

没错，就是这么简单，鼠标点点的工夫
自己的博客网站就搭好了

必要的修改美化

现在，我们已经把博客网站搭建起来了

但是上面的信息，依旧是模板给出的
需要将它修改成我们自己的元素
那怎么操作呢？

为了方便同步和笔记更新
我们需要用到Github Desktop这个软件

首先访问以下链接

https://desktop.github.com/download/
下载Github desktop

下载完毕后，安装，并登录自己的Github账号

登录时网络环境有问题的可以开一下steam++

https://steampp.net/
安装并登录完成后
回到我们fork后的网站模板仓库

选择Open with GitHub Desktop
这时GitHub Desktop就会自动弹出来
在本地选择一个文件夹
GitHub Desktop就会自动将项目克隆到本地

点击我们设置的这个本地文件夹

可以看到项目都克隆下来了

接下来我们需要对模板网站上的一些元素进行修改
可以使用Trae或者Vscode来打开这个文件夹

https://trae.com.cn
这里我选择使用Trae
理论上用记事本打开也行，都只是做一些修改

修改 metadata/index.ts 配置一下自己的网站信息
配置网站标题、描述、作者等元数据

再修改一下 index.md 配置一下首页

可以对着模板进行修改
外观和代码是对应的

需要修改什么搜索即可
我最常用的是搜索文本

比较麻烦的是更换里面的图片

一个一个删除替换

Help突然感觉自己公众号的logo挺朴实的
考虑今年升级一下形象

另外分享一个png转换svg的网站

https://convertio.co/zh/
接着修改一下笔记目录里的index.md
这是笔记的第一个页面

全部修改完成后
回到我们的Github Desktop

在软件右边能够详细看到修改的情况

首先点击commit，
接着点击push

回到Netlify的页面
可以看到我们提交的修改正在部署中

等待部署完成后
进入网站后可以看到效果

有点怪怪的

再简单修改一下，勉强能看了

移动端显示画面

自己又美化了一下

沉浸的撰写体验

修改模板网站上的信息为个人的信息之后

接下来我们只需专注写笔记即可

打开Obsidian

选择我们克隆过来后的笔记文件夹

以这个文件夹作为仓库

此时Obsidian的界面如下

把原来的删除

写博客就像和平时在Obsidian写笔记一样
但是为了顺利地将图片上传
还需要做一下简单的设置

设置图片附件

Obsidian 设置 => 文件与链接 设置如下

内部链接类型 => 基于当前笔记的相对路径
使用Wiki链接 => 不使用
附件文件夹路径 =>当前文件所在文件夹下指定的子文件夹
附件文件夹路径 => assets
这么做有几个好处
保持兼容性的markdown: 可以让文档也能在 github 中被正确渲染（github无法解析[[双链]]）
方便迁移文件和图片，你只需要把图片文件夹和markdown文件一起复制就行（如果是全部汇总在某个文件夹下，以后复制比较麻烦）
对于已有的笔记和图片链接，你可以考虑使用 obsidian 插件obsidian-link-converter[https://github.com/ozntel/obsidian-link-converter] 来帮你做自动的转换 [[wikilink]] 为 相对路径 的 markdown link

标题有点小问题

不知为何，一级标题不能识别
网页上不会显示一级标题
我暂时的解决方法是跳过一级标题
所有都从二级标题开始

笔记的属性

模板默认给出了几个属性

comment

需要开启评论的话，不开就false

自定义属性

支持自定义frontmatter
在index.ts中进行添加即可
比如我自己增加了一个名为finished的属性
类型是日期Date，用于记录我发表这篇文章的时间

方便的提交过程

提交博客和提交对网站的修改的步骤一样
Github Desktop会自动识别当前文件夹的各种变化
当你想上传的时候
点击Commit
再点击

Push即可

在Netlify中可以看见
我们刚刚的更新已经Published成功了

更进一步，绑定自己的域名

博客还支持绑定个人域名

最开始项目部署时
我们的命名是obsidiannote
然后netlify给我们的链接就是

https://obsidiannote.netlify.app
还是有点长了
接下来我们把它改成我们自己的域名

可以直接在Netlify操作

也可以去cloudflare操作

https://cloudflare.com/
我习惯后者
通过Cloudflare绑定域名的，可以参考这篇文章
cloudflare的CNAME支持根域名部署

cloudflare设置完成后
回到Netlify进行设置

填写上我们的域名后
域名就增加了自定义域名

现在不仅可以通过

https://obsidiannote.netlify.app
进行访问
也可以通过我们自定义的域名进行访问

https://selfbalance.top

再进一步，开启评论功能

giscus 利用了 GitHub Discussions[https://docs.github.com/en/discussions] 实现的评论系统，让访客借助 GitHub 在你的网站上留下评论！
具体配置方法

第1步，访问 Giscus[https://giscus.app/zh-CN] 网站， 参考网站上的说明，一步步操作，最后得到一个配置代码

https://giscus.app/zh-CN

第2步，在 ./vitepress/theme/index.ts 中修改 giscus 相关配置，在该文件中搜索 giscusTalk, 参考说明，修改配置即可

这样别人登录Github账号后
就能在你的文章下面评论了

总结一下

静态站点生成：nolebase-template模板（VitePress + Markdown）
部署平台：Netlify（免费套餐含自动HTTPS、CDN）
版本控制：GitHub + GitHub Desktop
域名服务：Cloudflare（免费DNS解析+CDN）
评论系统：Giscus（基于GitHub Discussions）

无需深入理解Web服务器原理，即可掌握「版本控制-静态网站-自动化部署」的完整流程；
对内容创作者：专注Markdown写作，无需处理后端逻辑，在Obsidian的沉浸式编辑

「极简技术栈+最大自由度」，从点击「Fork」按钮开始，开启属于自己的博客写作之旅！

转自：https://mp.weixin.qq.com/s/8h5nVDijElaNHsMTziOwPQ