カスタムテーマで、希望するライトとダークのパレットを選択するには?

カスタムテーマでのライトモードとダークモードのカラーパレットのサポート方法が少しわかりません。新しいテーマを編集してパレットを選択する際、1つしか選択できません。プレビューしてみると、ダークモードを使用しているのにカラーパレットが表示されませんでした。設定(OS設定)をライトモードに切り替えると、カスタムパレットが表示されました。質問は、テーマが1つのパレットしか選択できない場合、ライトモード用のカスタムパレットXとダークモード用のカスタムパレットYに新しいテーマをどのように「バインド」するのか、ということです。

「いいね!」 1

ユーザー設定で、ダークモードの配色をデフォルトとは異なるものに設定している可能性があります。

すべてのカラーパレットは /admin/customize/colors で確認できると思います。

現在、サイトはダークモードのカラースキームとして選択されたカラースキームを持つ必要があります。2つのモードを持つようにカラーパレットシステムに組み込まれていません。

しかし、私たちはこれをより直感的にし、すべてのテーマにネイティブのライトモードとダークモードを含めるようにする作業に深く取り組んでいます。ユーザーの好みがどちらを表示するかを決定します。これらのアップデートのETAはまだありませんが、非常に進んでおり、カラーパレットのライトモードとダークモード(およびその他の関連する改善)を近日中に公開したいと考えています。

「いいね!」 4

「しかし、私たちはこの機能をより直感的にし、すべてのテーマにネイティブのライトモードとダークモードを含めるための作業に深く取り組んでおり、ユーザーの好みに応じてどちらを表示するかを決定します。」

ただし、明確にしておきたいのは、ユーザーにオプションを提供したくない場合、つまりサイトのライト/ダークカラースキームだけを使用する場合、それは可能ですよね?

まだ少し混乱しています。テーマはライトモードにはカスタムで選択したカラースキームを使用し、ダークモードには…別の何かをするということですか?デフォルトのダークモードを編集できれば、ユーザーが選択できるN個のテーマは必要ないので、それでうまくいきます。もしそうなら、どのスキームを編集すればよいのか、どうすればわかりますか?

はい、可能です。

2つのカラーパレットを作成するか(または既存のものをカスタマイズします)。私はWCAGのライトパレットに基づいて「ピンク」のカラーパレットを作成し、WCAGのダークパレットをカスタマイズして「ダークピンク」のカラーパレットを作成しました。ユーザーがライトモードでもダークカラーパレットを選択できるようにしたくないと仮定すると、「color palette can be selected by users」が無効になっていることを確認します。それがすべてのパレットで無効になっている場合、ユーザーインターフェイス設定のドロップダウンは消えます。

そうすれば、ユーザーは次のものしか見えなくなります。


メタのこちらで表示されるカラーセレクターの代わりに。

ダークパレットを、default dark mode color scheme IDサイト設定でダークモードのサイト全体のデフォルトカラーパレットとして設定します。

そして、ライトパレットをテーマのカラーパレット設定に入れます。

現在の制限は、例えばライトとダークブルーのパレットをさらに2つ簡単に作成し、ユーザーがピンクとブルーの間で選択できるようにできないことです。テーマに接続されているライトカラーパレットは正常に機能しますが、そのテーマに対して異なるデフォルトのダークパレットを持つことはできません。しかし、ライトとダークのカラーパレットを1つだけ欲しい限り、現在のオプションで十分です。

「いいね!」 5

ありがとうございます。試してみます!

はい、今後のライトおよびダークパレットのサポートにより、これは簡単に行えるようになります。@Moin が指摘しているように、このようなことはすでに可能ですが、最も直感的な方法ではありません。

今後の変更により、すべてのパレットにはパレットの一部としてライトモードとダークモードの両方が含まれます。これには、テーマに含まれるカラーパレットと、管理画面で作成および編集できるパレットの両方が含まれます。必要に応じてデフォルトを選択できるようになります。

「いいね!」 4

楽しみに待っています。この情報を見つけるために、たくさんのトピックを漁る必要がありました。とりあえず、このトピックの提案に従います。

「いいね!」 1

これはすでに実装されていますか?

「いいね!」 1

まだですが、進捗しています。最優先事項ですので、今後数週間でいくつかリリースされる予定です。

「いいね!」 2