単一 HTML ファイル 60k~64k バイトの軽量な Wiki システム Feather Wiki(フェザーウィキ)についてまとめています。

2022年5月に初公開のバージョン 1.0.1 が公開されています。

運営者が Feather Wiki で公開しているのは次があります。

🎈 Feather Wiki | 🎈 BALLOON | FU-SEN - English information


目次


公式サイト

ソースのメイン公開は 🎈 Codeberg になっています。
GitHub はミラーで Issues もありますが、報告は Cordberg 側推奨です。


.html ファイルをダウンロードする

公式サイトから FeatherWiki_●●.html をダウンロードし、任意の場所に保存します。

  Feather Wiki

またはいくつかの種類から選んでダウンロードする事ができます。

  Downloads | Feather Wiki

種類は備わっているエディタが異なります。

  • Dove - WYSIWYG エディタ + Markdown エディタ
  • Finch - WYSIWYG エディタ
  • Chickadee - Markdown エディタ

WYSIWYG エディタ は装飾をアイコンボタンで選択できます。
🎈 Markdown エディタはアイコンボタンがなく、
代わりに画像関連のボタンがテキスト表記で表示されています。
Dove を使用している場合、二つのエディタを切り替えできます。
公式サイトトップページは Dove になっています。

このダウンロードした FeatherWiki_●●.html をブラウザで開いて下さい。


簡単な使い方

サイドバー New Page を選ぶと
「New Page Title」のテキストボックスが表示されるので、タイトルを入力します。
Create で「Edit Page」画面になります。本文以外は次のとおりです。

  • Page Title - タイトル。変更できます。
  • Page Slug - URL 末尾 ?page=●● の ●● 部分。重複不可
  • Page Tags - タグ。「Add Exist Tag」で使用済みのタグを選択できます。
  • Parent - 親ページを選択します。
  • Save - ページを保存します。
  • Cancel - 編集をキャンセルします。
  • Delete - このページを削除します。

この設定は  で変更できます。

Wiki Settings は Wiki 全体の設定を行えます。

  • Wiki Title - タイトル。ブラウザのタブやサイドバー上部に表示されます。
  • Wiki Description - 説明。タイトルの下に表示されます。省略可
  • Home Page - URL に ?page=●● がない場合の表示。「All Pages」でページ一覧
  • Page Order - ページの並び、改行気切りで複数ページ指定できます。
  • Custom CSS - デザインを変更したい場合、CSS をここに含めます。
  • Custom JS - 機能を追加できます。(プラグイン)
  • Include Static HTML - で <body> に本文などを含めます。
    これを指定すると検索エンジンで収集されやすくなりますが、
    .html ファイルのサイズがおよそ 2 倍になります。
  • Publish - 公開向け。 で編集関連のボタンを非表示にします。

Import & Overwrite with Other Feather Wiki file は
 アップグレード や Wiki の種類変更に使用できます。

「Existing Images」で Wiki 内でアップロードした画像の管理ができます。

ページを保存・編集・削除した後、サイドバーの Save Wiki で
反映された .html ファイルの保存になります。
必要であれば、.html ファイルの名前を変更して構いません。
また、この .html ファイルをサーバへアップロードして公開できます。


Tiddlyhost で使用する

 Tiddlyhost

Tiddlyhost は 🎈 TiddlyWiki 向けのホスティングサービスですが、
Feather Wiki にも対応しています。Tiddlyhost へ保存できる専用の Feather Wiki です。

サーバは アメリカ Dreamhost の VPS を使っているようです。
Wiki の表示で若干待たされますが、
まともに使うと Google などの検索結果は良い状態にできるかもしれません。

Sign up を選択してアカウントを作成します。

  • Email - メールアドレス。通知が届くので、まともに使っているアドレスを設定
  • Name - 名前。表示されます。
  • Username - ユーザー名。省略可。これは Wiki のサブドメインとは別 です。※
  • Password - パスワード
  • Password confirmation - パスワードをもう一度

※ 一つのアカウントで複数の Wiki を作成できる仕組みになっています。

サイト一覧になります。なにもないので Create site で Wiki を作成していきます。
(「Claim Tiddlyspot site」は旧システム Tiddlyspot からの移行です)

  • Choose a name - サブドメイン.tiddlyhost.com のサブドメインになります。
  • Private -  で非公開。ログインした時のみ表示されます。
  • Hub listed -  で  Tiddlyhost Hub に表示されます。
    不特定多数に公開したい Wiki は  を入れます。
  • Description - 説明。省略可
  • Tags - タグ。省略可

下の Show advanced settings を選択し、「Advanced settings」を表示し、
「TiddlyWiki version」で FeatherWiki を選択します。

Your sites で一覧表示されます。
サブドメイン.tiddlyhost.com を押すと、Wiki の画面になります。
右に表示されているアイコンは次のとおりです。

  •  Setting - 「Create site」と同じ画面になり、変更できます。
  •  Download - .html ファイルをダウンロードします。
    バックアップしたり、他サーバで公開できます。
  •  Link - Wiki を表示します。
  •  Upload - Wiki の .html ファイルをアップロードし、反映します。
    「Download」した TiddlyWiki の復旧、ローカルなどからの移行に使えます。
  •  Delete - 一覧から削除します。

Download の .html ファイルは他サーバへ公開できます。
他のサービスへの移行や独自ドメインを使用した公開に使用できます。
逆に .html ファイルを Upload して Tiddlyhost へ移行する事もできます。

「Save Wiki」の代わりに Save Wiki to Server と Save Wiki Locally と表示されます。
Save Wiki to Server で Tiddlyhost の .html ファイルを更新します。


サーバ保存できる Wiki を生成する

WebDAV を用いて Wiki をサーバ側に保存する事ができます。
(実際  Tiddlyhost は WebDAV を用いて Wiki 保存を実現しています)
ここでは Caddy を用いた方法で紹介していますが、
WebDAV が動作する環境であれば、使用できる可能性があります。

 Caddy
🎈 Caddy | ふうせん🎈 FU-SEN

Caddy にはプラグイン WebDAV が必要です。

 mholt/caddy-webdav | GitHub

プラグインを含む Caddy は公式のダウンロード、または xcaddy でビルドします。

 Download | Caddy
 caddyserver/xcaddy | GitHub

Caddyfile のサンプルは次で公開されています。
BASIC 認証のパスワードは ‘caddy hash-password’ で生成できます。

 Caddyfile.example | Codeberg Alamantus/FeatherWiki

Feather Wiki はサーバ保存機能を含むバージョンとなります。
Codeberg リポジトリの release からダウンロードして下さい。
これを index.html とします。

 releases | Codeberg Alamantus/FeatherWiki

  • Tern - WYSIWYG エディタ + Markdown エディタ
  • Swallow - WYSIWYG エディタ
  • Bluethroat - Markdown エディタ

Docker を用いた環境で使用する場合、Dockerfile は次のようなものです。
index.html はビルドで削除されないよう Persistent 領域に置く必要があります。
ここでは /srv が Persistent 領域にしている事とします。
Caddyfile の参照先も合わせて設定して下さい。

FROM caddy:builder AS builder
RUN xcaddy build --with github.com/mholt/caddy-webdav
 
FROM caddy:alpine
COPY --from=builder /usr/bin/caddy /usr/bin/caddy
COPY ./Caddyfile /etc/caddy/Caddyfile
COPY ./index.html /srv

ファイルサイズ

Git・Web サービスにより、1 ファイルの容量制限が存在します。
サービスにより 1 ファイル 10MB~100MB 位です。

画像ファイルなどを Wiki 内に含める事ができますが、(インポート)
ファイルサイズが大きくなるので、Wiki 外で個別にアップロードし、
URL 形式で表示するようにするのが一つの回避手段です。

また、種類・パートに応じて異なる .html ファイルに分割し、
ファイルサイズを小さくする回避手段もあります。


アップグレード

  Upgrading | Feather Wiki

Tiddlyhost を使用している場合は Download を用いて、
.html ファイルをダウンロードして下さい。

従来のバージョンの .html ファイルを開き、Wiki Settings を開いて、
「Include Static HTML」と「Publish」の  を外して保存しておきます。
生成する HTML を変更するプラグインを Custom JS に追加していた場合は、
これも削除して保存して下さい。
この場合は HTML 自体に反映させるため、
保存した後にもう一度ファイルを開いて再度保存します。

新しいバージョンの .html ファイルをダウンロード・保存します。
(この時拡張子が .txt になっているので、.html に変更します)

  releases | Codeberg Alamantus/FeatherWiki

.html ファイルを手動でアップロード・デプロイしている場合は次のバージョンです。

  • Dove - WYSIWYG エディタ + Markdown エディタ
  • Finch - WYSIWYG エディタ
  • Chickadee - Markdown エディタ

サーバ保存機能が付加されているのは次のバージョンです。
Tiddlyhost では Wiki 一覧表示で Tern_1.4.1 などと表示されています。

  • Tern - WYSIWYG エディタ + Markdown エディタ
  • Swallow - WYSIWYG エディタ
  • Bluethroat - Markdown エディタ

新しいバージョンの .html ファイルをブラウザで開きます。
サイドバー Wiki Settings より下部にある
Import & Overwrite with Other Feather Wiki file を選択します。
ここでこれまで使用していた Feather Wiki の .html を選択します。
これで Wiki の内容が反映されますので、Save Wiki をして保存します。
その時 Wiki Settings の「Include Static HTML」と「Publish」の  を外していた場合は
 を入れて有効にしてから保存します。
保存した .html ファイルを開き直して、動作を確認して下さい。

Tiddlyhost は Upload でアップグレードを行った .html ファイルを反映して下さい。


Q&A

TiddlyWiki とは何が異なるのですか?

TiddlyWiki はデフォルト状態で 2MB 以上ありますが、
Feather Wiki のデフォルト状態は 0.06MB です。

そのため、画像は WYSIWYG エディタ のアイコンのみで、
基本的にテキスト表記になっていたり、ページ構成も少なくなっています。

TiddlyWiki は 1 画面に複数の Tiddler を表示できますが、
Feather Wiki は普通に投稿のページ単位です。

Markdown を使っていますが、機能しない文法があります。

Feather Wiki の 🎈 Markdown パーサーは 1.4.1 より MD.js を採用しています。

 thysultan/md.js | GitHub

1.4.0 までは Snarkdown を採用していましたが、解釈されない事があったため、
またサイズを更に小さくできるよう、MD.js に切り替えられています。

 developit/snarkdown | GitHub

いずれもサイズの小さい Markdown パーサーのため、完全に構文を対応していません。
期待する表示にならない場合は HTML タグに変更するのが確実です。

逆に Markdown で存在していない内部リンク [[ページ]] および
[[名前|ページ]] が使用できます。
画像をアップロードした時も URL の代わりに独自のコードを使用します。

外部リンクを入れると新しいタグで開いてしまいます。

Feather Wiki の仕様により、<a href=" から始まるタグに
target="_blank" rel="noopener noreferrer を付与します。
これにより外部リンクは新しいタブ(新しいウインドウ)で開くようになります。

<a href="URL">名前</a>

これは Markdown も含まれます。

[名前](URL)

これを回避したい場合、 <a href=" でなければ付与されないので

<a href='URL'>名前</a>

または

<a href=URL>名前</a>

とすると新しいタブ(ウインドウ)で開く対象から外れます。

見出しで日本語を使うと # のリンクが正しく動作しません

1.3.1 までは日本語は - に変換されてしまいます。
したがって日本語 5 文字の見出しは URL の末尾が #----- になってしまいます。

 Non-ASCII languages cause some problems #67 | Codeberg Alamantus/FeatherWiki Issues

1.4.2 までにこの問題が対処され、
日本語の見出しでも URL をそのまま出力するようになっています。

Font Awesome を使用できますか?

🎈 Font Awesome | ふうせん🎈 FU-SEN

使用できます。 Wiki Settings 内「Custom CSS」の頭に次を含めて下さい。
6.1.2 がバージョン番号です。

@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css");

favicon を設定できますか?

Feather Wiki では favicon を考慮していないようです。
したがって Web ブラウザの仕様により、https://ドメイン/ 内では
https://ドメイン/favicon.ico を参照します。

Tiddlyhost の場合は Wiki の .html ファイルのみなので、
この方法を使用できませんが、
Wiki Settings 内「Custom JS」に次を加えて設定できます。
https://example.net.eu.org/favicon.ico を変更してご利用下さい。

document.head.appendChild(window.html`<link rel="icon" href="https://example.net.eu.org/favicon.ico">`);

日本語表示にできますか?

2022年9月現在、英語表示のみ提供されています。
日本語を含め、他の言語での表示は対応していません。

英語表示ではありますが、ページは日本語で入力できます。

Google などの検索結果に表示されますか?

 Google 検索 - site:feather.wiki

公式サイトそのものが Feather Wiki で構築されていますが、
各ページを含めて、Google の検索結果に収集されています。
しかも、公式サイトは「Include Static HTML」を使用していません。
つまり Googlebot は JSON データで入っていても正しく収集しますし、
?page=●● 付の URL も一つの検索結果として反映します。

他の検索エンジンクローラは JSON データまで収取していない可能性があるので、
「Include Static HTML」を 有効 にしても良いかもしれません。

Publish を有効にしてファイルを保存してしまいました。編集する事はできますか?

.html ファイルを Web ブラウザで参照した時、
URL 末尾に ?page=s を付けて参照して下さい。
「Wiki Settings」画面になると共に編集関連のボタンも表示されます。
この状態で「Publish」の を外して Update する事で、
編集可能な状態にできます。

現在のバージョンを知る方法は?

Web ブラウザで表示している時、右下の「Powered by Feather Wiki」のうち
Feather Wiki のところにカーソルを当てて下さい。
Version: Dove_1.3.1 などと表示されます。

またはソースを見ます。Minify が適用されているので見にくいですが、
Ctrl+F で検索フォームを表示し、 name=version と入力して下さい。
次のように meta タグが存在してバージョンが記載されています。

<meta name=version content=Chickadee_1.3.1>

別のバージョンへ変更したいのですが?

 アップグレード と同じ方法を用いて、
別のバージョンへ移行する事ができます。

Neocities で公開するとスクリーンショット表示で背景が真っ白になる事があります。

Feather Wiki が JS でデザインを展開する前に
Neocities のキャプチャが発生してしまう事があります。
背景が白い表示は Static HTML の出力なので、
「Include Static HTML」を 有効 にすれば
背景が真っ白でもある程度のテキストは出力された状態になります。

 Neocities screenshots may result in static HTML (black text and white background, no CSS). #62 | Codeberg Alamantus/FeatherWiki Issues

ページ運営者が報告していました。1.4.0 でこの問題が解決されています。

この issues で表示されているプラグインを適用していた場合は
1.4 系では不要になっているので、削除して下さい。