Question

我试图绕过WordPress中的wp_add_inline_style函数。

我已经设法使用此功能输出我的自定义CSS，并且它运行良好。

以下是我如何使用wp_add_inline_style函数输出自定义程序样式;

function theme_custom_css() {

    $header_height = get_theme_mod( 'header_height', '96' );

    $output .= '.site-header { height: ' . esc_attr( $header_height ) . 'px; }';

    if ( ! empty( $output ) ) {
        wp_add_inline_style( 'custom-style', $output );
    }

}
add_action( 'wp_enqueue_scripts', 'theme_custom_css' );

这完全符合预期。它在style.css文件下面的头部添加了一个样式标记，其中包含所有自定义css。太好了，这正是我想要的。

但是，如果我有另一个文件，其中有可以由用户更改的CSS，并且我想将更改的CSS添加到由wp_add_inline_style函数打印的样式标记中。这不起作用。这是我尝试此操作的代码。

function theme_slider_css() {

    if ( get_field( 'slider_padding_top' ) ) {
        $slider_css .= '.slider-inner-wrap { padding-top: ' . get_field( 'slider_padding_top' ) . ';px }';
    }

    if ( ! empty( $slider_css ) ) {                                         
        wp_add_inline_style( 'custom-style', $slider_css );
    }

}
add_action( 'wp_enqueue_scripts', 'theme_slider_css' );

完全忽略了theme_slider_css函数。

我完全忽略了这一点吗？我有什么明显的遗失吗？

我很乐意在头部打印两个单独的样式标签，但我也无法实现这一点？

希望我已经很好地解释了这一点，如果没有，请问。

任何帮助将不胜感激。

提前谢谢。

Answer 1

缺少最后一个'。

从以下位置更改：

"$output .= '.site-header { height: ' . esc_attr( $header_height ) . 'px; };"

为：

"$output .= '.site-header { height: ' . esc_attr( $header_height ) . 'px; }';"

WordPress - 使用wp_add_inline_style添加动态样式

1 个答案: