Question 14451 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Enqueue External JS WordPress

I’m struggling to understand how to enqueue an external js file with some widget code within WordPress. For example: there is a Frontapp chatbot that has to have the following code placed into the end of the tag with my theme:

<script src="https://chat-assets.frontapp.com/v1/chat.bundle.js"></script>
<script>
  window.FrontChat('init', {chatId: '0xxxx', useDefaultLauncher: true});
</script>

How would I enqueue this since there’s both an external link & snippet of Js?

Tags:

2

Answers


  1. 0

    You can use wp_enqueue_script for external scripts as well as wp_add_inline_script for inline scripts.

    In your case that would be.

    wp_enqueue_script('my-chat-assets', 'https://chat-assets.frontapp.com/v1/chat.bundle.js');
wp_add_inline_script('my-chat-assets', "window.FrontChat('init', {chatId: '0xxxx', useDefaultLauncher: true});");

    Those lines should appear in wp_enqueue_scripts hook like all other enqueued scripts. If you want it at the footer, add true to the footer parameter. So all in all:

    add_action('wp_enqueue_scripts', function () {
    wp_enqueue_script('my-chat-assets', 'https://chat-assets.frontapp.com/v1/chat.bundle.js', [], false, true);
    wp_add_inline_script('my-chat-assets', "window.FrontChat('init', {chatId: '0xxxx', useDefaultLauncher: true});");
});
    Login or Signup to reply.
  2. 0

    I hope this will solve your problem.

    add_action('wp_footer', function () {
    wp_enqueue_script('my-chat-assets', 'https://chat-assets.frontapp.com/v1/chat.bundle.js', [], false, true);
    wp_add_inline_script('my-chat-assets', "window.FrontChat('init', {chatId: '0xxxx', useDefaultLauncher: true});");
});
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search