John Davidson

Message:

I have a question and I hope you can help me. I am an amateur (quite clear :-) ) trying to enqueue some script. It works, but I have the idea that my website is loading slowly, because of an error in the implementation.

<?php

// Exit if accessed directly

if ( !defined( 'ABSPATH' ) ) exit;



// BEGIN ENQUEUE PARENT ACTION

// AUTO GENERATED - Do not modify or remove comment markers above or below:



if ( !function_exists( 'chld_thm_cfg_locale_css' ) ):

    function chld_thm_cfg_locale_css( $uri ){

        if ( empty( $uri ) && is_rtl() && file_exists( get_template_directory() . '/rtl.css' ) )

            $uri = get_template_directory_uri() . '/rtl.css';

        return $uri;

    }

endif;

add_filter( 'locale_stylesheet_uri', 'chld_thm_cfg_locale_css' );





/**

 * Enqueue scripts.

 */

function hueman_pro_child_scripts()

{       

    wp_enqueue_script('hueman-pro-child-calculators', get_stylesheet_directory_uri() . '/assets/js/calculators.js', array(), null, true);

    

}

add_action('wp_enqueue_scripts', 'hueman_pro_child_scripts');

referring to

/** calculators.js

 * Contains JavaScript code required by "stuff". */



// WPC7 

$("input.wpcf7-form-control, textarea.wpcf7-form-control").attr("autocomplete", "negative");



$(document).ready(function() {

  $("[data-link]").click(function() {

    window.location.href = $(this).attr("data-link");

    return false;

  });

});



// BG COLOR NAV MOBILE  

$(".ham__navbar-toggler-two").click(function(){ 

   // changed class name

  $("#nav-mobile").toggleClass('maindisplay_white');

});



// SUBHEADER

$(document).ready(function() {

    $(window).scroll(function() {

        if ($(window).scrollTop() > 50) {

            $('.suba').addClass('scrolled');

            $('.subb').addClass('scrolled2');

        

        } else {

            $('.suba').removeClass('scrolled');

            $('.subb').removeClass('scrolled2');

            

        };

    });

});



// READMORE

$(document).ready(function(){

     $("#read-more").hide();  // Hide element on default

    $(".show-readmore").click(function(){

        $("#read-more").toggle(500);

    });



    $('.show-readmore').click(function(){

      $('i').toggleClass('far fa-arrow-alt-circle-down far fa-arrow-alt-circle-right');

    });

});

Thanks in advance for your response

---

My Answer:
To properly enqueue assets in WordPress, you should use the `wp_enqueue_script()` function within your theme's `functions.php` file. Here is an example of how you can enqueue your `calculators.js` script:

php
function hueman_pro_child_scripts() {
// Enqueue calculators.js script
wp_enqueue_script('hueman-pro-child-calculators', get_stylesheet_directory_uri() . '/assets/js/calculators.js', array('jquery'), null, true);
}
add_action('wp_enqueue_scripts', 'hueman_pro_child_scripts');


In the above code:
- `wp_enqueue_script()` is used to enqueue the script.
- The first parameter is the handle for the script, which should be unique.
- The second parameter is the URL of the script file.
- The third parameter is an array of dependencies, in this case, we are specifying that jQuery is a dependency for the script.
- The fourth parameter is the version number of the script (you can use `null` if you don't have a specific version).
- The fifth parameter is a boolean value indicating whether the script should be loaded in the footer (`true` for footer, `false` for header).

Make sure to replace the existing code in your `functions.php` file with the code above. This should properly enqueue your script and improve the loading speed of your website.