Storefront-Child-Frage

Zitat von Blau

Hallo
Kann mir jemand sagen (schreiben), wo hier der Hund begraben ist?
Ich habe eine Child-Theme für storefront angelegt.
In der Child-css habe ich folgenden Kopf eingefügt:

Code

/*
 Theme Name: Storefront Child
 Description: Child Theme
 Author: Ich
 Template: storefront
 Version: 1.0
 */
 @import url("../storefront/style.css");

und jede Änderung funktioniert problemlos.
Nun wollte ich es mit der Child-woocommerce.css genauso machen. Also:

Code

/*
 Theme Name: Storefront Child
 Description: Child Theme
 Author: Ich
 Template: storefront
 Version: 1.0
 */
 @import url("../storefront/inc/woocommerce/css/woocommerce.css");

Aber bei Änderungen passiert nichts. Das Programm greift immer auf das Eltern- woocommerce.css zurück?
Kann mir jemand weiterhelfen?

Alles anzeigen

du brauchst das Style von WOO Commerce nicht nochmals einbinden => wozu auch, das macht eh das Theme Storefront für dich automatisch :-)

außerdem bindet man ein Style in ein ChildTheme nicht mehr mit @import ein, das ist zu langsam

functions.php des ChildThemes

// Faster than @import
add_action( 'wp_enqueue_scripts', 'my_child_theme_scripts' );
function my_child_theme_scripts() {
    wp_enqueue_style( 'parent-theme', get_template_directory_uri() . '/style.css' );
}

außerdem mit dem @import "überschreibst du nichts", sondern du holst das CSS des Elternthemes...

magst du das CSS ändern musst du in der style.css des ChildThemes die Angaben machen und zwar sehr genau...

welche Klassen und Ids siehst du im Quelltext der aufgerufenen Seite...

das ist der falsche Weg

Storefront und WooCommerce sind siamesische Zwillinge :-)
Änderungen im CSS von WOOCommerce machst du in der style.css des Storefront Childs,
denn das Plugin WOOCommerce kann kein "ChildTheme", daher findet es diese eingebundene css Datei nicht...

und wenn du meinst , dass eine Deklaration nicht greift, => nimm den uralten, doofen, aber immer noch wirksamen "border-trick"

zb du magst im Warenkorb die Tabelle
table.cart ändern

schau, ob deine Cascade reicht mit

table.cart{border:1px solid red; }
ist diese Tabelle ohne roten Rahmen ist die Cascade nicht lang genug dies zu tun

versuch es dann mit
.woocommerce table.cart {border:1px solid red;}

voila => nun ist der rote Rahmen da, du siehst, dass deine Cascade greift und kannst nun machen was du machen willst
den roten Border sicher wieder löschen :-)

@import macht immer alles langsam

und oft brauchst du ein

.woocommerce-active .weiterecssklasse .nochweitere cssklasse {} voranstellen

gern geschehen :-)
bei dir bleibt eh noch sehr viel Arbeit :-)