首页 文章

Wordpress新闻页面的自定义CSS

提问于
浏览
0

我目前一直在定制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标签 . 在master css文件中使用.blog,我现在可以专门调整这个页面的CSS!谢天谢地!

1 回答

  • 0

    我看到你已经通过在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 时才会添加样式表 .

相关问题