Wie man die Farben eines WordPress-Themes anpasst
Gepostet in Marketing, WordPress von WP Engine
Letzte Aktualisierung am 23. Dezember, 2020
Einer der besten Aspekte der Verwendung von WordPress ist, dass Sie Zugang zu Tausenden von Themes haben, die Sie verwenden können, um den Stil Ihrer Website anzupassen. Manchmal findet man jedoch das perfekte Theme, nur um festzustellen, dass es kein Farbschema enthält, das einem gefällt.
Das kann frustrierend sein, muss aber nicht Ihre Pläne durchkreuzen. Mit ein wenig Arbeit können Sie die Farboptionen Ihres Themes ändern und Ihre Website so gestalten, wie Sie es möchten.
In diesem Artikel werden wir zwei Möglichkeiten erkunden, wie Sie die Farben eines WordPress-Themes anpassen können, einschließlich einer manuellen Vorgehensweise und einer Plugin-Methode. Fangen wir an!
WordPress-Theme-Farben ändern
In diesem Abschnitt zeigen wir Ihnen, wie Sie die Farben Ihres WordPress-Theme auf manuelle Weise ändern können. Dazu sollten Sie ein „Child-Theme“ verwenden, damit die Änderungen, die Sie vorgenommen haben, nicht verloren gehen, wenn das „Parent-Theme“ aktualisiert wird.
Darüber hinaus ist die Einrichtung eines Child-Theme fast immer eine gute Idee, wenn Sie vorhaben, Änderungen am Rahmen Ihrer Website vorzunehmen. Lassen Sie uns darüber sprechen, wie Sie diese Aufgabe erledigen können.
Schritt 1: Erstellen Sie ein Child-Theme
Ein Child-Theme ist eine Kopie eines Parent-Theme, das die gleichen Stile erbt. Sie können Änderungen an seinem Code vornehmen, ohne das übergeordnete Theme zu beeinflussen, und diese werden nicht überschrieben, wenn Sie das Theme aktualisieren müssen. Auf diese Weise können Sie den Stil Ihrer Website auf sichere Weise bearbeiten, so dass Sie bei Fehlern zum übergeordneten Thema zurückkehren und von vorn beginnen können.
Wenn es um die Erstellung eines untergeordneten Themas geht, können Sie auf zwei Arten vorgehen. Erstens können Sie den manuellen Ansatz verfolgen, den wir in diesem Artikel behandeln und der sich in vier Schritten zusammenfassen lässt:
- Verbinden Sie sich über das File Transfer Protocol (FTP) mit Ihrer Website, indem Sie einen Client wie FileZilla verwenden.
- Navigieren Sie zu Ihrem WordPress Themes-Ordner.
- Erstellen Sie einen neuen Ordner für Ihr Child-Theme.
- Richten Sie eine style.css-Datei für Ihr Child-Theme ein.
Sie können jedoch auch ein Plugin verwenden, wenn Sie WordPress-Dateien nicht manuell bearbeiten möchten. Für dieses Szenario empfehlen wir den Child Theme Configurator. Mit diesem Plugin können Sie ein Child-Theme erstellen und dessen Einstellungen über ein einfaches Menü konfigurieren.
Es steht Ihnen natürlich frei, die von Ihnen bevorzugte Methode zu verwenden. Wenn Ihr Child-Theme eingerichtet ist, können Sie es aktivieren und mit dem nächsten Schritt fortfahren.
Schritt 2: Melden Sie sich bei WordPress an und öffnen Sie den Customizer
Bevor Sie die Farben Ihres WordPress-Theme ändern können, müssen Sie sich in Ihrem Dashboard anmelden. Dort navigieren Sie zur Registerkarte Erscheinungsbild > Editor:
Dort finden Sie einen einfachen Texteditor, mit dem Sie die Dateien Ihres Child-Themes ändern können. Denken Sie daran, dass Sie dies auch per FTP und mit Ihrem bevorzugten Texteditor tun können, aber die Ergebnisse sind in beiden Fällen die gleichen.
Wenn Sie die Änderungen, die Sie vornehmen, lieber in der Vorschau sehen möchten, können Sie die Farben Ihres Themes auch über den WordPress Customizer bearbeiten. Navigieren Sie dazu zur Registerkarte Aussehen > Anpassen und öffnen Sie den Abschnitt Zusätzliches CSS:
In beiden Fällen müssen Sie Cascading Style Sheets (CSS) verwenden, um die Farben Ihres Themes zu ändern. Hier kommt unser letzter Schritt ins Spiel.
Schritt 3: Ändern Sie die Farben Ihres WordPress-Themes
Dieser Schritt ist ziemlich einfach, wenn Sie bereits mit CSS vertraut sind. Jedes Element in Ihrem Theme hat einen eigenen Namen oder eine eigene „Klasse“, die Sie mit CSS-Code ansteuern können. Sie müssen wissen, wie die entsprechende Klasse heißt, und dann HEX-Farbcodes verwenden, um sie zu ändern.
Wenn Sie zum Beispiel die Hintergrundfarbe Ihres Themas ändern möchten, können Sie einen CSS-Ausschnitt wie den folgenden zu Ihrem Child-Theme hinzufügen (mit einer der Methoden im letzten Abschnitt):
background-color: #XXXXXX;
Der erste Teil dieses Codes zielt auf die richtige Klasse für das Element, das Sie ändern möchten. Dann müssen Sie nur noch die HEX-Farbe angeben, die Sie verwenden möchten. Wenn Sie fertig sind, vergessen Sie nicht, die Änderungen im Stylesheet Ihres Themes zu speichern.
Glücklicherweise können Sie, da Sie ein Child-Theme verwenden, frei experimentieren, ohne sich Sorgen machen zu müssen, dass etwas auf Ihrer Website kaputt geht. Wenn Sie noch keine Erfahrung mit CSS haben, sollten Sie sich diesen Leitfaden ansehen, in dem beschrieben wird, wie Sie Elemente auf Ihrer Website identifizieren können. Dann können Sie mit HEX-Farbcodes herumspielen, bis Sie eine Kombination gefunden haben, die Ihnen gefällt.
Plugins, die die Farben von WordPress-Themes ändern
Wenn Sie lieber Plugins als CSS verwenden möchten, wird es Sie freuen zu hören, dass es mehrere Optionen gibt, mit denen Sie die Farben von WordPress-Themes anpassen können. Sehen wir uns zwei unserer Lieblingstools an.
Plugin 1: Child Theme Configurator
Child Theme Configurator ist unsere erste Wahl, weil Sie damit sowohl ein Child-Theme erstellen als auch dessen Farbschema anpassen können. Das bedeutet, dass Sie viele der zuvor beschriebenen Schritte überspringen können und viel schneller mit Farbpaletten experimentieren können. Mit diesem Plugin können Sie Schriftfarben, Hintergrundfarben und vieles mehr ändern.
Plugin 2: Central Color Pallete
Wie der Name schon sagt, können Sie mit Central Color Pallete die Farbpalette Ihres Themes ändern. Dieses Plugin lässt sich gut mit vielen beliebten Themes und Plugins integrieren und ermöglicht es Ihnen, den WordPress-Editor zum Auswählen und Wechseln von Farben nicht zu verwenden. Zwei der Plugins, mit denen Central Color Palette problemlos zusammenarbeitet, sind Beaver Builder und Elementor.
Aktualisieren Sie Ihr digitales WordPress-Erlebnis mit WP Engine
Unabhängig davon, für welches Theme Sie sich entscheiden, benötigen Sie einen Webhoster, der Ihnen die Stabilität und Leistung bietet, die Sie zum Betreiben und Anpassen Ihrer Website benötigen. Mit WP Engine erhalten Sie beides und haben Zugang zu einem hervorragenden Support-Team.
Wenn Sie eher ein Do-It-Yourself-Typ sind, veröffentlichen wir auch eine Menge Tutorials, die Sie zur Fehlerbehebung oder für Änderungen an Ihrer Website verwenden können. Sehen Sie sich unsere Pläne an und probieren Sie uns aus!