WordPress子主题无法覆盖父主题CSS

时间:2017-09-07 作者:Jordan Miguel

我已经安装了Faxhion 客户的主题successfully 创建了子主题。然而,不知何故,我无法覆盖父主题css。

类似的问题,如this one &;this one 有人问我,我已经按照这两方面的说明进行了操作,我已经成功地看到我的孩子主题css正在应用,如下图所示。

dev tools

如果查看开发工具的右下角,可以看到body{background: blue;} 以儿童主题的样式。css。

The issue 你能看到吗main.css 正在取消子主题的样式。css。我不知道如何解决这个问题,因为我是WP-Dev的新手。

以下是子主题注释标题:

/*
Theme Name: Faxhion Child
Author: Jordan Miguel
Template: faxhion
Version: 0.1
*/

body {
    background: blue;
    font-size: 30px;
}
下面是我如何使用父主题css**注意@import 对我不起作用,所以我使用functions.php as statedhere -

    <?php
add_action( \'wp_enqueue_scripts\', function() {
    //* Parent CSS
    wp_enqueue_style( \'faxhion\', 
      get_template_directory_uri() . \'/main.css\' );

    //* Child CSS
    wp_enqueue_style( \'faxhion-child\', 
      get_stylesheet_directory_uri() . \'/style.css\', [ \'faxhion\' ], );
} );
EDIT 以下是stylesheetshead. 父主题css链接在子主题css的上方,是否应该更改?

 <link rel=\'stylesheet\' id=\'faxhion-css\'  href=\'http://www.rareselect.co.uk/wp-content/themes/faxhion/main.css?ver=4.8.1\' type=\'text/css\' media=\'all\' />
<link rel=\'stylesheet\' id=\'faxhion-child-css\'  href=\'http://www.rareselect.co.uk/wp-content/themes/faxhion-child/style.css?ver=0.1\' type=\'text/css\' media=\'all\' />
<link rel=\'stylesheet\' id=\'plugins-css\'  href=\'http://www.rareselect.co.uk/wp-content/themes/faxhion/assets/css/plugins.css?ver=4.8.1\' type=\'text/css\' media=\'all\' />
<link rel=\'stylesheet\' id=\'fontawesome-css\'  href=\'http://www.rareselect.co.uk/wp-content/themes/faxhion/assets/css/font-awesome.min.css?ver=4.8.1\' type=\'text/css\' media=\'all\' />

1 个回复
最合适的回答,由SO网友:David Lee 整理而成

我明白了,还有第二个电话main.css :

<link rel="stylesheet" id="faxhion-css" href="http://www.rareselect.co.uk/wp-content/themes/faxhion/main.css?ver=4.8.1" type="text/css" media="all">
<link rel="stylesheet" id="faxhion-child-css" href="http://www.rareselect.co.uk/wp-content/themes/faxhion-child/style.css?ver=0.1" type="text/css" media="all">
<link rel="stylesheet" id="plugins-css" href="http://www.rareselect.co.uk/wp-content/themes/faxhion/assets/css/plugins.css?ver=4.8.1" type="text/css" media="all">
<link rel="stylesheet" id="fontawesome-css" href="http://www.rareselect.co.uk/wp-content/themes/faxhion/assets/css/font-awesome.min.css?ver=4.8.1" type="text/css" media="all">
<link rel="stylesheet" id="style-css" href="http://www.rareselect.co.uk/wp-content/themes/faxhion/assets/css/main.css?ver=4.8.1" type="text/css" media="all">
和你一起打电话的那个人id="faxhion-css" 它什么都没装它是a404 因为main.css 它不在那里,实际main.css 将其内部归档/assets 它已经在某处加载了。您有两种选择:
Option 1:
不要调用父CSS并放置\'style\' 作为依赖项:

add_action( \'wp_enqueue_scripts\', function() {

    //* Child CSS
    wp_enqueue_style( \'faxhion-child\', 
      get_stylesheet_directory_uri() . \'/style.css\', [ \'style\' ], );
} );
\'style\' 它是主样式表的ID。

Option 2:删除主样式表并将其添加回:

<?php
add_action( \'wp_enqueue_scripts\', function() {
    wp_dequeue_style( \'style\' );//removing main.css
    //* Parent CSS
    wp_enqueue_style( \'faxhion\', 
      get_template_directory_uri() . \'/assets/css/main.css\' );//adding it back

    //* Child CSS
    wp_enqueue_style( \'faxhion-child\', 
      get_stylesheet_directory_uri() . \'/style.css\', [ \'faxhion\' ], );
} );
第二个选项可以,但我不推荐,第一个选项也应该可以,如果你有500个错误,那么<?php?> 不匹配,缺少1。

结束

相关推荐

WordPress不添加media.css文件

我认识到,该网站是没有回应和媒体。css文件不起作用,我用开发工具检查了标题中包含的样式,发现有min版本/css/media.min.css?ver=4.8.1, 但我包括媒体。css没有min,媒体会有什么问题。css不工作?这就是我如何包括我的脚本和样式function wpb_adding_scripts() { wp_deregister_script(\'jquery\'); wp_register_script(\'jquery\', get_tem