Zurück zur Übersicht

WooCommerce überschreibt das Stylesheet des installierten Themes

In diesem Beitrag des WooCommerce-Repos auf github.com wird das Problem beschrieben, dass die WooCommerce-Styles in manchen Fällen die in der style.css definierten Regeln eines Themes überschreiben.

Verschiedene Lösungen werden vorgeschlagen, darunter auch das Deaktivieren der Original-Styles von WooCommerce und das Kopieren & Einfügen derselben in die style.css des Themes. Der Nachteil dieser Methode ist offensichtlich: wird mit einer neuen WooCommerce-Version auf eine neue Stylesheet-Datei ausgeliefert, muss diese erneut ins Theme hinüberkopiert werden. Nicht sehr schön.

Mein Lösungsansatz macht dies überflüssig. Als erstes entfernen wir die Einbindung der style.css in unserem Theme, um sie anschließend mit einer neuen Abhängigkeit wieder einzubinden:

  1. Wir öffnen die Datei header.php in unserem Theme-Ordner und entfernen folgende Zeile, mit der die Stylesheet-Datei eingebunden wird:
  2. Wir öffnen die functions.php und erweitern sie um folgende Funktion:

Das war es schon. Die style.css wird nun mit einer Abhängigkeit auf die woocommerce_frontend_styles eingebunden, was bedeutet, dass sie in jedem Fall nach derselben geladen wird. Dadurch wird es möglich, der Stylesheet-Hierarchie gemäß, bestehende WooCommerce-Elemente umzugestalten. Zudem wird nun immer das Original-WooCommerce-Stylesheet verwendet, so dass die Methode Update-sicher ist.

 

Schreibe einen Kommentar