Jquery in Child Theme

[nitin]

Hello there!

I am in need of adding custom Jquery to my website: http://hotwax.co/.
I tried adding the jquery code using cornerstone! This did not work for me.

Also, I am much comfortable editing and adding codes and styles with the files in hand rather than writing them in cornerstone setup.

Please guide me where whether it is a best practice to add a jquery file in x child theme and enqueque it from functions.php or not?
Or what else can be the super easy way in this scenario.

Thank You,

Cheers,
Nitin

[jumar]

Hello @nitin,

Thanks for writing in!

In Cornerstone, did you check if you’ve wrapped your code on a $( document ).ready() block?

jQuery( document ).ready(function( $ ) {
  // Code here
});

Adding custom JS in Cornerstone is applicable only if you have few lines of code. If you want to add jQuery plugins or your custom JS file with lots of code, then wp_enqueue_script() is the way to go.

Hope that helps. Let me know if you have any question.

[nitin]

Hello @jumar

I have figured out the way to add and enqueue the script. Thank you so much! It’s working on my staging instance, but not working on the live production (https://www.hotwax.co/wp-content/themes/x-child/js/x-custom-script.js?ver=4.9.2)

Live: https://www.hotwax.co/resources/ (hit case study button)
Staging: https://www.staging5.hotwax.co/resources/ (hit case study button)

Thank you
nitin

[jumar]

Hello there,

Glad to hear that!

It might be of your PDF file permissions. Best way is to check if the PDF file in live server has the same permissions in the staging server. You can request your hosting provider to do this for you.

You might also want to check this solution:

Download File Using jQuery

Do keep in mind that not all the browsers support the download attribute, so the best way to force download is to zip your file instead.

Hope that helps.

[nitin]

Hey there!

Thank you @jumar. The download is working now!

Thanks a lot

[jade]

You’re welcome.