Bootstrap 2

 

3. Include jQuery

In order to get the full functionality of Bootstrap, you also need to load the jQuery library. Here, too, you have the possibility to load it remotely or host it locally.

(Quick note: Bootstrap 5, which is currently in Beta status, will stop using jQuery and use plain JavaScript instead. We will address the upcoming change below. However, for the current version, Bootstrap 4, you still need jQuery, so this tutorial will include it.)

You find the link to the latest version of the jQuery library here (click on any of the links to get the remote URL). You can use it to load the library into your page by putting the line of code below right before where it says </body> on your page.

<script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>

Alternatively, download jQuery (right-click > Save Link As…), unzip, and put it into the project folder. Then, include it in the same place of your file in this way:

<script src="jquery-3.5.1.min.js"></script>

Again, make sure the path corresponds to your location and version of jQuery.

4. Load Bootstrap JavaScript

The last step in setting up Bootstrap is to load the Bootstrap JavaScript library. It’s included in the downloaded version of the framework and you also find links to remote sources in the same place as mentioned above. However, we will load it in a different place than the style sheet. Instead of the header, it goes into the page footer, right after the call for jQuery.

You can call it remotely like this:

<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js" integrity="sha384-w1Q4orYjBQndcko6MimVbzY0tgp4pWB4lZ7lr30WKz0vr/aWKhXdBNmNb5D92v7s" crossorigin="anonymous"></script>

Or locally like so:

<script src="bootstrap/js/bootstrap.min.js"></script>