2

I am developing my WordPress theme using Material Bootstrap Design (MDB), a Material variant that uses Bootstrap 4 plus its own code.

It calls for using the following scripts...

<!-- JQuery --> <script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/jquery-2.2.3.min.js"></script> <!-- Bootstrap tooltips --> <script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/tether.min.js"></script> <!-- Bootstrap core JavaScript --> <script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/bootstrap.min.js"></script> <!-- MDB core JavaScript --> <script type="text/javascript" src="/wp-content/themes/blankslate/mdb/js/mdb.min.js"></script>

I had simply added these to the bottom of my footer.php. But now I have read that I should add Javascripts to WordPress properly, ie, by enqueuing.

So far, I have used this...

// Add Javascripts for my Bootstrap theme function bootstrap_scripts_with_jquery() { // Register the script like this for a theme: wp_enqueue_script( 'bootstra-jquery', get_stylesheet_directory_uri() . '/mdb/js/jquery-2.2.3.min.js', array( 'jquery' ) ); wp_enqueue_script( 'bootstrap-jquery-min', get_stylesheet_directory_uri() . '/mdb/js/jquery.min.js' ); wp_enqueue_script( 'bootstrap', get_stylesheet_directory_uri() . '/mdb/js/bootstrap.min.js' ); wp_enqueue_script( 'bootstrap-material', get_stylesheet_directory_uri() . '/mdb/js/mdb.min.js' ); } add_action( 'wp_enqueue_scripts', 'bootstrap_scripts_with_jquery' ); // http://stackoverflow.com/questions/26583978/how-to-load-bootstrap-script-and-style-in-functions-php-wordpress

This works, to a point - it adds my four lines to the code (though I don't know if doing it this way makes any difference).

However, I also see two remaining/default JS lines in my header that I didn't add...

<script type='text/javascript' src='http://www.example.com/wp-includes/js/jquery/jquery.js?ver=1.12.4'></script> <script type='text/javascript' src='http://www.example.com/wp-includes/js/jquery/jquery-migrate.min.js?ver=1.4.1'></script> <script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/jquery-2.2.3.min.js?ver=4.6.1'></script> <script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/jquery.min.js?ver=4.6.1'></script> <script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/bootstrap.min.js?ver=4.6.1'></script> <script type='text/javascript' src='http://www.example.com/wp-content/themes/blankslate/mdb/js/mdb.min.js?ver=4.6.1'></script>

And I am still seeing this line in the footer, though I didn't add it (I think I want to leave this, right?)...

<script type='text/javascript' src='http://www.example.com/wp-includes/js/wp-embed.min.js?ver=4.6.1'></script>

The main question, then, is - how should I deal with the fact that WordPress includes jquery.js?ver=1.12.4 and jquery-migrate.min.js?ver=1.4.1 when my theme does not call for them? Is there a conflict here? If WordPress' own JQuery is being served by passing a version number to it, is it possible that I can force it to use v2.2.3 as requested by my theme? And what about this "migrate" version?

I'm aware that you can dequeue scripts, and have read that you can force a custom version using a filteror similar. But I have also read that you should not be tinkering with removing WordPress' default version of JQuery.

I am confused.

And do I need to enqueue CSS?

Improve this question

    2 Answers 2

    Reset to default
    1

    WordPress loads jQuery because plugins and themes suppose it does. If you want another version of jQuery for your theme, there is a risk that plugins you may be using will not work, since (if they are maintained well) they are designed to work with default jquery.

    That said, if you insist on using your own version of jQuery you can easily deregister it, as you found out. If you're not planning a public release of your theme you can control the consequences.

    And yes, you should enqueue styles as well. The reason to do this, is it allows you to set dependencies, which is important if (for instance) you would want to make a child theme and deregister the parent styles.

    Improve this answer
    2
    • But, if the Bootstrap framework stuff I am using asks for 2.2.3, don't I also risk THAT not working? ie. Can I ensure that both WordPress/plugins and my Bootstrap stuff work? Maybe by adding both lines?
      – Robert Andrews
      CommentedNov 11, 2016 at 16:22
    • 1
      Yes, you're facing a difficult choice. Loading two versions of jQuery may cause troubles as well. So whichever option you choose, some rigorous testing across multiple browsers will be necessary.
      – cjbj
      CommentedNov 11, 2016 at 16:33
    0

    Maybe this is not that much of a WordPress question after all. But as far as I have seen the Bootstrap 4 works with jQuery 1.2.0. Tested Simon Padburys Bootstrap 4 Starter Theme for WordPress which enqueue WordPress onboard (pre-registered) jQuery.

    https://github.com/SimonPadbury/b4st/blob/master/functions/enqueues.php

    Improve this answer
    2
    • 1
      If I comment-out my two added jquery files, Javascript nav tabs stop working.
      – Robert Andrews
      CommentedNov 11, 2016 at 15:31
    • Note: Bootstrap 4 alpha 6 requires jQuery >=1.9.1, see the package.json file from the official repository.
      – Johansson
      CommentedJul 17, 2017 at 22:05

    Start asking to get answers

    Find the answer to your question by asking.

    Ask question

    Explore related questions

    See similar questions with these tags.