2015-04-18 12:28:50 -07:00
---
layout: page
2015-08-08 14:20:38 -07:00
title: Quick start
2015-08-05 17:47:45 -07:00
group: getting-started
2015-04-18 12:28:50 -07:00
---
2015-08-08 14:20:38 -07:00
Looking to quickly add Bootstrap to your project? Use the Bootstrap CDN, graciously provided by the MaxCDN folks.
2015-04-18 18:15:58 -07:00
2015-08-08 14:20:38 -07:00
Copy-paste the stylesheet `<link>` into your `<head>` before all other stylesheets to load our CSS.
2015-04-18 18:15:58 -07:00
{% highlight html %}
< link rel = "stylesheet" href = "{{ site.cdn.css }}" >
{% endhighlight %}
2015-08-08 14:20:38 -07:00
Add our JavaScript plugins and jQuery near the end of your pages, right before the closing `</body>` tag. Be sure to place jQuery first as our code depends on it.
2015-04-18 18:15:58 -07:00
{% highlight html %}
< script src = "{{ site.cdn.jquery }}" > < / script >
< script src = "{{ site.cdn.js }}" > < / script >
{% endhighlight %}
2015-08-08 14:20:38 -07:00
And that's it—you're your way to a fully Bootstrapped site. If you're at all unsure about the general page structure, keep reading for an example page template.
2015-06-09 16:09:33 -07:00
## Page template
2015-04-18 18:15:58 -07:00
Be sure to have your pages set up with the latest design and development standards. That means:
* Using an HTML5 doctype
* Forcing Internet Explorer to use its latest rendering mode ([read more]())
* And, utilizing the viewport meta tag.
Put it all together and your pages should look like this:
{% highlight html %}
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2015-08-08 14:20:38 -07:00
< meta http-equiv = "x-ua-compatible" content = "ie=edge" >
<!-- Bootstrap CSS -->
2015-04-18 18:15:58 -07:00
< link rel = "stylesheet" href = "{{ site.cdn.css }}" >
< / head >
< body >
< h1 > Hello, world!< / h1 >
2015-08-08 14:20:38 -07:00
<!-- jQuery first, then Bootstrap JS. -->
2015-04-18 18:15:58 -07:00
< script src = "{{ site.cdn.jquery }}" > < / script >
< script src = "{{ site.cdn.js }}" > < / script >
< / body >
< / html >
{% endhighlight %}
2015-08-08 14:20:38 -07:00
That's all you need for overall page requirements. Visit the [Layout docs ]({{ site.baseurl }}/layout/scaffolding ) to start laying out your site's content before adding components.
