Web Development

Question

Javascript will not work in child theme with wordpress

By spencer1621515293 ·
Hi, could anybody help me figure out why javascript code will not work.
I have put the javascript code in custom-script.js in a child theme, called twentythirteen-child.
And have enqueued it in functions.php and put the html on the wordpess page.
Here is the javascript code:
<script>

let counterDisplayElem = document.querySelector('.counter-display');
let counterMinusElem = document.querySelector('.counter-minus');
let counterPlusElem = document.querySelector('.counter-plus');

let count = 0;

updateDisplay();

counterPlusElem.addEventListener("click",()=>{
count++;
updateDisplay();
}) ;

counterMinusElem.addEventListener("click",()=>{
count--;
updateDisplay();
});

function updateDisplay(){
counterDisplayElem.innerHTML = count;
};

here is the enqueued code in functions.php:

<?php
function childtheme_parent_styles() {
wp_enqueue_style( 'parent', get_template_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'childtheme_parent_styles');


function mytheme_files() {
wp_enqueue_style('mytheme_main_style', get_stylesheet_uri());

}

add_action( 'wp_enqueue_scripts', 'mytheme_files');


add_action( 'wp_enqueue_scripts', 'my_custom_script_load' );
function my_custom_script_load(){
wp_enqueue_script( 'my-custom-script', get_stylesheet_directory_uri() . '/custom-scripts', array( 'jquery' ) );
}


?>

and here is the html in worpress page:

<h1 class="counter-display"..)</h1>
<button class="counter-minus">-</button>
<button class="counter-plus">+</button>
Thread display: Collapse - | Expand +

All Answers

Collapse -

Did you ask this before?

by rproffitt Moderator In reply to Javascript will not work ...
Collapse -

Thanks, I am doing what it says, still can not get javascript to work

by spencer1621515293 In reply to Did you ask this before?

Hi, I am doing what it says on your link, but I just can't seem to get any javascript to work.
I have put a clock on now. The css works fine in the child theme, but am I enqueung it correctly. Please tell me here where I have gone wrong with enqueung in functions.php.

Here is the code in functions.php:
<?php
function childtheme_parent_styles() {
wp_enqueue_style( 'parent', get_template_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'childtheme_parent_styles');


function mytheme_files() {
wp_enqueue_style('mytheme_main_style', get_stylesheet_uri());
function my_custom_scripts() {
wp_enqueue_script( 'custom-js', get_stylesheet_directory_uri() . '/js/custom.js', array( 'jquery' ),'',true );
}

add_action( 'wp_enqueue_scripts', 'mytheme_files');
add_action( 'wp_enqueue_scripts', 'wpdocs_theme_name_scripts' );

}

?>

Collapse -

Does your code pass the usual tests?

by rproffitt Moderator In reply to Thanks, I am doing what i ...
Collapse -

How do I pass the usual tests to see if code is correct

by spencer1621515293 In reply to Does your code pass the u ...

Thanks, but how do I pass the usual tests to see why and if my code is correct

Collapse -

At this point.

by rproffitt Moderator In reply to How do I pass the usual t ...

It's apparent you need to hire or outsource this work. The code tests I noted are easy to use and for all web masters I've worked with they were able to run the tests and use the results to fix or improve their code.

This didn't happen here so I am left to guess you need more time to take more classes or tutorials. OR just find others to code it up for you. As a rule I don't code for free. I will offer how I find bugs, point out or correct a bad line or two but beyond that I expect the code/web owner to put in the work.

Yes that upsets some but hey, this is all free stuff.

Related Discussions

Related Forums