在wordpress中将自定义css添加到页面模板

2022-08-30 18:22:22

嗨,我需要一些帮助,为我的页面模板创建自定义css文件。关于这个问题有很多主题,但是随着我阅读的每个线程,我都会获得更多的信息和更多的困惑。

我为二十四十四个主题创建了一个子主题,并添加了一个页面模板。如何将自定义css添加到此模板。我发现这个代码添加到子主题的函数中.php用我的css选择合适的类。但是我如何以及在哪里放置这个类?我读到我必须将类添加到标题中的body标签.php但我不确定。这是正确的方法吗?

if (is_page_template( 'mytemplate.php' )){
$classes[] = 'myclass';
}

答案 1

使用条件有选择地加载 CSS。is_page_template()

在下面的函数中,我们将挂接到并检查我们是否在自定义页面模板上,以确定是否加载其他CSS。wp_enqueue_scripts

如果结果为真,我们将从主题内的文件夹中加载一个标题为标题的 CSS 文件。更新路径以加载正确的文件。page-template.csscss/

function wpse_enqueue_page_template_styles() {
    if ( is_page_template( 'mytemplate.php' ) ) {
        wp_enqueue_style( 'page-template', get_stylesheet_directory_uri() . '/css/page-template.css' );
    }
}
add_action( 'wp_enqueue_scripts', 'wpse_enqueue_page_template_styles' );

答案 2

这个解决方案怎么样?

<?php 
function mypage_head() {
    echo '<link rel="stylesheet" type="text/css" href="'.get_bloginfo('stylesheet_directory').'/includes/mypage.css">'."\n"
}
add_action('wp_head', 'mypage_head');
?>
<?php get_header(); ?>

您可以使用 hook 将自定义内容(Javascript、CSS..)添加到自定义模板中。我认为这种方式更好,因为所有更改都将包含在您的模板文件中,因此您不必在另一个地方签入。wp_head

我从那里得到这个解决方案:http://scratch99.com/wordpress/development/custom-page-template-external-css-file/


推荐