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>

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-development
• theme-customizer

• It would help a bit if you add the actual output you're getting to the question, and maybe the context around the echo get_theme_mod, if that's the part that's coming out verbatim – mozboz Commented Jul 17, 2020 at 20:10
• @mozboz - I edited my question with what I used as a test & what's happening. Just to be clear, it's showing on the screen as exactly this: <script>jQuery('.woocommerce-MyAccount-navigation ul').addClass('chev');</script> – Jeff W Commented Jul 17, 2020 at 20:17
• Ahh, I see. It's getting escaped somewhere. So if you view-source you probably will see e.g. <script> as literally: &lt;script&gt; etc. ? – mozboz Commented Jul 17, 2020 at 21:08
• You're correct, that's the case - I'm definitely learning new tricks & the security aspect of it is clear as I dig into it more. Using the html_entity_decode removes the printing on the page itself but still escapes the characters in the page source. – Jeff W Commented Jul 17, 2020 at 21:31
• hey, I have exact peace of code like you (footer script call) and it works OK. just try to comment 'sanitize_callback' line, I think that should do it – Kresimir Pendic Commented Jul 17, 2020 at 22:05

2 Answers 2

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.

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!