Or more specifically, how to move the code injected by a plugin below WordPress Jquery?

The plugin, Thrive Visual Editor, has a landing page builder, which allows the insertion of scripts and stylesheets via Thrive Content Builder > Landing Page settings > Setup custom scripts.

The custom scripts I’ve inserted into the landing page need to be presented after WordPress Jquery for those scripts to work.

I’m not a developer, or a WordPress developer, I’m a builder/designer.

I’ve searched the plugin folder for instances of add_action('wp_head' and found none. From my limited understanding of WordPress hooks, I was thinking I could find the instance of add_action('wp_head' where the custom scripts were being inserted by the plugin into the <head>, and modify its priority below the WordPress Jquery.

So, my questions are:

  • Is there a standard method a plugin injects code into the front end <head>?
  • How would I change the priority of this insertion so that it occurs after WordPress Jquery?

I’ve Googled how Plugins insert their code into the <head> and can’t find an answer.

Update: I searched the plugin folder for wp_enqueue_scripts and found in
thrive-visual-editor/thrive-visual-editor.php:

add_action('admin_menu', 'tve_add_settings_menu');
add_action('wp_enqueue_scripts', 'tve_frontend_enqueue_scripts');
add_filter('tve_landing_page_content', 'tve_editor_content');

I searched for tve_frontend_enqueue_scripts and found nothing applicable.

I searched for tve_landing_page_content and found in \thrive-visual-editor\landing-page\layout.php:

<body>
...
<?php echo apply_filters( 'tve_landing_page_content', '' ) ?>
...

layout.php appears to be the template file to replace the theme’s page templates – it’s a full HTML+PHP web page.

In the <head> was:

<?php $tcb_landing_page->head(); ?>

So, it looks like this is where the custom scripts are inserted.

There is no wp_head() in the <head> of layout.php

In \thrive-visual-editor\landing-page\inc\TCB_Landing_Page.php there is:

public function head() {
    /* I think the favicon should be added using the wp_head hook and not like this */
    if (function_exists('thrive_get_options_for_post')) {
        $options = thrive_get_options_for_post();
        if (!empty($options['favicon'])) : ?>
            <link rel="shortcut icon" href="https://wordpress.stackexchange.com/questions/229008/<?php echo $options["favicon']; ?>"/>
        <?php endif;
    }

    $this->fonts();

    if (!empty($this->globalScripts['head'])) {
        $this->globalScripts['head'] = $this->removeJQuery($this->globalScripts['head']);
        echo $this->globalScripts['head'];
    }

    empty($this->globals['do_not_strip_css']) ?
        $this->stripHeadCss() : wp_head();

    /* finally, call the tcb_landing_head hook */
    apply_filters(self::HOOK_HEAD, $this->id);
}

1 Answer
1

Scripts must be inserted using wp_enqueue_script. This function allows you to define dependencies, so you can be sure they load after jquery. Like this:

wp_enqueue_script('your-script-name', 'full-path-to-your-script', array('jquery'));

Even better, register your script first. Anyway, look in the plugin code where it enqueues user scripts and make sure it adds the jquery dependency. Or, perhaps better, build a child theme and add the following to functions.php:

add_action ('wp_enqueue_scripts','wpse229008_add_scripts');
function wpse229008_add_scripts() {
    wp_register_script('your-script-name', 'full-path-to-your-script', array('jquery'));
    wp_enqueue_script('your-script-name');
}

Tags:

Leave a Reply

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