Wordpress子主题style.css不工作


Wordpress child theme style.css not working

我已经创建了一个与父主题格式相同的文件结构。我的父主题叫Alpine, Alpine里面有一个functions.php和style.css文件。没有任何其他style.css文件。

我创建了一个名为Alpine-child的目录,并在其中创建了functions.php和style.css文件。

我不明白为什么我对child style.css做的任何改变都没有实现,但当我对parent style.css做同样的改变时,它们就实现了

这是我的子style.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
*/

这是我的child functions.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>标签。更重要的是,查看样式表的顺序。

首先添加子主题的样式,然后添加父主题的所有样式。这将导致父主题的样式覆盖子主题的样式。

您可以使用add_action的第三个参数将my_theme_enqueue_styles函数的优先级更改为在父函数之后运行。这将使你的子主题样式最后排队,并允许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() );
}
?>

这对我有用:

<?php
function my_theme_enqueue_styles() {
    $parent_style = 'twentyseventeen-style'; 
    $child_style = 'twentyseventeen-child-style';
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( $child_style, get_stylesheet_uri() );
}
?>

其他答案都没有

从Divi 4.4.1更新到Divi 4.10.8后,子主题父CSS不工作。我在我的网站上做了一些研究,意识到Divi style.css文件是空的,只有标题信息(更新后),需要显示CSS的代码现在在不同的文件(style-static.min.css),我把我的Child Theme functions.php文件中的文件名从style.css改为style-static.min.css。这解决了我的问题,CSS工作。

请参阅我使用的代码下面:

add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles', 11);
function theme_enqueue_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style-static.min.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array('parent-style')
    );
}

您需要排队子主题style.css,所以您的功能应该是:

function my_theme_enqueue_styles() {
    $parent_style = 'parent-style'; 
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

看一下文档

Craig Hick的回答对我起作用了,我也意识到为什么Wordpress文档中的默认代码不起作用了。

  <?php 
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' ); 
function my_theme_enqueue_styles() {
    $parent_style = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    ); }

在我的例子中,wp_get_theme()->get('Version')返回1.0.0,这是与父主题相同的版本号。所以我只是改变了子主题css版本号为1.0.1,它工作。

我的子主题目前有以下代码:

<?php
add_action( 'wp_enqueue_scripts', 'enqueue_parent_styles' );
function enqueue_parent_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
//load child theme custom CSS
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles', 11 );
function my_theme_enqueue_styles() {
    wp_enqueue_style( 'child-style', get_stylesheet_uri() );
}
?>

之前,我使用的代码只有//load child theme custom CSS部分之前的第一部分,无法获得自定义CSS。我已经添加了上面建议的代码@jrod,它工作了。我需要和你们确认一下,我的孩子主题代码是完整的,我不需要再添加任何东西了。我不确定这是否也获取我在子主题JS文件中的自定义JS文件。

<?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' );
}
?>

只要从child them style.css的注释中删除版本它在wordpress 6.1中为我工作

我在父母和孩子主题中使用相同的1.0.0版本,在我将孩子主题的版本更改为1.0.1之后,它为我工作