Posted By

designermedia on 08/26/15


Tagged

wordpress


Versions (?)

How to add a simple jQuery script to WordPress


 / Published in: jQuery
 

URL: http://stackoverflow.com/questions/11159860/how-do-i-add-a-simple-jquery-script-to-wordpress

First you need to write your script. In your theme folder create a folder called something like 'js'. Create a file in that folder for your javascript. E.g. your-script.js. Add your jQuery script to that file (you don't need tags in a .js file).

Here is an example of how your jQuery script (in wp-content/themes/your-theme/js/your-scrript.js) might look:

jQuery(document).ready(function($) { $('#nav a').last().addClass('last'); })

Notice that I use jQuery and not $ at the start of the function.

Ok, now open your theme's functions.php file. You'll want to use the wpenqueuescript() function so that you can add your script whilst also telling WordPress that it relies on jQuery. Here's how to do that:

addaction( 'wpenqueuescripts', 'addmyscript' ); function addmyscript() { wpenqueuescript( 'your-script', // name your script so that you can attach other scripts and de-register, etc. gettemplatedirectoryuri() . '/js/your-script.js', // this is the location of your script file array('jquery') // this array lists the scripts upon which your script depends ); }

  1. jQuery(document).ready(function($) {
  2. $('#nav a').last().addClass('last');
  3. })
  4.  
  5. ------
  6.  
  7. add_action( 'wp_enqueue_scripts', 'add_my_script' );
  8. function add_my_script() {
  9. wp_enqueue_script(
  10. 'your-script', // name your script so that you can attach other scripts and de-register, etc.
  11. get_template_directory_uri() . '/js/your-script.js', // this is the location of your script file
  12. array('jquery') // this array lists the scripts upon which your script depends
  13. );
  14. }

Report this snippet  

You need to login to post a comment.