So fügen Sie Ihrer WordPress-Website den Dunkelmodus hinzu (einfache Methode)

Das Hinzufügen des Dunkelmodus zu WordPress-Websites ist zu einem heißen Thema unter unseren Lesern geworden. 🌙

Es geht nicht nur darum, Trends zu folgen – Forschungsergebnisse zeigen, dass der Dunkelmodus die Augenbelastung für Nachtleser reduzieren und potenziell die Akkulaufzeit auf Mobilgeräten sparen kann.

Durch unsere Erfahrung bei der Unterstützung Tausender WordPress-Benutzer bei der Anpassung ihrer Websites haben wir die effizientesten Wege zur Implementierung dieser Funktion entdeckt.

Während viele Website-Besitzer davon ausgehen, dass dies technisches Fachwissen erfordert, haben moderne WordPress-Tools dies viel zugänglicher gemacht.💡

In dieser Anleitung zeigen wir Ihnen die einfachste Methode, um den Dunkelmodus in WordPress hinzuzufügen. Wir haben diese Lösung mit verschiedenen Themes und Setups getestet, um sicherzustellen, dass sie zuverlässig und einfach hinzuzufügen ist.

Was ist der Dunkelmodus und warum sollte man ihn zu seiner Website hinzufügen?

Viele mobile Geräte und Computer verwenden den Dunkelmodus, um die Menge an weißem Licht zu minimieren, das vom Bildschirm kommt. Dies kann die Augenbelastung reduzieren, insbesondere bei schlechten Lichtverhältnissen.

Manche Leute glauben sogar, dass es ihnen ermöglicht, Computer und mobile Geräte bis spät in die Nacht zu benutzen, ohne dass das weiße und blaue Licht ihren Schlaf ruiniert.

Einige Geräte verfügen über einen integrierten Nachtmodus, der einfach wärmere Farbtöne verwendet. Der Dunkelmodus fügt dem Hintergrund des Geräts tatsächlich dunkle Farben hinzu.

Einige beliebte Websites wie YouTube bieten ein integriertes dunkles Farbschema an.

Auf Desktop-Computern können Sie Websites im Dunkelmodus besuchen, indem Sie eine Chrome-Erweiterung wie Night Eye verwenden.

So sieht die WPBeginner-Website mit dieser Erweiterung aus:

Indem Sie Ihrer Website einen Umschalter für den Dunkelmodus hinzufügen, können Benutzer den Modus wählen, den sie bevorzugen, ohne eine spezielle Browsererweiterung installieren zu müssen.

Sie können sogar den Dunkelmodus zu Ihrem WordPress-Adminbereich hinzufügen. Dies kann nützlich sein, wenn Sie nachts an Ihrer Website arbeiten oder wenn Sie unter Augenbelastung leiden.

In diesem Sinne wollen wir sehen, wie Sie den Dunkelmodus zum öffentlich sichtbaren Frontend Ihrer Website und zum Admin-Bereich Ihrer WordPress-Website hinzufügen können.

Tipp: Möchten Sie ein dunkles Farbschema verwenden, auch wenn das Gerät des Besuchers im normalen oder Tageslichtmodus ist? Dann schauen Sie sich unsere Liste der besten dunklen Themes für WordPress an.

So fügen Sie Ihrer WordPress-Website den Dunkelmodus hinzu

Der einfachste Weg, einen Dunkelmodus für Ihre Website zu erstellen, ist die Verwendung von WP Dark Mode.

Bei der Prüfung haben wir festgestellt, dass dieses Plugin einen Schalter hinzufügt, damit Besucher den Dunkelmodus auf Ihrer Website aktivieren können. Es kann sogar einen Schalter zum Admin-Bereich hinzufügen, damit Sie den Dunkelmodus für das WordPress-Dashboard aktivieren können.

Sie können mehr darüber in unserem detaillierten WP Dark Mode Testbericht erfahren.

Zuerst müssen Sie das kostenlose WP Dark Mode Plugin installieren und aktivieren. Weitere Details finden Sie in unserer Anleitung zur Installation eines WordPress-Plugins.

Besuchen Sie nach der Aktivierung die Seite WP Dark Mode » Einstellungen im WordPress-Dashboard und schalten Sie den Schalter „Frontend-Dunkelmodus aktivieren“ auf „EIN“.

Sobald Sie dies getan haben, können Sie auch einen Standardmodus für das Frontend Ihrer Website wählen. Klicken Sie anschließend auf die Schaltfläche „Änderungen speichern“, um Ihre Einstellungen zu speichern.

Wechseln Sie als Nächstes zur Registerkarte „Anpassung“, wo Sie das Layout, die Größe und die Position des Schalters anpassen können.

Sie können auch die Farbe des Dunkelmodus-Schalters ändern, aber dafür benötigen Sie die Pro-Version des Plugins.

Wenn Sie fertig sind, klicken Sie einfach auf die Schaltfläche „Änderungen speichern“, um Ihre Einstellungen zu speichern. Besuchen Sie nun Ihre WordPress-Website, um den Dunkelmodus-Schalter in Aktion zu sehen.

Wenn Sie die mobile Version Ihrer Website ansehen, werden Sie sehen, dass der Dunkelmodus auch auf Smartphones und Tablets funktioniert.

Dunkelmodus zum Admin-Bereich Ihres WordPress hinzufügen

Sie können das Admin-Farbschema in WordPress ändern, indem Sie die integrierten Einstellungen verwenden. Keines der Standard-Farbschemata reduziert jedoch das weiße Licht, das vom Bildschirm kommt.

Wenn Sie spät abends arbeiten oder unter Augenbelastung leiden, können Sie versuchen, einen Dunkelmodus für den WordPress-Adminbereich und den Block-Editor hinzuzufügen.

Besuchen Sie dazu die Seite WP Dark Mode » Einstellungen und wechseln Sie in der linken Spalte zur Registerkarte „Admin-Bereich Dunkelmodus“.

Schalten Sie hier den Schalter für die Option „Admin-Dashboard-Dunkelmodus aktivieren“ auf „EIN“ und klicken Sie auf die Schaltfläche „Änderungen speichern“.

Sobald Sie das getan haben, werden Sie feststellen, dass der Dunkelmodus-Schalter oben in Ihrem WordPress-Dashboard vorhanden ist.

Von hier aus können Sie den Schalter umlegen, um diesen Modus jederzeit zu aktivieren.

Wenn Sie auch einen Dunkelmodus für den Block-Editor hinzufügen möchten, müssen Sie den Schalter „Block-Editor Dunkelmodus“ auf „EIN“ stellen.

Klicken Sie dann auf die Schaltfläche „Änderungen speichern“.

Öffnen Sie nun eine Seite oder einen Beitrag im Inhaltseditor. Sie werden ein Dunkelmodus-Symbol oben bemerken. Klicken Sie darauf, um den Tab zu erweitern und die Option „Dunkelmodus“ auszuwählen.

So wird Ihr Block-Editor im Dunkelmodus aussehen.

Video-Tutorial

WPBeginner abonnieren

Wir hoffen, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie den Dunkelmodus zu Ihrer WordPress-Website hinzufügen. Möglicherweise möchten Sie auch unseren Leitfaden zum Auswählen eines perfekten Farbschemas für Ihre WordPress-Website oder unsere Expertenauswahl für die besten WordPress Theme Builder ansehen, um Ihre Website anzupassen.

Wenn Ihnen dieser Artikel gefallen hat, abonnieren Sie bitte unseren YouTube-Kanal für WordPress-Video-Tutorials. Sie finden uns auch auf Twitter und Facebook.