This short tutorial will show you how to use Bootstrap on your website. When you are finished with this tutorial you should have a bare bones Bootstrap page to start working with.
Where to Find Bootstrap
The first step to installing the Bootstrap framework is downloading the source code. These files can be found at the Bootstrap website:
http://getbootstrap.com/. Selecting the most current version is recommended since this is the only version that is supported. Make sure to download these files to the directory where your HTML files are stored or else it will not work. Save everything with the same structure they had when downloaded, folders and all.
Creating a Basic Bootstrap Page
The following represents a basic HTML page:
In order to add Bootstrap functionality to this page, you simply need to link to the Bootstrap CSS file:
If you placed your source files in a location different than your HTML files, be sure to update the
href attribute to point to the correct location.
After this has been added to you HTML, Bootstrap is strapped and ready to go. Keep in mind, this is the simplest of Bootstrap pages, with just enough code to utilize the framework. The official Bootstrap Basic Template looks a little more complicated than what we just configured, but rest assured there is nothing special you need to do with this template, as you can start building your HTML right away with the same functionality as our barebones page. Here is what the Basic Template looks like:
Congratulations! You have built your first Bootstrap enabled website. While it might not look like much yet, you are well on your way to creating professionally designed and polished websites that everyone will enjoy. Be sure to check back for more Bootstrap tutorials.