Double jQuery loaded

Question

Please help me to understand why this works.

I have loaded my jQuery in mu functions.php-file like this:

<?php 
    function load_jquery() {
        wp_enqueue_script( 'jquery' );
    }

    add_action( 'wp_enqueue_scripts', 'load_jquery' );
?>

This is the only proper way of doing this I know.
But now comes the problem
From a github page
I have downloaded a .zip-file to add to my website

To do this I have to add the following in the head of my header.php-file :

    <script src="<?php bloginfo('template_directory')?>/js/modernizr-2.6.2.min.js"></script>
    <script src="<?php bloginfo('template_directory')?>/js/jquery-1.9.1.min.js"></script>
    <script src="<?php bloginfo('template_directory')?>/js/jquery.cookie-1.3.1.js"></script>
    <script src="<?php bloginfo('template_directory')?>/js/jquery.steps.js"></script>

The first time I did this I left out the jquery-1.9.1.min.js file because I thought jQuery was allready loaded. It didn't work.

After I added the jQuery file the whole thing came to live like it should be.

The part I don't understand is why I had to load jQuery two times.

I work with WP 4.4.2

Can somebody explain this to me?

---------- UPDATE -----------
So I found that the order of what is loaded matters!
The demo-file (the github link) states teh following order:

<script src="../lib/modernizr-2.6.2.min.js"></script>
<script src="../lib/jquery-1.9.1.min.js"></script>
<script src="../lib/jquery.cookie-1.3.1.js"></script>
<script src="../build/jquery.steps.js"></script>

If I change the location of jquery-1.9.1.min.js and place it at the bottom everything stops working. If I place it just above jquery.steps.js everything works again.

This is the demo version. If I translate this to my WordPress installation I can't edit the output of my wp_head(). Here is what my wp_head()-output looks like:

<script src="http://192.168.104.105:8888/basic/wp-includes/js/jquery/jquery.js?ver=1.11.3" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.2.1" type="text/javascript">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-parallax/1.1.3/jquery-parallax-min.js?ver=4.4.2" type="text/javascript">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-localScroll/1.3.5/jquery.localScroll.min.js?ver=4.4.2" type="text/javascript">
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/1.4.11/jquery.scrollTo.min.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/modernizr-2.6.2.min.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/jquery.cookie-1.3.1.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/jquery.steps.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/modernizr.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/mootools.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/slimbox.js?ver=4.4.2" type="text/javascript">
<script src="http://192.168.104.105:8888/basic/wp-content/themes/basic_theme/js/modernizr_team.js?ver=4.4.2" type="text/javascript">

Should I change the output order (if possible) of wp_head()

I also tried to load the jquery.steps.js file in the wp_footer() but no luck

Regestring and Enqueuing:

function pr_scripts_styles() {

wp_enqueue_script('jquery'); // just enqueue as its already registered 
wp_enqueue_script( 'jquery_parallax', '//cdnjs.cloudflare.com/ajax/libs/jquery-parallax/1.1.3/jquery-parallax-min.js' );
wp_enqueue_script( 'jquery_localscroll', '//cdnjs.cloudflare.com/ajax/libs/jquery-localScroll/1.3.5/jquery.localScroll.min.js' );
wp_enqueue_script( 'jquery_scrollto', '//cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/1.4.11/jquery.scrollTo.min.js' );
wp_enqueue_script( 'jquery_scrollto', '//cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/1.4.11/jquery.scrollTo.min.js' );

/*   REGISTER ALL JS FOR SITE */
wp_register_script('modernizr_2_6_2',get_stylesheet_directory_uri().'/js/modernizr-2.6.2.min.js', array( 'jquery' ));
wp_register_script('jquery_cookie_1_3_1',get_stylesheet_directory_uri().'/js/jquery.cookie-1.3.1.js', array( 'modernizr_2_6_2'));
wp_register_script('jquery_steps',get_stylesheet_directory_uri().'/build/jquery.steps.js',array( 'jquery_cookie_1_3_1' ),'',false);
wp_register_script('modernizr',get_stylesheet_directory_uri().'/js/modernizr.js');
wp_register_script('mootools',get_stylesheet_directory_uri().'/js/mootools.js');
wp_register_script('slimbox',get_stylesheet_directory_uri().'/js/slimbox.js');
wp_register_script('modernizr_team',get_stylesheet_directory_uri().'/js/modernizr_team.js');


/*   REGISTER ALL CSS FOR SITE */
wp_register_style('font_awesome',get_stylesheet_directory_uri().'/font-awesome/4.5.0/css/font-awesome.css');
wp_register_style('normalize',get_stylesheet_directory_uri().'/css/normalize.css');
wp_register_style('main',get_stylesheet_directory_uri().'/css/main.css');
wp_register_style('jquery_steps',get_stylesheet_directory_uri().'/css/jquery.steps.css');
wp_register_style('slimbox_css',get_stylesheet_directory_uri().'/css/slimbox.css');
wp_register_style('teammembers',get_stylesheet_directory_uri().'/css/teammembers.css');

/*   CALL ALL CSS AND SCRIPTS FOR SITE */
wp_enqueue_script('modernizr_2_6_2');
wp_enqueue_script('jquery_cookie_1_3_1');
wp_enqueue_script('jquery_steps');
wp_enqueue_script('modernizr');
wp_enqueue_script('mootools');
wp_enqueue_script('slimbox');
wp_enqueue_script('modernizr_team');

wp_enqueue_style('font_awesome');
wp_enqueue_style('normalize');
wp_enqueue_style('main');
wp_enqueue_style('jquery_steps');
wp_enqueue_style('slimbox_css');
wp_enqueue_style('teammembers');
}
add_action( 'wp_enqueue_scripts', 'pr_scripts_styles' );

Answer 1

You can enqueue all your scripts the same way as you enqueue jQuery.

Register and enqueue all your Javascripts like this (in your load_jquery function)

wp_register_script (
    'yourscripthandle', //string $handle: a string to identify this script
    get_bloginfo( 'template_url' ) . '/js/yourcustomjs.js', //string $src: Path of your script file
    array ('jquery' ), // array $deps = array(): defining which scripts your script is dependend on. In your case, it's jQuery.
    '', // string|bool $ver = false: The version of your Script
    true //bool $in_footer = false: whether your script should be enqueued in `wp_head()` or `wp_footer()`
);
wp_enqueue_script( 'yourscripthandle' );

Afterwards you just need to make sure that you set $in_footer to false, if you need the scripts in the header.

Also make sure your theme calls wp_head()!

The problem with loading jQuery two times seems to be that it is included after your scripts are called - so adding it a second time befor the others solved that issue. Please be sure to correct this, as this is going to have implications on a lot of stuff.