はじめに

Quartz 4 を使って、Obsidian で書いてきたモノたちを公開してみたいと思います。
とはいえ、公開したいノート、したくないノートとあるのでそれの区分けがめんどくさいなーと思っていたんですが、Quartz の機能で frontmatter を書くだけでそれの切り替えができるそうなのでやってみます。

前提

github で専用リポジトリ (公開状態はどっちでも) がある
npm 使うので node とか色々揃えてある
Windows11

Quartz を導入

まず、下記コマンドを入れて Quartz をクローンして、必要モジュールをインストールします。

git clone <https://github.com/jackyzha0/quartz.git>
cd quartz
npm i

次に、コマンドを入れてセットアップを開始します。
選択肢は全部一番上で良いです。

npx quartz create

リモートを変更する

初期状態では、クローン元の URL にリモートが設定されてるので、これを再設定します。
まず、git remote -v で確認して、origin を編集します。
もし、upstream がなかった場合はこれを追加します。

git remote -v
git remote set-url origin REMOTE-URL
git remote add upstream <https://github.com/jackyzha0/quartz.git>

リポジトリを同期する

専用コマンドがあるので、これを実行してリポジトリを同期します。

npx quartz sync --no-pull

Obsidian のコンテンツを移行する

すでに Obsidian を使っている方であれば、コンテンツを移行する必要があると思いますので、以下の点に注意すれば content フォルダにいれるだけで移行は完了します。

Frontmatter を設定する

Quartz には frontmatter に反応してページを動的に変えてくれる機能があるのでそれを使います。
Authoring Content よりいくつか抜粋して説明します。

Title

言わずもがな、ページのタイトルです。
このプロパティがないとファイル名を使用します。

Draft

ページの非公開、公開を変えます。
あらかじめテンプレートで draft: true を設定しておけば便利。

Date

ページの公開日付を設定します。

index.md を作成する

content フォルダの中に index.md を作成します。
これがないとサイトのホームが 404 になるので注意します。
とはいっても、作成するだけで終了です。
なんか適当にリンクでも貼っておけばいいと思います。

Cloudflare でホスティング

Hosting を参考に進めます。
やった感じ、以下を入力すれば OK です。

オプション	内容
Build Command	`npm quartz build`
Build output directory	`public`

Done！

これで Obsidian の内容を Git にぶち込むだけで外部に公開できるブログ的なのが簡単に作れました。

sotono.dev

目次

QuartzでObsidianのコンテンツを公開してみた