enqueue script for specific shortcode

I’ve created some shortcodes and for some of these, I need to load particular scripts on demand.

I’ve included by default in my function.php file

vendor.js
myscript.js

When i load the shortcode, i need to include a separate script between the two above (meaning that myscript.js requires the new script to be included before it to work).

I’ve created the shortcode like this:

function callbackService()
{
ob_start();
get_template_part(‘hg_custom_shortcodes/callback’);
return ob_get_clean();
}
add_shortcode(‘callbackService’, ‘callbackService’);

the template is loading an angular app.

I then tried to load my script (the one that needs to be included only when the shortcode is loaded) by changing the snippet above to this:

function callbackService()
{
ob_start();
wp_enqueue_script(‘angular-bundle’, get_template_directory_uri() . ‘/scripts/angular-bundle.js’, array(), false, true);
get_template_part(‘hg_custom_shortcodes/callback’);
return ob_get_clean();
}
add_shortcode(‘callbackService’, ‘callbackServhowever

The script is included, hovewer i think it’s included after myscript.js and the whole shortcode (angular app) is not working as “Angular is not defined”.

How can i tell the enqueue to load the script after?
I know that usually i would change the add_action() priority, but in this particular case there’s no add_action involved and i don’t know what else to try.

Any suggestions? thanks

Read more here:: enqueue script for specific shortcode

Leave a Reply

Your email address will not be published. Required fields are marked *