I was looking for a method to add the data-cfasync="false" attribute to a javascript loaded by the theme itself.

My theme load the script

<script type="e350ac6f596d90da70624b6d-text/javascript" src='.fluidbox.min.js?ver=2.0.5' id='jquery-fluidbox-js'>

And I would like to have

<script data-cfasync="false" type="e350ac6f596d90da70624b6d-text/javascript" src='.fluidbox.min.js?ver=2.0.5' id='jquery-fluidbox-js'>

Basically just the inclusion of my attribute letting everything unchanged

The script is loaded by the theme with

wp_enqueue_script( 'jquery-fluidbox', get_parent_theme_file_uri( 'assets/js/jquery.fluidbox.min.js' ), array(), '2.0.5', true );

I've seen this solution Adding Additional Attributes in Script Tag for 3rd party JS but it's 7 years old and doesn't seem to work for me.

I was looking for a method to add the data-cfasync="false" attribute to a javascript loaded by the theme itself.

My theme load the script

<script type="e350ac6f596d90da70624b6d-text/javascript" src='https://thegroovecartel/wp-content/themes/zeen/assets/js/jquery.fluidbox.min.js?ver=2.0.5' id='jquery-fluidbox-js'>

And I would like to have

<script data-cfasync="false" type="e350ac6f596d90da70624b6d-text/javascript" src='https://thegroovecartel/wp-content/themes/zeen/assets/js/jquery.fluidbox.min.js?ver=2.0.5' id='jquery-fluidbox-js'>

Basically just the inclusion of my attribute letting everything unchanged

The script is loaded by the theme with

wp_enqueue_script( 'jquery-fluidbox', get_parent_theme_file_uri( 'assets/js/jquery.fluidbox.min.js' ), array(), '2.0.5', true );

I've seen this solution Adding Additional Attributes in Script Tag for 3rd party JS but it's 7 years old and doesn't seem to work for me.

• filters
• javascript

• Hi there! Please edit your question to include more information. How is the Script included: by wp_enqueue_script or in some other form? – HU is Sebastian Commented Oct 30, 2020 at 7:44
• @HUistSebastian it is loaded by the theme itself as it's a script used by the theme. I don't know how the theme loads it. Is there a way to see how it happens? – NicoCaldo Commented Oct 30, 2020 at 7:55
• You can download the theme files and search for the string jquery-fluidbox-js using an editor like Visual Studio Code – HU is Sebastian Commented Oct 30, 2020 at 8:28
• @HUistSebastian edited – NicoCaldo Commented Oct 30, 2020 at 13:40

1 Answer 1

The code referenced in your question is still good. I double checked, and this worked for me:

function wpse_script_loader_tag( $tag, $handle ) {
    if ( 'jquery-fluidbox' !== $handle ) {
        return $tag;
    }

    return str_replace( ' src', ' data-cfasync="false" src', $tag );
}
add_filter( 'script_loader_tag', 'wpse_script_loader_tag', 10, 2 );

(I tested with a different script handle, but that won't matter):