So fügen Sie Ihrer WordPress-Website den dunklen Modus hinzu
Veröffentlicht: 2021-06-14Der dunkle Modus wird heutzutage sowohl auf Websites als auch in Apps sehr verbreitet. Die Portabilität des Umschaltens zwischen Dunkelmodus und Normalmodus gibt dem Benutzer die Freiheit, die Website nach seinen Vorlieben zu lesen oder anzuzeigen.
Der Dunkelmodus ist besonders dann sehr nützlich, wenn Sie Ihre Website nachts lesen. Dies stellt sicher, dass weniger Licht auf Ihre Augen gestrahlt wird, wodurch die Augenbelastung verringert wird.
Darüber hinaus reduziert der Dunkelmodus häufig die Belastung durch schädliches blaues Licht und erhöht häufig die Akkulaufzeit Ihres Geräts, das Sie zum Lesen der Website verwenden.
Möchten Sie Ihrer WordPress-Website einen dunklen Modus hinzufügen? Wenn ja, dann sind Sie hier richtig, denn heute geben wir Ihnen eine vollständige Anleitung, wie Sie den WordPress Dark Mode in Ihrer WordPress-Website im Frontend sowie im Admin-Bereich auswählen können.
Was ist Dark Mode?
Sie finden Dunkelmodi in Handys und PCs oder Laptops und der Dunkelmodus reduziert die Menge des vom Bildschirm emittierten weißen Lichts. Einige Gadgets enthalten einen Nachtmodus, der wärmere Farbtöne anstelle von kühleren verwendet. Der Dunkelmodus verfolgt einen anderen Ansatz, indem er den Hintergrund mit dunklen Farbtönen füllt.
Warum den Dark Mode in Ihre WordPress-Website einfügen?
Der Dunkelmodus bietet dem Benutzer ein besseres Erlebnis beim Betrachten Ihrer Websites bei Nacht, da er das direkte Licht reduziert, das emittiert wird, das für die Augen sehr irritierend und schädlich sein kann. Darüber hinaus bedeutet das Hinzufügen eines Dark-Mode-Plugins zu Ihrer WordPress-Site, dass Sie die Wahl haben, den Dark-Modus sowohl ein- als auch auszuschalten. Darüber hinaus haben Sie mehr Autorität darüber, wie Ihre Website im Dunkelmodus aussieht. Der Dunkelmodus funktioniert auch wie ein Nachtmodus in der WordPress-Website
Mit dem Dark Mode WordPress Plugin können Sie dies nicht unbedingt nur im Frontend verwenden, sondern können den Dark Mode auch für den WordPress-Admin verwenden, was bedeutet, dass Sie nachts selbst eine bessere Arbeitserfahrung machen können.
So fügen Sie Ihrer WordPress-Website den dunklen Modus hinzu
Unten werden wir Ihnen beibringen, wie Sie den Dark Mode in Ihre WordPress-Website einfügen. Bitte befolgen Sie die Schritte sorgfältig, da dies sehr einfach ist und nur ein paar Minuten dauert, um den gesamten Vorgang abzuschließen.

Schritt 1: Installieren des Plugins
Der erste und wichtigste Schritt besteht darin, den Droit Dark Mode von DroitThemes herunterzuladen und zu installieren. Dies ist eines der besten WordPress Dark Mode-Plugins auf dem Markt und Sie können auch auf die kostenlose Version zugreifen, um die Funktionen zu überprüfen, bevor Sie tatsächlich Geld dafür bezahlen.
Es gibt 3 Möglichkeiten, das WordPress-Plugin zu installieren.
Methode 1: Zuerst sollte das Plugin heruntergeladen und entpackt werden. Entpacken Sie danach die Datei 'droit-dark-mode.zip' und legen Sie sie in das Verzeichnis ' /wp-content/plugins/ ' ab. Im letzten Schritt müssen Sie zu Plugins » Admin gehen und das Plugin aktivieren.
Methode 2: Ein weiterer Schritt, dem Sie folgen können, besteht darin, dieses Dark Mode-Plugin zu installieren . Dashboard »Plugin» Hinzufügen »Suche 'Droit Dunkel Mode'» Install »Aktiv.

Methode 3: Es gibt noch einen weiteren Schritt. Zuerst sollte 'droit-dark-mode.zip' heruntergeladen werden, dann folgen Sie den Schritten: Dashboard > Plugin > Neu hinzufügen > Zip-Datei hochladen » Aktiv.
Schritt 2: Überprüfen des dunklen Modus
Navigieren Sie nach der Aktivierung zur Seite Einstellungen » Droit Dark Mode Ihres WordPress-Administrators und wählen Sie die Registerkarte Allgemeine Einstellungen . Sie sollten sofort dorthin geleitet werden. Wenn das Gerät eines Besuchers in den Dunkelmodus versetzt wird, wird ihm sofort die Dunkelmodus-Version Ihrer Website angezeigt.

Sie finden auch eine Option „Stil wechseln“, die Sie nach Belieben ein- oder ausschalten können; standardmäßig ist es aktiviert. Dieser Schalter kann überall auf Ihrer Website angezeigt werden und der Benutzer kann mit diesem Schalter zwischen Dunkelmodus und Normalmodus wählen.
Sie finden diesen Schalter standardmäßig in der unteren rechten Ecke Ihrer Website. Besuchen Sie Ihre Website als normaler Besucher und Sie können auf den Schalter klicken, um Ihre Website einfach in den dunklen Modus zu wechseln.
Schritt 3: Erweiterte Einstellungen
Nun, The Droit Dark Mode ist sowohl als kostenloses Plugin als auch als kostenpflichtige Version erhältlich. Die kostenlose Version bietet Ihnen nicht allzu viele Anpassungsoptionen, während Sie mit der kostenpflichtigen Version dieses Dark-Mode-Plugin nach Belieben anpassen können.
Sie finden die Anpassungsoptionen auf der Seite Einstellungen » Droit Dark Mode » Erweiterte Einstellungen und es gibt zusätzliche Anpassungsmöglichkeiten. Sobald Sie sich entschieden haben, ob Sie den dunklen oder hellen Modus verwenden möchten, wird er standardmäßig gespeichert.
Ändern des Schalterstils
Um beispielsweise den Stil des Dunkelmodus-Umschalters zu ändern, klicken Sie einfach auf die Registerkarte Anzeigeeinstellungen : Es gibt mehrere Umschaltstile, aus denen Sie auswählen und auf Ihrer Website verwenden können. Sie können auch das Elementor-Widget verwenden, um dem Inhalt eines Beitrags oder einer Seite einen Schalter-Button hinzuzufügen.
Der Gutenberg-Block kann verwendet werden, um dem Inhalt eines Posts oder einer Seite einen Switch-Button hinzuzufügen.
Wie schön ist es, wenn Sie die Möglichkeit haben, den Schalter in verschiedene Positionen zu stellen. Nun, das ist jetzt auch dank des Droit Dark Mode Plugins möglich, da Sie die Schalter an verschiedenen Positionen auf Ihrer Website platzieren können, beginnend von links oben, links unten, rechts oben. rechts-unten, Mitte-unten, Mitte-oben und so weiter.
In der kostenlosen Version; Sie haben 2 Dark Mode Switcher-Optionen zur Auswahl.

Der Benutzer kann die Schalterposition ändern und sie auf jedem Inhalt, Beitrag oder Seite platzieren, indem er entweder das Element oder das Widget oder den Gutenberg-Block verwendet. Der Schalter kann in verschiedene Positionen bewegt werden, indem Sie einfach auf den Schalter klicken und die Maus durchziehen, um die genaue Position zu finden.

Ändern der Farben des dunklen Modus
Sie haben mehrere Farbvoreinstellungen zur Auswahl aus einer Auswahl von mehr als 10 einzigartigen Farbvoreinstellungen, um die Farbe des Dunkelmodus schnell aus der Farbpalette zu ändern. Gehen Sie einfach zur Einstellung Droit Dark Mode, scrollen Sie dann zu den Stileinstellungen und Sie finden die Einstellung für die Farboptionen, die Sie nach Ihren Wünschen anpassen können.
Darüber hinaus sind alle wichtigen Themes auf dem Markt mit dem Droit Dark Mode-Plugin kompatibel, sodass Sie abgedeckt sind.
In der kostenlosen Version haben Sie die Möglichkeit zwischen 2 Farben zu wählen.

So fügen Sie Ihrem WordPress-Administrator den dunklen Modus hinzu
Bisher haben wir Ihnen gezeigt, wie Sie das Droit Dark Mode-Plugin zu Ihrer WordPress-Website hinzufügen, jetzt zeige ich Ihnen, wie wir dies im Admin hinzufügen können.
Wie Sie vielleicht bereits wissen, bietet WordPress viele verschiedene Admin-Farbschemata, aber leider hat keines von ihnen den Dunkelmodus und kann das Licht reduzieren. Die einfachste und effektivste Lösung ist also die Verwendung des Droit Dark Mode-Plugins.
Schritt 1: So fügen Sie hinzu
Navigieren Sie einfach zur Registerkarte Allgemeine Einstellungen auf der Seite Einstellungen » Dunkelmodus. Aktivieren Sie dann die Einstellung "Backend Dark Mode aktivieren". Denken Sie daran, Ihre Einstellungen zu speichern, indem Sie unten auf der Seite auf die Schaltfläche Einstellungen speichern klicken: Und jetzt sollte sich oben in der Admin-Leiste ein Schalter befinden, mit dem Sie einfach zwischen Hell- und Dunkelmodus wechseln können.

Schritt 2: Weitere Anpassungsoptionen und Funktionen
Schauen wir uns einige Funktionen an, die Sie in diesem Dark Mode-Plugin im Admin-Bereich finden.
Auswahl der Farbe
Wählen Sie je nach Browser eine Farbvorgabe für das Admin-Dashboard. Sie können eine Farbvorgabe für die dunklen und hellen Admin-Dashboards festlegen. Dies bedeutet, dass Sie während der Arbeit an Ihrer WordPress-Website vollen Zugriff haben, um die Farbe nach Ihren Wünschen auszuwählen.
Da Dark Mode kein Admin-Farbschema ist, können Sie es problemlos mit einem bereits in WordPress vorhandenen kombinieren. Gehen Sie dazu zu Benutzer » Profil und wählen Sie im Dropdown-Menü unter Admin-Farbschema eine Option aus. Es ist erwähnenswert, dass Sie den Dunkelmodus deaktivieren müssen, um auf die Admin-Farbschemaoptionen zuzugreifen:

Nachtmodus für verschiedene Seiten und Beiträge einstellen
Sie haben die Möglichkeit, den Dunkelmodus zu aktivieren/deaktivieren und eine andere Farbpalette für einzelne Beiträge nach Ihren Wünschen auszuwählen. Darüber hinaus können Sie für jede Kategorie den Dunkelmodus aktivieren/deaktivieren und eine separate Farbpalette angeben.
Diese Anpassungsoptionen funktionieren hervorragend, insbesondere wenn Sie möchten, dass sich Ihre Website von den anderen Mitbewerbern abhebt.
Hervorheben verschiedener Produkte oder Inhalte
Nehmen wir an, Sie möchten den Dunkelmodus oder den Nachtmodus für verschiedene und bestimmte Produkte aktivieren oder deaktivieren oder möglicherweise eine andere Farbe einstellen; Dieses dunkle WordPress-Plugin ermöglicht Ihnen sogar dies.
Angenommen, Sie möchten bestimmte Inhalte hervorheben. Auch das ist mit diesem WordPress-Plugin ganz einfach, denn für jeden Seiten-/Beitragstyp können Sie die Schaltfläche zum Umschalten des Dunkelmodus vor/nach dem Inhalt platzieren.
Benutzerdefinierte Farbe und Text wechseln
Sie können sogar benutzerdefinierte Farben für alle Ihre Absätze, Links, Überschriftenschaltflächen und alle anderen UI-Elemente auswählen und festlegen. So viele Anpassungsoptionen, dass Sie es satt haben werden, verschiedene Optionen zu sehen.
Sie können auch den Text des Dunkelmodusschalters entweder im Dunkeln oder im Hellen bearbeiten.
Bildanpassung
Bilder sind das Erste, was die Aufmerksamkeit des Betrachters auf einer Website auf sich zieht. Mit der Pro- Version von Droit Dark Mode können Sie Helligkeit, Deckkraft und Kontrast Ihres Bildes ganz einfach bearbeiten.
Erhöhen oder verringern Sie Helligkeit, Deckkraft und Kontrast je nach Bedarf, um Ihre Inhalte perfekt abzustimmen.
Kleiner Tipp: Sie können auch den Dark Mode verwenden, wenn Sie einen Beitrag im WordPress-Blockeditor erstellen. Wählen Sie den gewünschten Modus aus, indem Sie oben links auf das kleine Farbsymbol klicken: Was braucht es mehr für ein einfaches und augenschonendes Arbeiten.
Fazit
Sie sind wahrscheinlich hier, weil Sie wissen wollten, wie Sie den Dark Mode in die WordPress-Website einfügen, und heute haben wir das getan. Bisher haben wir in diesem Artikel alles besprochen, was Sie brauchen, um den Dark Mode auf Ihrer WordPress-Website hinzuzufügen.
Das Hinzufügen des Dark Mode direkt in der WordPress-Site ist nicht möglich und dafür benötigen Sie ein zusätzliches Plugin und für uns funktioniert das Droit Dark Mode Plugin wirklich gut, um den Dark Mode in Ihrer Website sowie im Admin-Panel bereitzustellen. Die Anpassung, die dieses Plugin bietet, ist immens und Sie werden viel Spaß haben, ohne sich zu beschweren.