首頁 > 後端開發 > Golang > 主體

我的 Obsidian + Hugo 部落格設定(使用熱鍵自動發布)

PHPz
發布: 2024-08-19 20:30:50
原創
847 人瀏覽過

My Obsidian + Hugo blogging setup (Auto publishing with hotkeys)

如果您點擊了這篇文章,您可能知道這兩種技術是什麼,但如果您不知道,這裡有一個快速解釋:

黑曜石

Obsidian 是一個功能豐富的 Markdown 編輯器。但它不僅僅是一個 Markdown 編輯器。這是管理知識的一種方式。它非常適合以靈活、非線性的方式組織您的想法。

黑曜石適用於所有平台。所以你基本上可以在任何平台上寫文章。

幾個月來我一直在其中記下所有筆記,這太棒了!

雨果

Hugo 是一個用 golang 製作的超快速靜態網站產生器。我的部落格使用 Hugo 已經快兩年了。我最近更換了部落格的主題。了解更多關於新面貌、新開始的變化。

設定

在本文中,我不會展示如何設定這兩種技術,而只是展示如何讓它們協同工作。

如果您想了解我如何使用hugo、cloudflare 和 render.com 設定整個博客,請閱讀:我如何免費設定此部落格(網域、主機、ssl)完整指南

如果您想要有關如何使用黑曜石的良好指南,請閱讀:入門 - obsidian.md

目標

我的設定目標是:

  1. 使用單一黑曜石金庫
  2. 有一個易於使用的黑曜石模板,我可以將其用於我的部落格文章。
  3. 將我的個人保管庫資料夾保密。
  4. 使用黑曜石熱鍵自動發布。
  5. 將所有 Markdown 文件放在公共 github 儲存庫中,以便人們可以提出更改

現有設定

我目前的工作流程是:

  1. 從內容資料夾編輯文章。
  2. 運行hugo指令。
  3. 推送到github。
  4. Render.com 自動取得變更並提供服務。

旅行

如果想跳過旅程部分可以直接去The Sauce

我將經歷一些在設定時犯的錯誤。

錯誤#1

我的第一個想法是建立一個簡單的符號連結(順便說一句,我使用 linux),將兩個資料夾連結在一起。

基本上我有兩個資料夾:

blog/
vault/

登入後複製

部落格資料夾包含所有部落格資料夾,保管庫是我的個人保管庫。

符號連結將連結這些資料夾

blog/content
vault/Blog

登入後複製
登入後複製

但是符號連結的問題是資料夾內容在我的 git 儲存庫中不可見。這意味著人們不能對我的任何文章提出修改

錯誤#2

我想要同步我的資料夾。我嘗試編寫幾個 bash 腳本,使用 cronjob 自動同步兩個資料夾。然而,當我不寫作時,不斷運行後台是一種資源浪費。僅僅透過 cli 運行腳本就沒那麼順利。

醬汁

基本上我設定的方式是我有兩個資料夾:

blog
vault

登入後複製

blog 資料夾包含所有必要的 Hugo 文件,還有一個名為 content 的子目錄,其中包含所有 Markdown 部落格檔案。

我在我的保管庫中建立了一個名為 Blog
的新資料夾

blog/content
vault/Blog

登入後複製
登入後複製

之後,我將所有檔案從內容目錄複製到部落格。

然後我開始寫這篇文章

黑曜石模板

我需要某種方法來設定一個簡單的模板來包含所有必需的 Hugo 前言。

這很簡單。

了解如何設定模板 模板 - obsidian.md

我在範本資料夾中建立了一個名為 Blog Post 的檔案

我的部落格文章範本包含以下內容:

---
title: "{{Title}}"
description: 
date: "{{date:YYYY-MM-DD}}T{{time:HH:mm:ss}}+00:00"
draft: true
---

**If you enjoyed this article consider [supporting me](https://4rkal.eu.org/donate)**

登入後複製

我有所有必需的前言,包括標題、描述和日期,格式符合 Hugo 要求的格式。

我還添加了一條簡短的捐贈文字,將其添加在每篇文章的底部。

這意味著我可以自動將此範本插入任何文件中並開始編寫!

資料夾同步

現在我希望將我的保管庫/部落格目錄中的所有文件複製到部落格/內容

感謝一位熱心的不和諧用戶,我找到了 obsidian-shellcommands 插件。

注意:這個插件目前不能很好地與黑曜石的 flatpak 版本配合使用(因為 flatpak 隔離了環境)。使用另一種替代方案(.deb 或 appimage)似乎可行。

它允許您使用熱鍵在背景執行 shell 命令。

設定步驟如下:

  1. Install the plugin
  2. Enable the plugin
  3. Go to the plugin options
  4. Click on New shell command
  5. Now you will need to enter a shell command to copy the files from the one folder to the other.

On Linux/MacOS that is:

cp -a ~/folder1/. ~/folder2/

in my case that is cp -a ~/Documents/vault/Blog/. ~/Documents/blog2/content/

On windows it most probably is:

robocopy "%USERPROFILE%\folder1" "%USERPROFILE%\folder2" /E /COPYALL

After that we need to set a hotkey that will run the command

Click on the (+) icon to go to the hotkey settings and assign a hotkey

My hotkey is CTR + 0, simply because that was available.

Now every time that I run the hotkey it copies over all of my files to the hugo folder ready to be published

Auto publishing scripts

I also want to be able to automatically publish my articles. But I want it to happening by hitting a hotkey.

I wrote a small script that does exactly that:

#!/bin/bash
cd ~/Documents/blog

hugo

git add .
git commit -m "new"
git push -u origin main

登入後複製

This script will build my website, commit and push to my github repo, where it is picked up and published. Read How I setup this blog for free (domain, hosting, ssl) Complete Guide to learn how to setup your own blog for free.

Don’t forget to make the script executable by running

chmod +x ./YOURSCRIPT.sh

Then create a new shell command for the shellcommand plugin (as we did before) and enter the path to your script.

In my case that is:

~/Documents/blog2/push.sh

Then enter a hotkey and you’re done!

Conclusion

I can now simply open my obsidian vault, create a new file, insert my template and have all the info automatically entered.

I then write my article inside of obsidian

Run my hotkey and copy all the files into the hugo directory

Hit another key and my blog is published!

If you enjoyed this article consider supporting me

以上是我的 Obsidian + Hugo 部落格設定(使用熱鍵自動發布)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!