WordPressウェブサイトにダークモードを追加する方法（簡単な方法）

WordPressウェブサイトにダークモードを追加することは、読者の間で話題になっています。🌙

トレンドを追うだけではありません。調査によると、ダークモードは夜間の読書における目の疲れを軽減し、モバイルデバイスのバッテリー寿命を節約できる可能性があります。

多くのサイト所有者は技術的な専門知識が必要だと考えていますが、最新のWordPressツールにより、はるかにアクセスしやすくなりました。💡

このガイドでは、WordPressにダークモードを追加するための実績のある方法を共有します。このソリューションは、さまざまなテーマやセットアップでテスト済みであり、信頼性が高く簡単に追加できることを保証します。

ダークモードとは何ですか？なぜウェブサイトに追加するのですか？

多くのモバイルデバイスやコンピューターでは、画面からの白い光の量を最小限に抑えるためにダークモードが使用されています。これにより、特に暗い場所での目の疲れを軽減できます。

ダークモードを使用すると、夜遅くまでコンピューターやモバイルデバイスを使用できます。白い光や青い光が睡眠を妨げるのを防ぐのに役立ちます。

ダークモードは、視覚障害のある人にも役立ちます。光過敏症（羞明）のあるユーザーのアクセシビリティを向上させます。

一部のデバイスには、単に暖色系の色調を使用する組み込みのナイトモードが搭載されています。しかし、ダークモードは実際にはデバイスの背景に暗い色を追加します。YouTubeのような人気のウェブサイトの中には、組み込みのダークカラースキームを提供しているものもあります。

デスクトップコンピューターでは、Night EyeのようなChrome拡張機能を使用して、ダークモードでウェブサイトを閲覧できます。

その拡張機能を使用したWPBeginnerウェブサイトの外観はこちらです：

ウェブサイトにダークモードトグルを追加することで、ユーザーは特別なブラウザ拡張機能をインストールすることなく、好みのモードを選択できます。

WordPress管理エリアにダークモードを追加することもできます。これは、夜間にサイトで作業する場合や、目の疲れに悩んでいる場合に役立ちます。

これを踏まえて、ウェブサイトの公開フロントエンドと WordPress ウェブサイトの管理エリアにダーク モードを追加する方法を見てみましょう。

ヒント：訪問者のデバイスが通常のモードまたは昼間のモードであっても、ダークカラー配色を使用したいですか？それなら、WordPress向けの最高のダークテーマのリストをご覧ください。

WordPressウェブサイトにダークモードを追加する方法

ウェブサイトのダークモードを作成する最も簡単な方法は、WP Dark Modeを使用することです。

このプラグインはトグルを追加するため、訪問者はあなたのウェブサイトでダークモードを有効にできます。管理画面にもトグルを追加できるため、WordPressダッシュボードでダークモードを有効にすることもできます。

詳細については、WP Dark Modeのレビューで詳しく知ることができます。

まず、無料のWP Dark Modeプラグインをインストールして有効化する必要があります。詳細については、WordPressプラグインのインストール方法に関するガイドをご覧ください。

有効化したら、WordPressダッシュボードからWP Dark Mode » 設定ページにアクセスし、「フロントエンドダークモードを有効にする」スイッチを「ON」に切り替えます。

それが完了したら、ウェブサイトのフロントエンドのデフォルトモードを選択することもできます。

その後、「変更を保存」ボタンをクリックして設定を保存します。

次に、「カスタマイズ」タブに切り替えて、スイッチのレイアウト、サイズ、位置をカスタマイズします。

ダークモードスイッチの色を変更することもできますが、そのためにはプラグインのプロバージョンが必要です。

完了したら、「変更を保存」ボタンをクリックして設定を保存します。次に、WordPressサイトにアクセスして、ダークモードトグルが機能していることを確認してください。

ウェブサイトをモバイルまたはタブレットで表示することもできます。これにより、ダークモードがモバイルデバイスでも機能することを確認できます。

WordPress管理画面にダークモードを追加する

組み込みの設定を使用して、WordPressの管理画面の配色を変更することができます。ただし、デフォルトの配色では、画面からの白い光を軽減するものはありません。

夜遅くまで作業する場合や、目の疲れに悩んでいる場合は、WordPress の管理画面とブロックエディターにダークモードを追加することを試すことができます。

これを行うには、WP Dark Mode » 設定ページにアクセスし、左側の列から「管理パネルダークモード」タブに切り替えます。

ここで、「管理画面ダークモードを有効にする」オプションのスイッチを「ON」に切り替え、「変更を保存」ボタンをクリックします。

それを行うと、WordPressダッシュボードの上部にダークモードスイッチが表示されていることに気づくでしょう。

ここから、いつでもこのモードを有効にするためにスイッチを切り替えることができます。

ブロックエディターにもダークモードを追加したい場合は、「ブロックエディターダークモード」スイッチを「ON」に切り替える必要があります。

次に、「変更を保存」ボタンをクリックします。

次に、コンテンツエディターでページまたは投稿を開きます。上部にダークモードアイコンが表示されます。それをクリックしてタブを展開し、「ダークモード」オプションを選択します。

これは、ブロックエディターがダークモードでどのように表示されるかです。

動画チュートリアル

WPBeginnerを購読する

WordPress のダークモードに関するよくある質問

WordPress でダークモードを有効にする前に、読者からよく寄せられる質問をいくつかご紹介します。

WordPress にはナイトモードがありますか？

いいえ、WordPressにはウェブサイトのフロントエンド用の組み込みナイトモード機能はありません。この機能を追加するには、WP Dark Modeのようなプラグインを使用するか、特定のダークテーマをインストールする必要があります。

テーマをダークモードに変更するにはどうすればよいですか？

現在のテーマをダークモードに変更する最も簡単な方法は、トグルスイッチを追加するプラグインをインストールすることです。または、外観 » テーマ に移動して、ダークカラー配色で設計されたテーマを有効にすることもできます。

ダークモードの欠点は何ですか？

主な欠点は、明るい日差しの環境ではダークモードの可読性が低下することです。さらに、標準のロゴやダークな要素を含む透過画像は、暗い背景に対して消えたり、歪んで見えたりする可能性があります。

目のためにはどのカラーモードが最適ですか？

ダークモードは、まぶしさと画面のちらつきを軽減するため、通常は低照度条件下で目に最適です。ただし、日中や明るい部屋での可読性やテキストの理解には、ライトモードの方が適していることがよくあります。

ダークモードを使用している人の割合は？

最近のデータによると、モバイルユーザーの80%以上がデバイスでダークモードを使用することを好んでいます。ウェブサイトでこのモードをサポートすることは、ユーザーの大多数の好みに対応していることを保証します。

ダークテーマは目に健康的ですか？

はい、ダークテーマは、目に当たる強いブルーライトの曝露を最小限に抑えるため、目に健康的である可能性があります。ブルーライトのこの低減は、デジタル眼精疲労を防ぐのに役立ち、夜遅くにデバイスを使用する場合、睡眠の質を改善する可能性があります。

このガイドが、WordPressウェブサイトにダークモードを追加する方法を学ぶのに役立ったことを願っています。また、WordPressサイトに最適な配色を選択する方法に関するガイドをご覧になるか、サイトをカスタマイズするための最高のWordPressテーマビルダーの専門家による選択肢をご覧ください。

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterやFacebookでも私たちを見つけることができます。