web-dev-qa-db-ja.com

子テーマのスタイルシートが読み込まれないのはなぜですか？

私は HashOneテーマを使用しています そして私達のウェブサイトにさまざまな色の変更を加えるために子テーマを作成しました。

しかし、私が子テーマのスタイルシートに加えた変更は、サイトの特定のセクションでのみ行われているのに対して、他の変更は親テーマに委ねています。私はfunctions.phpファイルを作りましたが、それは正しくフォーマットされていると私は信じます。下記参照：

<?php
add_action( 'wp_enqueue_scripts', 'hashone_enqueue_styles' );
function hashone_enqueue_styles() {
wp_enqueue_style( 'hashone-parent-style', get_template_directory_uri() . 
'/style.css' );
}

どのCSSが子テーマをオーバーライドしているのかを調べるために検査モードを使用したところ、それが間違いなく親テーマであることを確認できました。しかし、同時に動作するCSSファイルが3つあり、これを修正する方法がわかりません。

  1. stage.ottrial.pitt.edu/wp-content/themes/hashone/style.css?ver=4.7.1
  2. stage.ottrial.pitt.edu/wp-content/themes/hashone-theme-child/style.css?ver=1.0
  3. stage.ottrial.pitt.edu/wp-content/themes/hashone/style.css

パックをリードしているのは＃3です。ここで何が悪いのかわからない。

csschild-themewp-enqueue-stylestylesheetparent-theme
5
Sakena

あなたの子テーマから親テーマcssをエンキューするためにあなたのfunctions.phpファイルの中にそれ以上のコードは必要ありません。問題は、そのコードを追加することで、親テーマのCSSを2度目にエンキューしていることですが、子テーマの後に読み込まれるようになったことです。つまり、子テーマで行ったすべての変更は効果がありません。

単にその行を削除すると、あなたはあなたの子供のテーマの変更を確認する必要があります。

追加：これは、子テーマcssを正しくエンキューするために基本的なものだけで使用した2つのファイルです。

style.cssファイル：

/*
 * Theme Name: HashOne Child
 * Template: hashone
 * Text Domain: hashone-chile
 */

functions.phpファイル：

<?php
add_action( 'wp_enqueue_scripts', function() {
  wp_enqueue_style( 'hashone-parent-style', get_template_directory_uri() . '/style.css' );
});
5
Nathan Johnson

style.css以外のラベルを付けたくなければ、あなたはあなたの子テーマのスタイルシートをロードする必要はありません。

デフォルトでは、WordPressは親テーマと子テーマの（テーマルートディレクトリにある）style.cssを自動的にロードします。

子テーマがアクティブになっていることを確認して、子テーマのstyle.cssにCSSを追加します。

CSS規則を簡単に識別するために必ずインスペクタを使用してください。親テーマのCSSルールをオーバーライドするのは難しい場合があります。 !importantを使用すると、親テーマのCSSルールの一部を上書きするのに役立ちます。

CSSで!importantを使用する例

親テーマがこの規則を定義しているとしましょう：

#site-title {
    color: #000000;
    background: #ffffff;
}

あなたはこのようにあなたの子供のテーマでその規則を強制的に無効にすることができます：

#site-title {
    color: #ffffff !important;
    background: #000000 !important;
}
3
Michael Ecklund

WP 4.7から始まる新しいクォトロを覚えておいてください。

get_theme_file_uri()
get_parent_theme_file_uri()
get_theme_file_path()
get_parent_theme_file_path()

古いクアトロを置き換えるようになった：

get_stylesheet_directory_uri()
get_template_directory_uri()
get_stylesheet_directory()
get_template_directory()

それぞれの順番で。利得はより良い命名規則です。

1
prosti