WordPress的文件functions.php没有加载style.css

时间:2018-12-31 12:34:14

标签: css wordpress wordpress-theming

我似乎无法获得WordPress主题的functions.php文件加载样式表。

我在WordPress主题的主题目录中创建的文件及其各自的内容如下;

style.css

/*
Theme Name: Theme Study
Author: A
Version: 1.0.0
*/

body {
    color: #4d5a6c !important;
}

header.php

<!DOCTYPE html>
<html lang="en">
<head>
    <?php wp_head(); ?>
</head>
<body>
    <h2>This is the header</h2>

index.php

<?php get_header();

while ( have_posts() ) {
    the_post(); ?>
    <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    <?php the_content();
}
get_footer(); ?>

footer.php

    <h4>This is the footer</h4>
<?php wp_footer(); ?>
</body>
</html>

functions.php

<?php 
function style_files() {
    wp_enqueue_style( 'style_main', get_stylesheet_uri() );
}
add_action( 'wp_enqueue_scripts', 'style_files' );

另一方面,我意识到,当我直接引用WordPress主题的header.php file as below, it works as expected, but my aim is to achieve that in the functions.php`文件中的样式表时。

<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); ?>" />
    <?php wp_head(); ?>
</head>
<body>

<h2>This is the header</h2>

为什么我的style.ccs无法从functions.php文件中加载?

4 个答案:

答案 0 :(得分:0)

请用您的wp_enqueue_style函数替换此函数。

wp_enqueue_style( 'style', get_stylesheet_uri() );

答案 1 :(得分:0)

使用此代码,我认为它适合您。

function theme_styles(){ 
// Load all of the styles that need to appear on all pages
wp_enqueue_style( 'main', get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'custom', get_template_directory_uri() . '/css/custom.css' ); 
}
 add_action('wp_enqueue_scripts', 'theme_styles');

答案 2 :(得分:0)

使用get_template_directory_uri()代替get_stylesheet_uri()文件中的functions.php

下面是说明其阅读方式的代码段;

function style_files() {
    wp_enqueue_style(
        'style_main',
        get_template_directory_uri() . '/style.css',
        array(),
        false,
        'all'
    );
}
add_action( 'wp_enqueue_scripts', 'style_files' );

这是将样式表文件添加/排队到WordPress主题中的安全方法。

上面的格式如下:

wp_enqueue_style( $handle, $src, $deps, $ver, $media );

其中

$handle
(string) (Required) Name of the stylesheet. Should be unique.

$src
(string) (Optional) Full URL of the stylesheet,
or path of the stylesheet relative to the WordPress root directory.

Default value: ''

$deps
(array) (Optional) An array of registered stylesheet handles this stylesheet depends on.

Default value: array()

$ver
(string|bool|null) (Optional) String specifying stylesheet version number, if it has one,
which is added to the URL as a query string for cache busting purposes. If version is set to
false, a version number is automatically added equal to current installed WordPress version.
If set to null, no version is added.

Default value: false

$media
(string) (Optional) The media for which this stylesheet has been defined. 
Accepts media types like 'all', 'print' and 'screen', or media queries like
'(orientation: portrait)' and '(max-width: 640px)'.

Default value: 'all'

更多可用信息here

答案 3 :(得分:0)

如果尝试将其放在function.php文件中,该怎么办:

<?php 
function style_files(){
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css');
}

add_action('wp_enqueue_scripts', 'style_files');

样式ID为 parent-style 的通常用于父主题(如果您正在开发子主题或仅是单个主题),第二个是您在开发子主题并应加载style.css代表您的孩子主题。