obsidian digital garden cloudflare tutorial

obsidian 使用digital garden 插件借助github+cloudflare 进行 静态页面托管。

Summary

使用obsidian 的digital garden plugin 将 obsidian 中需要发布的笔记上传到github库中，并通过cloudflare定期build成website，方便全网访问，整个过程免费，且方便。

refer： Obsidian实现免费第三方发布的安逸方案，How to host a Digital Garden on Cloudflare
其他方法：使用Quartz github pages 发布 Obsidian

主要的流程是：

1. #在github上建立 private repository
2. #github grained tokens添加及设置
3. #digital garden插件配置
4. #cloudflare 部署，部署成功就可以成功访问页面
5. 做好笔记之后就可以 #更新notes并借用digital garden发布

对于已有的笔记可以借用obsidian linter 插件去批量的更新 note 的 property，然后digital garden 批量的 publish multiple notes。linter 的操作可以参考： Linter小妙招-如何在Obsidian中复用你的Yaml设置

在github上建立 private repository

访问 digitalgarden 实例库 的github 开源代码 （实例库代码和obsidian digital garden 插件代码是两个东西），直接点击页面中的用 use this template 的方式，可以以实例库为模版在自己的库中建立新的repository，将repository 设置为public或者private, private 直接看你的github主页的人看不到这个repository，隐私性好一点。

有用的git操作

git clone <原仓库URL>
cd <克隆的仓库目录>
git init
git remote add new-remote <新仓库 ssh 的 URL>   // 使用 https 的 remote add 方式会需要 经常输入用户名和密码
git push new-remote master

查看remote 状态： git remote -v  
强制push，当有冲突的时候，强制使用本地： git push -f new-remote master  // master是本地branch name， new-remote 是 你刚开始add 的时候给的名字
如果git push 出现 fatal error，先 git status，查看一下本地库出什么问题了，一般是没有add，就 git add .  并且  git commit -m "xxx"
设置新的up-stream
git push --set-upstream origin master

然后可以直接 
git push

github grained tokens添加及设置

点击github.com/settings/to… 新建一个令牌，需要设置：

• name
• expired dates
• select repositories
• contents: read and write
• pull request： read and write

digital garden插件配置

refer： Digital Garden Docs
打开obsidian 的digital garden 插件配置窗口

1. 复制 grained tokens 填充到GIthub token这栏
2. Github repo name 那一栏填你 克隆的库名
3. Github Username 填你的Github用户名称
4. 下面的Base URL填你的域名 包含子域名 不带协议
5. Slugify Note URL 置空 否则中文路径出错
6. Features这里配置页面出现的内容
7. Appearance这里控制站点的名称 主题样式 语言 图标等
8. 关闭后自动保存

cloudflare 部署

• 注册登录后，进入 Cloudflare 控制台，点击按图示进入 Workers 和 Pages 面板，选择 Pages。
• 选择 connect to git ，输入账户和密码，选择上面建立的github private repository
• 点击 begin setup，开始设置
  • 预设类型留空 构建命令 npm run build 构建输出目录 dist
• 点击开始deploy
• 部署成功后就可以直接点击链接访问页面了，默认是自动部署和更新的

更新notes并借用digital garden发布

1. 写一个新文档
2. 添加文档属性 可以通过快捷键⌘(ctrl)+p唤出快捷栏，输入tag，选中 Digital Garden: Add publish flag，然后文章头部出现文档属性
3. ⌘(ctrl)+p 然后输入_publish single Note_ 回车即可看到提示栏信息发布状态
4. 返回CloudFlare控制台,_Workers 和 Pages_面板的Workers模块中 点击你创建的 Pages 查看构建状态等待完成 如果有错误 查看报错信息
5. 去自己的域名看看发布效果
6. 左侧的工具栏有个按钮 可控制批量更新发布
7. 大概等1min cloudflare会自动的更新部署，就可以访问新的内容了

其他

1. 网站样式、风格和标题等在插件的配置里有详细说明，可以参考插件文档。
2. GitHub账户务必做好隐私保护，将库设为 private 并限制好CloudFlare授权的库，最好不要选择全部授权。
3. 图床使用GitHub和Cloudflare，无需繁琐的额外配置，相当于白嫖了。
4. 注意标记添加文档属性 dg-home 为 首页，可以通过快捷键⌘(ctrl)+p唤出快捷栏，输入tag，选中 Digital Garden: Add publish flag，然后文章头部出现文档属性，添加 dg-home，选则属性类型为复选框，然后选中即可设置当前页为首页。注意不要重复设置首页，发布构建会报错。
5. 为什么不选择教程中的方法呢？因为 Vercel 和 Netlify 在大陆地区的访问都有点麻烦，而且速度慢。Vercel即使CNAME指向中国也是访问很慢，而Netlify则可能莫名其妙封禁用户。因此，我探索了CloudFlare方案。
6. 每次发布构建GitHub都发邮件好烦怎么办？将GitHub的库 watch 改为 ignore 即可忽略邮件。但是这样你也会错过发布失败的提示，考虑到发布半分钟后你可能回去页面刷新预览，也不是不能接受。

其他相关插件

• linter
• 数字花园 Digital Garden
• obsidian-enveloppe : 不用 digital garden的也有用这个的

cloudflare 中域名绑定

1. 返回CloudFlare控制台,_Workers 和 Pages_面板的Workers模块中 点击你创建的 Pages
2. tab中选择自定义域
3. 设定 填入你想好的域名 下一步
4. 选择_我的 DNS 提供商_
5. 开始CNAME设置,这里会莫名其妙出错
   1. 不管他返回控制台
   2. 再来到这里的域名设置会看到新增的一条是停用状态
   3. 点击展开 获取目标值 xxx.pages.dev
6. 去你的dns服务商 把该域名增加cname
7. 返回第5部位置 点击检查dns记录 需要稍微等待一下 等待成功后下一步