How to add javascript code into Divi child theme?

Question

I want to add this JavaScript code into my Divi child theme. I have made a directory for the js file inside the Divi child theme folder. The name of the js file is "selectpage.js".

<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(".select_page").text("your-text-here");
});
</script>

I added this code into my functions.php file. This is not working, I think I am doing something wrong with the wp_enqueue_script directory. Because when I go to inspect on the site it tries to locate the js files in the /wp-incldudes/js/scripts. Does it matter where I put the js file inside my child theme folder? It is only for changing the text in the mobile center-menu "select_page".

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'divi-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );


**wp_enqueue_script( 'et_mobile_nav_menu', $template_dir . '/js/selectpage.js', array( 'jquery' ), true );**



?>

Thanks in Advance, Davíð

Scripts should be enqueued using the wp_enqueue_scripts hook - example - and take time to thoroughly read the wp_enqueue_script() documentation. For Divi-specific stuff (like Divi script handle), consult the Divi support forums/site. — Sally CJ
– Sally CJ, Commented Sep 23, 2019 at 9:53

Refilon · Accepted Answer · 2019-09-26 09:45:09Z

0

You're almost there, change code in functions.php to:

<?php
function my_theme_enqueue_styles() {

    $parent_style = 'divi-style';

    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style ),
        wp_get_theme()->get('Version')
    );
    wp_enqueue_script( 'et_mobile_nav_menu', get_stylesheet_directory_uri() . '/js/selectpage.js', array( 'jquery' ), true );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

Now your script should be located at: /wp-content/themes/divi-child/js/selectpage.js

edited Sep 26, 2019 at 9:45

answered Sep 23, 2019 at 12:57

Refilon

3412 silver badges12 bronze badges

I tried this and it still does not work, this is the site I am doing it for ro-fridur.is, I see one error when I go to inspect but I dont know what it means. Maybe it is not searching for the script in the right location ?

davidhlyns
– davidhlyns

2019-09-26 08:39:26 +00:00
Commented Sep 26, 2019 at 8:39
Yes it is correct i have a divi-child directory and the js file is inside /wp-content/themes/divi-child/js/selectpage.js. What should I change from Divi to divi-child ?

davidhlyns
– davidhlyns

2019-09-26 09:43:02 +00:00
Commented Sep 26, 2019 at 9:43
@davidhlyns I updated the code in my answer, paste it in and now it should work.

Refilon
– Refilon

2019-09-26 09:46:07 +00:00
Commented Sep 26, 2019 at 9:46
@davidhlyns no problem. Please upvote and accept the answer.

Refilon
– Refilon

2019-09-26 09:48:25 +00:00
Commented Sep 26, 2019 at 9:48

Add a comment |

Stack Exchange Network

How to add javascript code into Divi child theme?

1 Answer 1

Your Answer

Hot Network Questions

How to add javascript code into Divi child theme?

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Related

Hot Network Questions