ダークモード切り替えプラグイン for EC-CUBE 4.1

このプラグインでできること
EC-CUBE 4.1のフロントエンドヘッダーに、テーマカラーを切り替えるアイコンボタンを追加できます。
クリックするたびに、システム設定、ライトモード、ダークモードの順番で表示モードを切り替えられます。
システム設定ではOSやブラウザの設定に追従します。
ライトモードでは明るい表示に固定できます。
ダークモードでは暗い表示に固定できます。
選択したモードはlocalStorageに保存され、ページを跨いでも維持されます。

導入することで解決できる課題
ユーザーごとに見やすい画面の明るさや色味が異なる場合でも、閲覧者自身が好みの表示を選べるようになります。
夜間や暗い環境で閲覧するお客様にとって、明るすぎる画面による見づらさを軽減できます。
OSやブラウザのテーマ設定に合わせたいお客様にも対応しやすくなります。

導入後に得られるメリット
フロントエンドの使いやすさを高め、閲覧時の快適さ向上に役立ちます。
表示モードの選択状態が保存されるため、お客様はページを移動しても選んだ表示を継続できます。
ヘッダーから切り替えられるため、日々の買い物中でも直感的に操作できます。
サイトのUI改善として、利用者に配慮した表示環境を提供しやすくなります。

想定される利用シーン
夜間の閲覧が多いサイトで、暗めの表示を選べるようにしたい場合に役立ちます。
PCやスマートフォンのシステム設定に合わせた表示を提供したい場合に利用できます。
ファッション、雑貨、デジタル商品など、見た目や閲覧体験を重視するショップのUI改善にも活用できます。
お客様自身にライトモードとダークモードを選んでもらいたいサイトに適しています。

運用時の注意事項
ご利用に際しては、導入先のテーマやカスタマイズ内容と合わせて、十分に動作確認を行ってください。
ダークモード表示時に文字色、背景色、画像、ボタンなどが見づらくならないか確認してください。
本プラグインはlocalStorageを利用して選択状態を保存します。
ブラウザ設定や利用環境によっては、保存状態の挙動が異なる場合があります。
本プラグインの仕様に関して動作を保証するものではありません。

EC-CUBE4.1に対応したダークモード切り替えプラグイン ver1.0.0 をリリースしました。
フロントエンドヘッダーにテーマカラーを切り替えるアイコンボタンを追加できます。
システム設定、ライトモード、ダークモードの3モードを切り替えられます。
選択したモードはlocalStorageに保存され、ページを跨いでも維持されます。