Custom Script Section Only Echoes Text

Question

I have a custom script section in a theme I’m creating that is only echoing the verbatim text, rather than treating it as script & I’m not sure what I’m doing wrong. I thought at first that it may be the sanitization callback that I was using but changing/removing it didn’t have any effect.

Here’s my customizer code:

        $wp_customize->add_setting( 'footer_code',
           array(
              'default' => '',
              'transport' => 'refresh',
              'sanitize_callback' => ''
           )
        );
        $wp_customize->add_control( 'footer_code',
           array(
              'label' => __( 'Custom Footer Scripts' ),
              'description' => esc_html__( 'Paste in any scripts that need to be called after the body content here.' ),
              'section' => 'header_footer_code',
              'priority' => 10,
              'type' => 'textarea',
              'input_attrs' => array( // Optional.
                 'class' => 'footer_scripts',
              ),
           )
        );

And here’s how I’m calling it:

<?php echo get_theme_mod( 'footer_code'); ?>

Update:

Here’s the sample code that I used as a test, which prints exactly as you see it in my theme, meaning that it’s treated as content:; would be in CSS.

<script>
jQuery('.woocommerce-MyAccount-navigation ul').addClass('chev');
</script>

theme customizer theme development

Jeff W · Answer

I was able to resolve this after I slept on it & I looked at the part of the customizer code that I hadn't included, which is the section portion of all things. All it needed was an esc_attr on it as shown below.
Initial version:
    // Header Footer Code Section
        $wp_customize->add_section( 'header_footer_code', array(
            'title'    => 'Header & Footer Scripts',
            'description' => 'This section is for any head/footer scripts that need to be run on the entire site.',
            'priority' => 180,
        ) );

Revised version:
        $wp_customize->add_section( 'header_footer_code', array(
            esc_attr__( 'Header & Footer Scripts', 'yonder' ),
            'description' => 'This section is for any head/footer scripts that need to be run on the entire site.',
            'priority' => 180,
        ) );

Thanks again for your input, guys!

mozboz · Answer

This is probably not the best answer, someone may know a way for this input to be properly handled given that you want to store code in it, but this will probably do what you're intending:
<?php echo html_entity_decode(get_theme_mod( 'footer_code')); ?>

Note this is probably somewhat of a security risk, and this behaviour of Wordpress escaping the HTML characters prevents exactly what you're trying to do for security reasons. You may want to see if there are other ways to do what you're trying to do here that don't allow that to happen.

Custom Script Section Only Echoes Text

2 Answers

Add your own answers!

Ask a Question