2025-03-28

ObsidianのノートをBlog記事にする

Obsidianのノートをいちいち個別にコピペしてHTMLタグを書き込んでという手作業はかなり手間だし、blog的に書き出してWebにアップできれば楽だよな、ということで、コミュニティプラグイン「Webpage HTML Export」を用いてHTML化してみる。

実験中

このような手順でExportできる。

  1. コンテキストメニューから「Export as HTML」をクリック
    Pasted image 20250328091244.png
  2. 生成範囲を指定して「Export」をクリック
    Pasted image 20250328091511.png
  3. 書き出された
    Pasted image 20250328091635.png
  • 画像等はlib/media配下にあるようだ。
  • publish配下にあるファイル内の各種参照パスの記述が相対パスであれば問題なさそう。
<base href="../">
  • base を指定することでうまくやっているらしい。

やってみる

  • Obsidianの保管庫に「Blog」フォルダを設け、その中でブログを書いていく。
    • ファイル名は YYYY-MM-DD 形式とする。
    • 画像ファイル名も半角英字とする。
    • indexは作らない(遷移前にどうにかする)。
  • Webpage HTML Export プラグインで「Blog」フォルダをExportする。
    • この時、頭の大文字Bは小文字になって blog になる。
  • 生成された lib フォルダ、blog フォルダ をサーバーの public フォルダ内に配置する。
    • lib フォルダ、blog フォルダは Git 管理外とする。
  • サイト本体から /blog/{記事HTML} へのリンクで遷移可能とする。