1. ホーム
  2. php

[解決済み】Wordpressの子テーマのstyle.cssが効かない。

2022-01-25 18:35:46

質問

親テーマと同じ形式のファイル構造を作りました。親テーマはAlpineという名前で、Alpineの中にfunctions.phpとstyle.cssというファイルが存在します。追加のstyle.cssファイルはないようです。

Alpine-childというディレクトリを作成し、その中にfunctions.phpとstyle.cssファイルを作成しました。

子スタイルのstyle.cssに加えた変更は実装されないのに、親スタイルのstyle.cssに同じ変更を加えると実装されるのはなぜなのか、理解できません。

これが私の子スタイル.cssです。

/*
 Theme Name:   Alpine Child
 Theme URI:    http://www.creative-ispiration.com/wp/alpine/
 Description:  My first child theme, based on Alpine
 Author:       MilkshakeThemes
 Author URI:   http://themeforest.net/user/milkshakethemes
 Template:     Alpine
 Version:      1.0.0
 Tags: one-column, two-columns, right-sidebar, fluid-layout, custom-menu, editor-style, featured-images, post-formats, rtl$
 Text Domain: alpine-child
*/

これは、私の子関数.phpファイルです。

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

解決方法は?

を見てみましょう。 <head> タグを使用します。さらに重要なことは、スタイルシートの順序を見ることです。

子テーマのスタイルが最初に追加され、その後、親テーマのスタイルがすべて追加されています。これでは、親テーマのスタイルが子テーマのスタイルをオーバーライドしてしまいます。

の優先順位を変更することができます。 my_theme_enqueue_styles の3番目のパラメータを使うことで、親の後に実行される関数を指定できます。 アクションを追加する . これにより、子テーマのスタイルが最後にキューに入れられ、CSSが期待通りに動作するようになります。

<?php
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 11 );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_uri() );
}
?>