-
投稿者投稿
-
2025年9月30日 4:31 AM #7057
【お使いの unitone のバージョン】23.5.0
【お使いのブラウザ】Chrome ・Vivaldi
【当該サイトのURL】制作中のサイトです### 発生している問題
子テーマを有効化すると、unitoneセットアップやエディターで設定した背景色と文字色が反映されない(実際のページ・エディターともに)
### 試したこと
- 選択中のテーマバリエーションを削除して、背景色と文字色を再度設定
- 変化はありませんでした
- 子テーマを無効化
- 正しく反映されるようになりました
- 子テーマを有効化したまま、CSSで上書き
- 下記のCSSを確認したため上書きしたところ、正しく反映されるようになりました
上書き前
:root :where(.editor-styles-wrapper), :root :where(.editor-styles-wrapper) { background-color: var(--wp--preset--color--unitone-background); color: var(--wp--preset--color--unitone-text); font-family: var(--unitone--font-family); }
:root :where(body) { background-color: var(--wp--preset--color--unitone-background); color: var(--wp--preset--color--unitone-text); font-family: var(--unitone--font-family); }
上書きしたコード
:root :where(body), :root :where(.editor-styles-wrapper) { background-color: var(--unitone--color--background); color: var(--unitone--color--text); }
以前も子テーマで制作したことがあり、その時は特に問題なかったかと思います。そもそも子テーマが推奨されていないかもしれないので、個人的なカスタマイズの範疇になるようでしたら申し訳ありません…!
上記のコードによって他への影響がないようでしたらこのまま進めてみようと思いますので、お手隙の際にご確認いただけますと幸いです。よろしくお願いいたします。
♥ 0いいねをした人: いません2025年9月30日 12:12 PM #7058手元の環境で、子テーマに切り替えて、セットアップ画面で背景色等を設定(カラーパレットから色を選択)してみました。
こんな感じで、正しく反映されているように見えます。
同じ状況を手元で再現したいので、どのような手順でどの色を設定したのかを具体的に教えてください!♥ 0いいねをした人: いません2025年9月30日 11:06 PM #7059早速のご確認ありがとうございます。こちらでも、一度まっさらな子テーマを作って試したところ正しく反映されました。
改めて一つずつ設定を進めながら調べたところ、直接の原因は子テーマではなくテーマバリエーションの作成に関係している可能性が出てきました。新規のWordPressにて下記の手順で進めると同じ状況になります。
- unitoneを有効化(今回は子テーマを作っていません)
- エディター>スタイル にてパレットにカスタムの色を追加し、要素に色設定して保存
- 文字色にはカスタムに追加した#000、背景色にはカスタムに追加した#FFFを設定しました
- この時点で色を変えたところ、選択時にリアルタイムでプレビューはされませんでしたが、リロードすると正しく反映されました
- Create Block Themeプラグインでテーマバリエーションを作成
- 作成したパレットを選択すると背景色が見えなくなり、保存した後は色を変えても反映されなくなりました
TT5でも同じ手順で試してみたところ、色変更は正しく反映されました。いずれもLocalにて作業しましたが、環境による問題など考えられるでしょうか。
♥ 0いいねをした人: いません2025年10月1日 12:34 PM #7060Create Block Theme が久しぶりなので教えてください!
「Create Block Themeプラグインでテーマバリエーションを作成」というのは、下記の画像の操作であっていますでしょうか?
こちらの環境では、「”unitone” の複製を作成する」をクリックしてテーマを作成し、テーマが切り替わった段階で Fatal Error となりました。
(テーマ内にある全ての「unitone」という文字列を、新しいテーマの名前に強制置換して新しいテーマが作成されるため、ファイルの読み込み等に失敗してエラーとなる)
♥ 0いいねをした人: いません2025年10月1日 12:38 PM #7061ちなみに、「”unitone” の子テーマを作成する」の場合でも、unitone が持つブロックの名前(例:
unitone/section
)が、新しい名前のテーマに置換されてしまい(例:unitone-child/section
)、そのようなブロックは実際には無いため、表示が崩れてしまいました。♥ 0いいねをした人: いません2025年10月1日 1:05 PM #7062Create Block Themeプラグインでテーマバリエーションを作成
エディターを開いたあとの下記画像の部分から進み、jsonファイルを作成しています。カラーパレットやフォントの設定などスタイル部分のみを保存しています。
子テーマのご確認もありがとうございます。私は子テーマを作成するときにはプラグインを使っておらず、手動でディレクトリや必要なファイルを作成しています。この方法ではこれまで崩れなどが起きたことはありませんでした!
♥ 0いいねをした人: いません2025年10月1日 2:20 PM #7063エディターを開いたあとの下記画像の部分から進み、jsonファイルを作成しています。カラーパレットやフォントの設定などスタイル部分のみを保存しています。
ありがとうございます!
※試してみたところ、テーマフォルダの中に、json ファイルが作成されました。子テーマを使っていれば大丈夫ですが、unitone を直接使っている場合はアップデートで json ファイルが消えてしまうので注意が必要そうです。ご存知かもしれませんが念の為…。
調査したところ、どうも WordPress 的には色は変更されているんだけれども、unitone の CSS で上書きされていて、見た目上は変更されていないように見える、という感じになっているみたいだったので、諸々変更を入れてみました。
↑から zip ファイルをダウンロード&解凍して、お使いの環境の unitone と入れ替えて、動作が改善されるか確認してみてください!
♥ 0いいねをした人: いません2025年10月2日 10:31 AM #7068おかしなところがあったので、再度修正しました!
♥ 0いいねをした人: いません2025年10月2日 11:58 AM #7070ご連絡が遅くなり申し訳ありません。先ほどテーマを入れ替えてみたところ、テーマバリエーション選択時にも色が反映されるようになりました!プレビューにもリアルタイムで反映されるようになっております。
unitone を直接使っている場合はアップデートで json ファイルが消えてしまうので注意が必要そうです。ご存知かもしれませんが念の為…。
今回は検証にあたりunitoneの中に直接テーマバリエーションを作成してみましたが、普段は子テーマ内で行っているのでこちらも問題なさそうです。お気遣いいただきありがとうございます。
制作中にテーマバリエーションの機能を使って設定を保存することがよくあるため大変助かりました。お忙しい中、いつも迅速なご対応ありがとうございます!
♥ 0いいねをした人: いません2025年10月3日 8:05 PM #7081まだおかしいところがあったので、再度変更を入れてみましたので共有します。
他の方からも不具合の報告などがないか一定期間様子をみたあと、正式版をリリースしたいと思います。
- 選択中のテーマバリエーションを削除して、背景色と文字色を再度設定
-
投稿者投稿
- トピック「子テーマを有効化すると、エディターで設定した背景色と文字色が反映されなくなる」には新しい返信をつけることはできません。