Es reicht nicht, das Stylesheet in das Verzeichnis des Child-Themes zu ziehen, du musst es auch einbinden.
Schau dir mal in deinem Child-Theme die functions.php an. Dort solltest du sowas wie
function theme_xy_styles() {
wp_enqueue_style( 'themexy-child-style', get_stylesheet_uri(),
array( 'twenty-twenty-one-style' ), wp_get_theme()->get('Version') );
}
add_action( 'wp_enqueue_scripts', 'theme_xy_styles');
haben. Dort fügst du jetzt noch eine Zeile ein, um dein Stylesheet einzubinden:
function theme_xy_styles() {
wp_enqueue_style( 'themexy-child-style', get_stylesheet_uri() );
// Style für Mobile
wp_enqueue_style( 'themexy-mobile-child-style', get_template_directory_uri() . '/style-mobile.css' );
}
add_action( 'wp_enqueue_scripts', 'theme_xy_styles');
Nachdem du das gespeichert hast, schaust du dir im Browser über die Entwickler-Tools (Taste F12) den Quelltext deiner Webseite an, ob da die Datei style-mobile.css eingebunden wird.
Ich hab das gemacht und meine functions.php sieht jetzt so aus:
<?php
function child_theme_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-theme-css', get_stylesheet_directory_uri() . '/style.css' , array('parent-style'));
wp_enqueue_style( 'mobile-child-style', get_template_directory_uri() . '/style-mobile.css');
//wp_enqueue_style( 'child-print-css', get_stylesheet_directory_uri() . '/print.css');
}
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );
add_action( 'wp_enqueue_scrip', 'child_theme_sty' );
Außerdem habe ich die Datei style-mobile.css in den Child-Theme-Ordner kopiert. Trotzdem greift WordPress auf die Datei im Parent-Theme zu. Woran könnte das denn liegen?
—
Moderationshinweis: Kannst du bitte demnächst Code formatieren? Das Ändern ist immer recht aufwendig und ohne Formatierung ist das schlecht zu lesen.
-
Diese Antwort wurde geändert vor 3 Jahren, 2 Monaten von
Bego Mario Garde. Grund: Code formatiert
Ich weiß nicht, ob das jetzt einfach nur ein Ausrutscher auf der Tastatur war, aber add_action( 'wp_enqueue_scrip', 'child_theme_sty' ); gehört da nicht rein.
Ändere bitte mal die Zeile
wp_enqueue_style( 'mobile-child-style', get_template_directory_uri() . '/style-mobile.css');
ab auf
wp_enqueue_style( 'mobile-child-style', get_stylesheet_directory_uri() . '/style-mobile.css');
War mein Fehler, sorry.
Ok. hab ich gemacht und die Datei im Parent Theme gelöscht. Es wird zwar auf die Datei zugegriffen, allerdings ist das Design jetzt irgendwie abgestürzt. Müsste doch eigentlich doch erstmal genau gleich aussehen wie vorher oder nicht?
Ok. hab ich gemacht und die Datei im Parent Theme gelöscht.
Der Sinn eines Child-Themes ist, im Parent-Theme keine Änderungen vorzunehmen (die würden ja auch im Zweifelsfall überschrieben). Statt dessen solltest du ein eigenes Stylsheet einbinden, in dem du nur die CSS-Regeln unterbringst, die die Regeln der Stylesheets des Parent-Theme überschreiben.
Müsste doch eigentlich doch erstmal genau gleich aussehen wie vorher oder nicht?
So, wie du es beschrieben hast, eigentlich schon.
Browser-Cache hast du geleert?
Du hast im Stylesheet style.css des Child-Themes den gleichen Theme-Header übernommen wie im Parent Theme. Das solltest du ändern.
Hab ich gemacht und den Namen im Stylesheet des Child-Themes geändert.
Leider keine Änderung. Hmmm…
Ich frage mich gerade, ob das überhaupt ein Child-Theme ist.
Füg mal im Theme-Header folgendes hinzu:
Template: givingpress-lite
Ok. ja, hab ich gemacht. Also in der header.php des Child Themes.
Der Theme-Header sind die Kommentarzeilen am Anfang der style.css. Mit dem Template header.php hat das nichts zu tun.
Vielleicht magst du doch nochmal nachlesen, wie man ein Child-Theme erstellt? Hier ist eine gute Erklärung: Wie man ein Child Theme in WordPress erstellt (Erweiterte Anleitung)
Hi Bego,
ich hab jetzt nochmal die Dateistruktur überarbeitet und in der Child-Theme style.css nur die Regeln verwendet, die im Parent Theme dann überschrieben werden. Auch den Header der Datei habe ich angepasst. Das funktioniert soweit gut, allerdings besteht das Probloem mit der style-mobile.css weiterhin. Wenn ich mit den EntwicklerTools bei Google Chrome ein Smartphone zur Ansicht wähle, dann taucht die Datei des Child Themes zwar auf, es scheint aber als sei die Hierarchie genau umgekehrt wie gewünscht, also, dass die style-mobile.css des Parent-Themes die style-mobile.css des Child Themes überschreibt. Kann das sein?
grüße Philipp
Hallo,
bräuchte da mal Unterstützung, weil ich im Moment wirklich nicht so richtig weiter weiß. Wie oben beschrieben habe ich die style-mobile.css Datei in ein Child Theme eingebunden und hätte gerne dass die Regeln in der Datei des Parent-Themes überschrieben werden, das passiert aber nicht. Meine neue Regel
.featured-pages {
padding: 200px 50px 10px;
}
wird in den Google Entwicklertools durchgestrichen angezeigt, kommt also nicht zur Anwendung. Woran könnte das denn liegen?
Grüße
Philipp
Du hast jetzt Stylesheets mehrfach eingebunden:
(zum Vergrößern anklicken)
Wie gesagt: schau dir bitte nochmal an, wie Child-Themes erstellt werden. Einen Link zu einer Anleitung hatte ich dir genannt.
Hi Bego,
ich hab mir den Beitrag nochmal durchgelesen, finde aber leider nicht die Lösung zu meinem Problem. Die functions.php in meinem Child Theme:
<?php
function child_theme_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'mobile-child-style', get_stylesheet_directory_uri() . '/style-mobile.css');
//wp_enqueue_style( 'child-print-css', get_stylesheet_directory_uri() . '/print.css');
}
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );
Außerdem der Header in der style.css
/*******************************************************************************************************************
Theme Name: GivingPress Child
Theme URI: http://www.ywca-drc.org
Description: GivingPress Child Theme
Author: Philipp Kuhn
Template: givingpress-lite
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, education, news, one-column, two-columns, three-columns, right-sidebar, custom-background, custom-header, custom-menu, custom-logo, featured-image-header, flexible-header, full-width-template, theme-options, translation-ready, sticky-post, featured-images, footer-widgets
Text Domain: givingpresschild
*/
eigentlich müsste ich doch jetzt in dieser Datei Regeln von style-mobile.css im Parent Theme überschreiben können oder muss ich dazu eine neue Datei im Child-Theme Ordner anlegen? Selbst damit schaffe ich es nicht die Regeln von style-mobile.css zu überschreiben.
Die Zeile wp_enqueue_style( 'mobile-child-style', get_stylesheet_directory_uri() . '/style-mobile.css'); bindet ein Stylesheet ein (wp_enqueue_style), gibt ihm den Tag mobile-child-style und verwendet im Child-Theme-Verzeichnis eine Datei style-mobile.css. Eine Datei wp-content/themes/givingpress-child/style-mobile.css ist im Moment aber wohl nicht verfügbar und kann dann auch nichts überschreiben.
Die Datei müsste jetzt verfügbar sein, aber wenn ich dort die CSS Regeln umformuliere passiert leider auch nichts. Die Datei des Parent Themes befindet sich in dem Verzeichnis:
http://www.ywca-drc.org/wp-content/themes/givingpress-lite/css/style-mobile.css
Könnte das irgendwie mit den Angaben in der functions.php zusammenhängen?
Wie gestalte ich die so, dass es möglich wird die Regeln der Originalsatei zu überschreiben?
vielen dank
Philipp
