このトピックでは、Theme CLI と Theme Creator サイトを使用して、テーマを開発し、変更内容をライブの Discourse サイトでプレビューする方法を説明します。
まだ行っていない場合は、こちらから Meta のアカウントにサインアップ してください。
Theme Creator にログイン します。
こちらの手順 に従って、Theme CLI をインストールします。
Theme Creator で新しいテーマを作成するには、次の手順を実行します。
高度な設定 (advanced) をクリックし、次に ローカルで編集 (edit locally) をクリックし、API キーを取得 (retrieve API key) をクリックします。
生成された API キーをコピーします。
コマンドラインに戻り、discourse_theme download example-folder と入力します。ここで、example-folder はテーマがローカルに保存される場所です。プロンプトに従ってください。
Discourse サイトのルート URL として https://discourse.theme-creator.io を入力します。
プロンプトが表示されたら、前の手順で取得したAPI キー を入力します。
プロンプトに従って進み、手順 4 で作成したテーマを選択します。
テーマの監視を開始するかどうか尋ねられたら、「はい (yes)」と入力します。
これで、ローカルのテーマフォルダーが監視され、変更が Theme Creator に自動的にアップロードされます。Theme Creator でテーマの設定にある プレビュー (preview) をクリックすると、テーマのプレビューを開くことができます。
変更の監視を停止するには、コマンドラインウィンドウで ctrl + c を押します。変更の監視を再度開始するには、discourse_theme watch example-theme と入力します。
テーマの構造と可能なことについての詳細な情報は、こちらの Developing Discourse Themes & Theme Components をご覧ください。
このドキュメントはバージョン管理されています。変更の提案は github からお願いします。
← START DOCS ASSET MAP
「いいね！」 42
こんにちは。これらの指示に従おうとしていますが、行き詰まっています。APIキーを追加した後、次のように表示されます。
/usr/local/lib/ruby/gems/3.2.0/gems/discourse_theme-0.7.3/lib/discourse_theme/cli.rb:100:in `run': undefined method `exists?' for Dir:Class (NoMethodError)
FileUtils.mkdir_p dir unless Dir.exists?(dir)
^^^^^^^
Did you mean? exist?
from /usr/local/lib/ruby/gems/3.2.0/gems/discourse_theme-0.7.3/bin/discourse_theme:6:in `<top (required)>'
from /usr/local/lib/ruby/gems/3.2.0/bin/discourse_theme:25:in `load'
from /usr/local/lib/ruby/gems/3.2.0/bin/discourse_theme:25:in `<main>'
何か原因がお分かりになりますか？
「いいね！」 1
leonardo
2023 年 1 月 24 日午後 9:47
21
こんにちは！
「いいね！」 6
なるほど、そういうことでしたか。
「いいね！」 1
leonardo
2023 年 1 月 25 日午後 8:03
23
これは修正されました - discourse_theme は gem バージョン 0.7.4 以降の Ruby 3.2.x で動作するはずです
「いいね！」 3
すごい、早かったですね
rbenv install 3.1.3
これは、ターミナルタブを閉じて再度開くまで実際には機能しませんでした。
discourse_theme watch はライブリロードされなくなりましたか？以前は保存するとテーマが更新されていましたが、今は手動でタブを更新する必要があります。コンソールには理由を示すものは何も表示されません。
「いいね！」 1
Moin
2026 年 1 月 27 日午前 8:38
26
少し前に変更がありました
Live reloads of stylesheets have been disabled for production instances , because they were causing problems when updating themes and/or Discourse core.
Fundamentally: stylesheet changes are often tied to changes in JS/HTML, so live-loading for only stylesheets is risky. Users end up running ‘new’ stylesheets against ‘old’ HTML, which can lead to some very strange experiences.
Live-loading is still enabled for development-mode Discourse instances. Ideally, you’d use that for development rather …
Live Reload in Production にも興味があるかもしれません
「いいね！」 4
micke
2026 年 5 月 7 日午後 2:04
27
https://discourse.theme-creator.io/ でテーマを正しくプレビューする方法を理解しようとしています。
discourse_theme watch は正常に動作しており、変更がプレビュー URL に同期されています。about.json に color_schemes を追加したテーマをスケジューリングしました。それらは /me/theme 下のテーマの選択ボックスに表示されています。しかし、実際にスHEME/パレットを選択して表示することができず、代わりに自分で指定していない「Light」というデフォルトのものに固定されてしまいます。
また、about.json から指定した名前付きカラースケームが /me/preferences/interface 下にも表示されません。
何が間違っているのでしょうか？
ありがとうございます！
これで、編集して変更をライブで確認できるローカルのテーマディレクトリができました！
