Advanced Search

How to add a simple jQuery script to WordPress

/ Published in: jQuery
Save to your folder(s)
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 wp_enqueue_script() function so that you can add your script whilst also telling WordPress that it relies on jQuery. Here's how to do that:

add_action( 'wp_enqueue_scripts', 'add_my_script' );
function add_my_script() {
wp_enqueue_script(
'your-script', // name your script so that you can attach other scripts and de-register, etc.
get_template_directory_uri() . '/js/your-script.js', // this is the location of your script file
array('jquery') // this array lists the scripts upon which your script depends
);
}

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  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. }

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

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.