php - Wordpress 新闻页面的自定义 CSS

Question

我目前一直在自定义 Wordpress 附带的标准 2013 主题，制作标准子主题并添加到 style.css 样式表的底部。

这适用于我的所有页面，但有时我需要为新闻页面自定义样式表“news.css”。

我已经尝试将以下代码添加到 header.php 文件中，就在结束标记之前，以确保它不会被其他 css 文件否决。

    <?php
        if ( is_page( 'news' ) ) { ?>
            <link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/news.css">

    <?php } else {
    }
?>

news.css 文件在子主题的根目录中，url 是 www.__.com/news/但是我在新闻页面上仍然无法让 Wordpress 加载此文件。

我需要做什么才能加载此样式表(仅针对此页面)？

提前致谢。

编辑:找到解决方案 - 新闻页面(即我的帖子页面)将 .blog 类应用于 body 标签。在主 css 文件中使用 .blog，我现在可以专门调整此页面的 CSS!谢天谢地!

Answer 1

我看到您已经通过在 CSS 中使用选择器来解决问题，该选择器使规则仅适用于您希望它们适用的页面(在您的情况下，.blog 类效果很好。

这几乎是当今做事的标准方式。

不过我只是想把它放在这里作为引用，以备将来有人需要它。下面的函数将样式表“排入队列”，是添加额外样式表的正确方法。此函数注册并排队 2 个新样式表。

function load_additional_styles() {
    wp_register_style( 'second-style', get_template_directory_uri() . '/style2.css' );
    wp_enqueue_style ( 'second-style' );
    wp_register_style( 'third-style', get_template_directory_uri() . '/style3.css' );
    wp_enqueue_style ( 'third-style' );
}

add_action( 'wp_enqueue_scripts', 'load_additional_styles' );

也可以在这些函数中使用条件，所以(以上面的问题为例)你可以这样做

function load_additional_styles() {
    if ( is_page( 'news' ) ) {
        wp_register_style( 'second-style', get_template_directory_uri() . '/style2.css' );
        wp_enqueue_style ( 'second-style' );
        wp_register_style( 'third-style', get_template_directory_uri() . '/style3.css' );
        wp_enqueue_style ( 'third-style' );
    }
}

add_action( 'wp_enqueue_scripts', 'load_additional_styles' );

在上面的代码中，只有当 is_page('news') 返回 true 时才会添加样式表。