web-dev-qa-db-ja.com

子テーマは親テーマstyle.cssを上書きしません

子テーマを作成しただけですが、style.cssに加えたすべての変更によって、親のstyle.cssが上書きされることはありません - 他のファイルは機能します。私はちょうどそのようにしました:

  1. テーマディレクトリに新しいChildthemeフォルダを作成する
  2. 元のstyle.cssをそれにコピーします。
  3. ヘッダに「Template:orion」を追加
  4. Wordpressのテーマオプションで自分のchildthemeを選択してアクティブにしました。

そして今私が子のstyle.cssの中のものを変更するとき....ページは変更の後も同じように見えます。どうして?

4
Jan

子スタイルシートが親テーマのスタイルをロードするafterであるため、これは問題にならないことに注意してください。ここで起こっているのは、親スタイルシートではなく、他のカスタムスタイルシートにあるスタイルを変更しようとしていることだと思います。その場合、おそらく親テーマのカスタムスタイルシートの前に子テーマのスタイルシートが読み込まれるため、変更は機能しません。

また、@importを使用して親スタイルシートをインポートしないでください。正しい方法は、 wp_enqueue_style()wp_enqueue_scripts にフックしてキューに入れることです

親スタイルシートを子テーマに適切にエンキューおよび追加する方法を次に示します。

add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style' );
function enqueue_parent_theme_style() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

コーデックスから、これはスタイルシートがどのように見えるべきか正しい方法です

/*
 Theme Name:   Twenty Fourteen Child
 Theme URI:    http://example.com/twenty-fourteen-child/
 Description:  Twenty Fourteen Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     twentyfourteen
 Version:      1.0.0
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fourteen-child
*/


/* =Theme customization starts here
-------------------------------------------------------------- */

NOTE

この投稿のこの情報で codex を更新しました

編集

下のコメントから

親テーマがwp_enqueue_style()を使用しない場合、親テーマのテンプレートをいじらずに、親テーマのstyle.cssをどのようにエンキューできますか?この点は、更新したCodexで明確ではありません。例で明確にしてください。

テーマの作成者である場合は、まずこれから始めたいと思います、決してテーマのヘッダーの<link>タグを使用してスタイルシートまたはスクリプトを追加してください。これは間違った方法です。 Codexで説明されているように、wp_enqueue_scriptsフックを介してこれらのスタイルとスクリプトを適切にキューに登録して登録します。

正直に言うと、これを行っているテーマ作成者がまだいるとは思いもしませんでした。この問題を解決する最善の方法は、親header.phpを子テーマにコピーし、ヘッダーからスタイルとスクリプトを手動で削除(削除)することだと思います。

その後、上記の例のようにwp_enqueue_scriptsを使用して、通常どおりにキューに登録して登録できます。 get_templatedirectory_uri() `を使用して、親テーマからスクリプトとスタイルをキューに登録し、登録することを忘れないでください。ここでは、スタイルとスクリプトを読み込む順序が重要です。スクリプト/スタイルが別のスクリプト/スタイルに依存している場合、その特定のスクリプト/スタイルをロードafter

12
Pieter Goosen

WordPress CodexのChild Themeの章を読みながら、このスレッドを見つけました。

Simone に基づいて(つまり、_s underscores に基づいて)子テーマを作成し、推奨コードを使用してfunctions.phpファイルを作成しました。

<?php

add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles', PHP_INT_MAX);
function enqueue_child_theme_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style')  );
}

しかし、この方法を使用すると、私の子供のテーマに問題が生じました。私はGitHubで問題を報告しました: link 。解決策はadd_action()部分からPHP_INIT_MAX定数を削除することでした。

これがSimone関連の問題なのか、それとも他のテーマにも影響するのか(この場合、機能に問題がある可能性があります)...

ありがとうございました!

0
jorgeleandrobr

私は同じ問題を抱えていました、私はそれが775に子供のテーマフォルダと許可の中のファイルを修正することで解決しました。これがあなたのために働くかどうか私に知らせてください:)

0
Asaf Lopez

あなたの親テーマがそのfunctions.phpファイルでwp_enqueue_style()を使用していないことを確認してください。

もしそうであれば、そのfunctions.phpから子スタイルシートをキューに入れることもできます。

add_action( 'wp_enqueue_scripts', 'load_my_child_styles', 20 );
function load_my_child_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri().'/style.css', array('twentyfourteen-style'), '1.0.0' );
}

これは、ヘッダが子テーマのstyle.cssファイルでどのように見えるかの例です。

/*
 Theme Name:   Twenty Fourteen Child
 Theme URI:    http://example.com/twenty-fourteen-child/
 Description:  Twenty Fourteen Child Theme
 Author:       John Doe
 Author URI:   http://example.com
 Template:     twentyfourteen
 Version:      1.0.0
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  twenty-fourteen-child
*/

http://codex.wordpress.org/Child_Themes

0
Brad Dalton