Title: Javascript.. the proper way?
Last modified: August 20, 2016

---

# Javascript.. the proper way?

 *  [op1001](https://wordpress.org/support/users/op1001/)
 * (@op1001)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/javascript-the-proper-way/)
 * Okay, Yes I am new, and I need some assitance and defining the proper way to 
   add javascript .js files..
 * It seems both ways do the same thing.. but what is the proper method?
 * I Have read many tutorials online.. and got a bit confused..
 *     ```
       wp_enqueue_script( 'easing', get_template_directory_uri() . '/js/jquery.easing.1.3.js', array('jquery') );
       wp_enqueue_script( 'common', get_template_directory_uri() . '/js/jquery.common-min.js',array('jquery') );
       wp_enqueue_script( 'sequence', get_template_directory_uri().'/js/sequence.jquery-min.js', array('jquery') );
   
       wp_enqueue_script( 'quicksand', get_template_directory_uri().'/js/jquery.quicksand.js', array('jquery'));
   
       wp_enqueue_script( 'flex', get_template_directory_uri().'/js/jquery.flexslider-min.js', array('jquery') );
       wp_enqueue_script( 'pretty', get_template_directory_uri().'/js/jquery.prettyPhoto.js', array('jquery'));
       wp_enqueue_script( 'carousel', get_template_directory_uri().'/js/jquery.jcarousel.min.js', array('jquery') );
   
       wp_enqueue_script( 'tipsy', get_template_directory_uri().'/js/jquery.tipsy.js', array('jquery'), '1.0');
   
       }
       add_action( 'wp_enqueue_scripts', 'scripts_basic' );  
   
       or
   
       wp_register_script( 'easing', get_template_directory_uri() . '/js/jquery.easing.1.3.js', array('jquery') );
       wp_register_script( 'common', get_template_directory_uri() . '/js/jquery.common-min.js',array('jquery') );
       wp_register_script( 'sequence', get_template_directory_uri().'/js/sequence.jquery-min.js', array('jquery') );
   
       wp_register_script( 'quicksand', get_template_directory_uri().'/js/jquery.quicksand.js', array('jquery'));
   
       wp_register_script( 'flex', get_template_directory_uri().'/js/jquery.flexslider-min.js', array('jquery') );
       wp_register_script( 'pretty', get_template_directory_uri().'/js/jquery.prettyPhoto.js', array('jquery'));
       wp_register_script( 'carousel', get_template_directory_uri().'/js/jquery.jcarousel.min.js', array('jquery') );
   
       wp_register_script( 'tipsy', get_template_directory_uri().'/js/jquery.tipsy.js', array('jquery'), '1.0');
   
       wp_enqueue_script( 'easing' );  
   
       wp_enqueue_script( 'common' );
       wp_enqueue_script( 'sequence' );
       wp_enqueue_script( 'quicksand' );  
   
       wp_enqueue_script( 'flex' );
       wp_enqueue_script( 'pretty' );
       wp_enqueue_script( 'carousel' );
       wp_enqueue_script( 'tipsy' );  
   
       }
       add_action( 'wp_enqueue_scripts', 'scripts_basic' );
       ```
   

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [catacaustic](https://wordpress.org/support/users/catacaustic/)
 * (@catacaustic)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/javascript-the-proper-way/#post-3432378)
 * The way that you’re doing it there, both ways are fine, but if it was me I’d 
   do it the first way because there’s only one function call for each file compared
   to two function calls for the lower example. This is because it looks like none
   of the files are related or interact (apart from the requiring jQuery but that
   doesn’t have any effect on the individual JS files).
 * The big reason to use wp_register_script() before you use wp_enqueue_script()
   is when you have JS files that reply on other JS files. I normally have my own
   custom JS file that I load with all of my definitions and actions in it, but 
   set up the wp_register_script() to require all of the other related scripts. 
   What this does is let me wp_enqueue_script() on my single custom JS file only,
   and WordPress automatically loads all of the required JS files that I’ve specified.
 *  Thread Starter [op1001](https://wordpress.org/support/users/op1001/)
 * (@op1001)
 * [13 years, 1 month ago](https://wordpress.org/support/topic/javascript-the-proper-way/#post-3432498)
 * Okay , I am confused, ther are so many methods and I can’t seem to find a right
   explanation ..
 * In functions.php I have the following..
 *     ```
       wp_register_script( 'info-caroufredsel', get_template_directory_uri() . '/js/jquery.carouFredSel-5.5.0-packed.js', array('jquery'), '5.5.0', true );
         wp_register_script( 'info-carousel-instance', get_template_directory_uri() . '/js/info-carousel-instance.js', array('info-caroufredsel'), '1.0', true );
   
         wp_register_script( 'jquery.flexslider', get_template_directory_uri().'/js/jquery.flexslider-min.js', array('jquery'), '1.7', true );
         wp_register_script( 'home-page-main-flex-slider', get_template_directory_uri().'/js/home-page-main-flex-slider.js', array('jquery.flexslider'), '1.0', true );
   
         wp_enqueue_script( 'info-carousel-instance' );
           wp_enqueue_script('home-page-main-flex-slider');
       ```
   
 * So two scripts are getting enqueued and two are not.
 * the question is
 * How do I call the two scripts that are not getting engueued in my theme?
 * I don’t want the scripts always loading on every page if they arent’ being used?
   you know what i mean?
 * I’ve seen so many techniques for javascript It is confusing … there doesn’t seem
   to be a standard way to do it
 * I’ve seen people add it in their headers etc etc.
 *  [catacaustic](https://wordpress.org/support/users/catacaustic/)
 * (@catacaustic)
 * [13 years, 1 month ago](https://wordpress.org/support/topic/javascript-the-proper-way/#post-3432499)
 * `wp_register_script()` – Registeres a script file with the system, but doesn’t
   actually include it in any page calls anywhere.
 * `wp_enqueue_script()` – Adds the script file to the current HTML. This can be
   used to enqueue a registered script file or to add a new script file without 
   needing to register it first.
 * Looking at your code there, **all** of the JS files are being enqueued. The third
   parameter for `wp_register_script` is an array of dependancies, and this is used
   to that when you enqueue that scirpt it also enqueues all of the dependancies
   before it, saving you from havig to enqueue every single JS file. You should 
   read up on the differences between [wp_register_script()](http://codex.wordpress.org/Function_Reference/wp_register_script)
   and [wp_enqueue_script()](http://codex.wordpress.org/Function_Reference/wp_enqueue_script);
 * As for adding it on aper-page basis, you can use a lot of the conditional functions
   that WordPress has available to check where you want it added.
 * This is the standard way to do it in WordPress. I’m not sure how many other ways
   you’ve seen it done, but these two functions are the default WordPress ones and
   are the ones that are recommended ot use.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Javascript.. the proper way?’ is closed to new replies.

## Tags

 * [javascript](https://wordpress.org/support/topic-tag/javascript/)
 * [loading](https://wordpress.org/support/topic-tag/loading/)
 * [wp_enqueue_script](https://wordpress.org/support/topic-tag/wp_enqueue_script/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 3 replies
 * 2 participants
 * Last reply from: [catacaustic](https://wordpress.org/support/users/catacaustic/)
 * Last activity: [13 years, 1 month ago](https://wordpress.org/support/topic/javascript-the-proper-way/#post-3432499)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics