定制器:如何添加HTML来控制标签?

时间:2017-07-05 作者:Troy Templeman

我有一个简单的控件,可以在Customizer中显示一个复选框:

$wp_customize->add_setting( \'display_about_text\', array(
    \'default\'           => true
) );
$wp_customize->add_control( \'display_about_text\', array(
    \'label\'             => __( \'Display Text\', \'my_theme_name\' ),
    \'type\'              => \'checkbox\',
    \'section\'           => \'about\'
) );
我想加粗Display Text 在Customizer中,我将标签行更改为:

    \'label\'             => __( \'<strong>Display Text</strong>\', \'minitheme\' ),
但是,它只在自定义程序中输出HTML标记,如下所示:

<strong>Display Text</strong>

如何让它以粗体显示而不是输出HTML?当我尝试在定制器中输出HTML时,我已经多次遇到这个问题。与相同的问题esc_html().

2 个回复
最合适的回答,由SO网友:Weston Ruter 整理而成

您应该为此使用CSS。例如:

#customize-control-display_about_text label {
    font-weight: bold;
}
customize_controls_enqueue_scripts 行动

如果必须使用JS修改控件,请注意,我不建议使用jQuery.ready 在另一个答案中。相反,您应该在控件准备就绪后使用Customizer JS API访问它,例如在customize_controls_enqueue_scripts 包含以下内容的操作:

wp.customize.control( \'display_about_text\', function( control ) {
    control.deferred.embedded.done( function() {
        control.container.find( \'label\' ).wrapInner( \'<strong></strong>\' );
    });
});
这种模式可以在核心中看到textarea 对于自定义CSS功能的扩展:https://github.com/WordPress/wordpress-develop/blob/4.8.0/src/wp-admin/js/customize-controls.js#L5343-L5346

SO网友:Dave Romsey

自定义程序运行标签文本esc_html(), 因此,默认情况下,标签中不允许使用HTML。您可以在希望使用粗体标签的地方覆盖每个控件内容的渲染器,但这可能有点过头了。

相反,这里有一个使用customize_controls_enqueue_scripts 在Customizer屏幕上将JavaScript排队的操作。然后使用jQuery以所需控件为目标,并将标签的文本包装到<strong> 标签。

add_action( \'customize_controls_enqueue_scripts\', \'wpse_customize_controls_scripts\' );
function wpse_customize_controls_scripts() {
    wp_enqueue_script(
        \'wpse-customize\',
        get_template_directory_uri() . \'/js/wpse-customize.js\',
        [ \'jquery\', \'customize-controls\' ],
        false,
        true
    );
}

wpse-customize.js

jQuery( document ).ready( function( $ ) {
    $( "#customize-control-display_about_text label" ).wrapInner( "<strong></strong>" );
});

结束

相关推荐

Admin Theme customization

我遵循wordpress codex网站上关于通过插件创建管理主题的说明。我激活了插件,但我的样式表没有包含在<head>.. 这是我的代码:add_action( \'admin_init\', \'kd_plugin_admin_init\' ); add_action( \'admin_menu\', \'kd_plugin_admin_menu\' ); function kd_plugin_admin_init() { /* Register