Custom CSS in WordPress nutzen


Custom Css in WordPress kannst du immer dann nutzen wenn du dein Theme nach deinen Wünschen anpassen möchtest. Hast du zum Beispiel bei Themefortres ein schönes, passendes Theme gefunden und möchtest kleinere Anpassungen vornehmen kannst du dies per Custom CSS in WordPress erledigen.

Viele Themes bieten leider nicht die vollumfänglichen Möglichkeiten der Anpassungen die du dir wünscht. Besonders kleinere Details lassen sich in den Theme Einstellungen oft nicht in dem umfang anpassen die du dir wünscht. 

Die Lösung: Custom CSS in WordPress nutzen!

Mit Custom CSS in WordPress kannst du zum Beispiel schnell und relativ einfach folgende Dinge anpassen:

  • Überschriften
  • Buttons
  • Textelemente
  • Schriftarten
  • Bilder

Welche Möglichkeiten hast du dein Custom Css in WordPress zu bearbeiten?

Um deine gewünschten Anpassungen vorzunehmen hast du zwei verschiedenen Möglichkeiten. Du kannst dein Custom Css direkt im Theme einbinden indem du es im Customizer einfügst. Alternativ kannst du ein Plugin nutzen um dein Custom CSS einzubinden.

Nutze den Theme Customizer oder die CSS-Option deines Themes

Um dein Custom CSS in WordPress zu integrieren kannst du den Theme Customizer nutzen. Bei vielen Premium Themes hast du die Möglichkeit (meist auf der Theme Optionen Seite), dein eigenes CSS zu integrieren. Der große Vorteil dieser Möglichkeit ist dass du hierfür kein zusätzliches Plugin benötigst. 

Du kannst dein Custom CSS natürlich auch direkt in die Style.css Datei deines Themes schreiben.

Jedes Plugin welches du installierst verlangsamt deine Seite und macht deine Seite angreifbar. Diese Option bietet sich also an wenn du zum Beispiel Jetpack nicht installiert hast und du nur kleinere CSS-Anpassungen machen möchtest.

Der Nachteil dieser Methode ist dass alle Änderungen Theme-Abhängig sind und bei einem Theme Wechsel nicht mit übertragen werden.

Nutze ein Plugin

Die Alternative zu einer direkten Anpassung per Customizer oder Theme Option ist ein Plugin zu nutzen. Wie bereits erwähnt kann ein Plugin deine Seite bzw. deine Ladezeiten verlangsamen und ein Plugin stellt immer ein gewisses Sicherheitsrisiko dar, denn Angreifer können durch das Plugin eventuell auf deine Seite zugreifen. 

Der große Vorteil ist dass die Anpassungen nicht Theme-Abhängig sind und so auch dann bestehen bleiben wenn du dein Theme wechselst. Im folgenden stelle ich dir einige, meiner Meinung nach, gute Plugins für Custom CSS in WordPress vor: 

simple custom css

Am liebsten nutze ich aktuell Simple Custom CSS für meine CSS Anpassungen. Das Plugin ist kostenlos erhältlich und wirklich einfach aufgebaut. Du findest nach der Installation einen neuen Menüpunkt namens “Custom CSS” unter dem Menüpunkt Design. ier kannst du direkt loslegen und dein CSS schreiben.

Nachdem du deine Änderungen gespeichert hast kannst du diese ganz einfach im Browser kontrollieren indem du die Betreffende Seite oder den Beitrag aufrufst.

wp add custom css

WP Add Custom CSS hilft dir vor allem wenn du schwierigkeiten hast, dein CSS zu bestimmten Seiten hinzuzufügen. Ansonsten bietet das Plugin einen ähnlichen Funktionsumfang wie Simple Custom CSS. WP ADD Custom CSS fügt eine eigene CSS-Box zum Bearbeiten Bildschirm hinzu und bietet außerdem ein globales Styling.

Jetpack

Wenn du sowieso schon Jetpack nutzt, kannst du einfach die Custom CSS Funktion von Jetpack aktivieren und dein CSS unter dem Menüpunkt “CSS bearbeiten” unter Design bearbeiten.

Nutzt du sowieso bereits Jetpack so musst du für dein Custom CSS kein zusätzliches Plugin installieren. Zudem nutzt Jetpack die sehr schöne, weil praktische, Funktion der CSS Revisionen. Mit Hilfe der Revisionen kannst du verschiedene gespeicherte Versionen deines CSS vergleichen und falls nötig auf eine ältere Version zurückgreifen.

Das ganze funktioniert ähnlich wie bei den Artikel-Revisionen.

Css Hero

Im gegensatz zu den anderen vorgestellten Plugins bietet CSS Hero dir ein visuellen CSS Editor. Das lästige einfügen von Code entfällt somit. Eine Reihe von einfach zu benutzenden Eingabefeldern und Dropdown-Menüs erledigt die ganze Code Arbeit für dich.

CSS Hero ist ein Premium Plugin und kostet somit Geld. Dafür bekommst du eine einfach zu verwendbare Lösung mit vielen leistungsstarken Funktionen.

Custom Css in WordPress mit einem Child Theme nutzen

Willst du dein theme etwas mehr anpassen, gibt es die praktische Möglichkeit ein eigenes Child-Theme zu nutzen. Mithilfe eines Child Themes kannst du leicht Änderungen am Eltern-Theme vornehmen ohne das diese beim Update des Eltern Themes gelöscht werden.

Nutzt du bereits ein Child Theme oder planst eins einzusetzen solltest du die CSS Änderungen direkt in den Theme Dateien (Style.css) vornehmen. 

Du kannst die Elemente die du bearbeiten willst ganz einfach ausfindig machen

Suchst du einmal die Struktur oder die Bezeichnung eines Elementes auf deiner Webseite lässt sich dies ganz einfach ausfindig machen. Im Firefox oder Chrome Browser kannst du per Rechtsklick auf das betreffende Element “Untersuchen” wählen. Nun siehst du die Struktur deiner Seite und besonders des ausgewählten Elements. Hier siehst du auch sofort welche CSS Eigenschaften dem Element zugeordnet sind.

Jens Evers

Jens Evers ist der Gründer von mehrBlog. Er ist WordPress-Fan, Blogger und SEO-Experte seit mehr als 10 Jahren. Seine Spezialität ist das erstellen Themen-relevanter Blogs. Er zeigt dir wie du Traffic auf deine Inhalte Leitest und wie du durch wertvolle Beiträge mehr Geld verdienen kannst.

Leave a Reply

Your email address will not be published. Required fields are marked *

Meine neusten Artikel