update links, new version to v3.4.0, add new baseurl for easy v3.4 building

22 files changed, 55 insertions, 54 deletions

diff --git a/docs/_includes/components/alerts.html b/docs/_includes/components/alerts.html
index 7487a968a..18df10594 100644
--- a/docs/_includes/components/alerts.html
+++ b/docs/_includes/components/alerts.html
@@ -36,7 +36,7 @@
   <p>Build on any alert by adding an optional <code>.alert-dismissible</code> and close button.</p>
   <div class="bs-callout bs-callout-info" id="callout-alerts-dismiss-plugin">
     <h4>Requires JavaScript alert plugin</h4>
-    <p>For fully functioning, dismissible alerts, you must use the <a href="../javascript/#alerts">alerts JavaScript plugin</a>.</p>
+    <p>For fully functioning, dismissible alerts, you must use the <a href="{{ site.baseurl }}/javascript/#alerts">alerts JavaScript plugin</a>.</p>
   </div>
   <div class="bs-example" data-example-id="dismissible-alert-css">
     <div class="alert alert-warning alert-dismissible" role="alert">
diff --git a/docs/_includes/components/button-dropdowns.html b/docs/_includes/components/button-dropdowns.html
index 6f621086e..adf9bad74 100644
--- a/docs/_includes/components/button-dropdowns.html
+++ b/docs/_includes/components/button-dropdowns.html
@@ -5,7 +5,7 @@
 
   <div class="bs-callout bs-callout-danger" id="callout-btndropdown-dependency">
     <h4>Plugin dependency</h4>
-    <p>Button dropdowns require the <a href="../javascript/#dropdowns">dropdown plugin</a> to be included in your version of Bootstrap.</p>
+    <p>Button dropdowns require the <a href="{{ site.baseurl }}/javascript/#dropdowns">dropdown plugin</a> to be included in your version of Bootstrap.</p>
   </div>
 
   <h2 id="btn-dropdowns-single">Single button dropdowns</h2>
diff --git a/docs/_includes/components/button-groups.html b/docs/_includes/components/button-groups.html
index fc8d65269..3f190ff78 100644
--- a/docs/_includes/components/button-groups.html
+++ b/docs/_includes/components/button-groups.html
@@ -1,7 +1,7 @@
 <div class="bs-docs-section">
   <h1 id="btn-groups" class="page-header">Button groups</h1>
 
-  <p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="../javascript/#buttons">our buttons plugin</a>.</p>
+  <p class="lead">Group a series of buttons together on a single line with the button group. Add on optional JavaScript radio and checkbox style behavior with <a href="{{ site.baseurl }}/javascript/#buttons">our buttons plugin</a>.</p>
 
   <div class="bs-callout bs-callout-warning" id="callout-btn-group-tooltips">
     <h4>Tooltips &amp; popovers in button groups require special setting</h4>
diff --git a/docs/_includes/components/dropdowns.html b/docs/_includes/components/dropdowns.html
index 25dab56e2..efa290160 100644
--- a/docs/_includes/components/dropdowns.html
+++ b/docs/_includes/components/dropdowns.html
@@ -1,7 +1,7 @@
 <div class="bs-docs-section">
   <h1 id="dropdowns" class="page-header">Dropdowns</h1>
 
-  <p class="lead">Toggleable, contextual menu for displaying lists of links. Made interactive with the <a href="../javascript/#dropdowns">dropdown JavaScript plugin</a>.</p>
+  <p class="lead">Toggleable, contextual menu for displaying lists of links. Made interactive with the <a href="{{ site.baseurl }}/javascript/#dropdowns">dropdown JavaScript plugin</a>.</p>
 
   <h2 id="dropdowns-example">Example</h2>
   <p>Wrap the dropdown's trigger and the dropdown menu within <code>.dropdown</code>, or another element that declares <code>position: relative;</code>. Then add the menu's HTML.</p>
diff --git a/docs/_includes/components/navbar.html b/docs/_includes/components/navbar.html
index cfa0fea44..935191eb4 100644
--- a/docs/_includes/components/navbar.html
+++ b/docs/_includes/components/navbar.html
@@ -10,14 +10,14 @@
     <p>Since Bootstrap doesn't know how much space the content in your navbar needs, you might run into issues with content wrapping into a second row. To resolve this, you can:</p>
     <ol type="a">
       <li>Reduce the amount or width of navbar items.</li>
-      <li>Hide certain navbar items at certain screen sizes using <a href="../css/#responsive-utilities">responsive utility classes</a>.</li>
+      <li>Hide certain navbar items at certain screen sizes using <a href="{{ site.baseurl }}/css/#responsive-utilities">responsive utility classes</a>.</li>
       <li>Change the point at which your navbar switches between collapsed and horizontal mode. Customize the <code>@grid-float-breakpoint</code> variable or add your own media query.</li>
     </ol>
   </div>
   <div class="bs-callout bs-callout-danger" id="callout-navbar-js">
     <h4>Requires JavaScript plugin</h4>
     <p>If JavaScript is disabled and the viewport is narrow enough that the navbar collapses, it will be impossible to expand the navbar and view the content within the <code>.navbar-collapse</code>.</p>
-    <p>The responsive navbar requires the <a href="../javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p>
+    <p>The responsive navbar requires the <a href="{{ site.baseurl }}/javascript/#collapse">collapse plugin</a> to be included in your version of Bootstrap.</p>
   </div>
   <div class="bs-callout bs-callout-info" id="callout-navbar-breakpoint">
     <h4>Changing the collapsed mobile navbar breakpoint</h4>
@@ -203,7 +203,7 @@
 
   <div class="bs-callout bs-callout-warning" id="callout-navbar-mobile-caveats">
     <h4>Mobile device caveats</h4>
-    <p>There are some caveats regarding using form controls within fixed elements on mobile devices. <a href="../getting-started/#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
+    <p>There are some caveats regarding using form controls within fixed elements on mobile devices. <a href="{{ site.baseurl }}/getting-started/#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
   </div>
 
   <div class="bs-callout bs-callout-warning" id="callout-navbar-form-labels">
@@ -238,7 +238,7 @@
 
   <div class="bs-callout bs-callout-warning" id="callout-navbar-btn-context">
     <h4>Context-specific usage</h4>
-    <p>Like the standard <a href="../css/#buttons">button classes</a>, <code>.navbar-btn</code> can be used on <code>&lt;a&gt;</code> and <code>&lt;input&gt;</code> elements. However, neither <code>.navbar-btn</code> nor the standard button classes should be used on <code>&lt;a&gt;</code> elements within <code>.navbar-nav</code>.</p>
+    <p>Like the standard <a href="{{ site.baseurl }}/css/#buttons">button classes</a>, <code>.navbar-btn</code> can be used on <code>&lt;a&gt;</code> and <code>&lt;input&gt;</code> elements. However, neither <code>.navbar-btn</code> nor the standard button classes should be used on <code>&lt;a&gt;</code> elements within <code>.navbar-nav</code>.</p>
   </div>
 
   <h2 id="navbar-text">Text</h2>
diff --git a/docs/_includes/components/navs.html b/docs/_includes/components/navs.html
index 7e7f357ea..6bb4c36da 100644
--- a/docs/_includes/components/navs.html
+++ b/docs/_includes/components/navs.html
@@ -5,7 +5,7 @@
 
   <div class="bs-callout bs-callout-info" id="callout-navs-tabs-plugin">
     <h4>Using navs for tab panels requires JavaScript tabs plugin</h4>
-    <p>For tabs with tabbable areas, you must use the <a href="../javascript/#tabs">tabs JavaScript plugin</a>. The markup will also require additional <code>role</code> and ARIA attributes – see the plugin's <a href="../javascript/#tabs-usage">example markup</a> for further details.</p>
+    <p>For tabs with tabbable areas, you must use the <a href="{{ site.baseurl }}/javascript/#tabs">tabs JavaScript plugin</a>. The markup will also require additional <code>role</code> and ARIA attributes – see the plugin's <a href="{{ site.baseurl }}/javascript/#tabs-usage">example markup</a> for further details.</p>
   </div>
 
   <div class="bs-callout bs-callout-warning" id="callout-navs-accessibility">
@@ -67,7 +67,7 @@
   <p><strong class="text-danger">Justified navbar nav links are currently not supported.</strong></p>
   <div class="bs-callout bs-callout-warning" id="callout-navs-justified-safari">
     <h4>Safari and responsive justified navs</h4>
-    <p>As of v9.1.2, Safari exhibits a bug in which resizing your browser horizontally causes rendering errors in the justified nav that are cleared upon refreshing. This bug is also shown in the <a href="../examples/justified-nav/">justified nav example</a>.</p>
+    <p>As of v9.1.2, Safari exhibits a bug in which resizing your browser horizontally causes rendering errors in the justified nav that are cleared upon refreshing. This bug is also shown in the <a href="{{ site.baseurl }}/examples/justified-nav/">justified nav example</a>.</p>
   </div>
   <div class="bs-example" data-example-id="simple-nav-justified">
     <ul class="nav nav-tabs nav-justified">
@@ -117,7 +117,7 @@
 
 
   <h2 id="nav-dropdowns">Using dropdowns</h2>
-  <p>Add dropdown menus with a little extra HTML and the <a href="../javascript/#dropdowns">dropdowns JavaScript plugin</a>.</p>
+  <p>Add dropdown menus with a little extra HTML and the <a href="{{ site.baseurl }}/javascript/#dropdowns">dropdowns JavaScript plugin</a>.</p>
 
   <h3>Tabs with dropdowns</h3>
   <div class="bs-example" data-example-id="nav-tabs-with-dropdown">
diff --git a/docs/_includes/components/thumbnails.html b/docs/_includes/components/thumbnails.html
index 0f8382619..8b2d6f939 100644
--- a/docs/_includes/components/thumbnails.html
+++ b/docs/_includes/components/thumbnails.html
@@ -1,7 +1,7 @@
 <div class="bs-docs-section">
   <h1 id="thumbnails" class="page-header">Thumbnails</h1>
 
-  <p class="lead">Extend Bootstrap's <a href="../css/#grid">grid system</a> with the thumbnail component to easily display grids of images, videos, text, and more.</p>
+  <p class="lead">Extend Bootstrap's <a href="{{ site.baseurl }}/css/#grid">grid system</a> with the thumbnail component to easily display grids of images, videos, text, and more.</p>
   <p>If you're looking for Pinterest-like presentation of thumbnails of varying heights and/or widths, you'll need to use a third-party plugin such as <a href="http://masonry.desandro.com">Masonry</a>, <a href="http://isotope.metafizzy.co">Isotope</a>, or <a href="http://salvattore.com">Salvattore</a>.</p>
 
   <h2 id="thumbnails-default">Default example</h2>
diff --git a/docs/_includes/css/forms.html b/docs/_includes/css/forms.html
index ce0673a0e..7aac785b8 100644
--- a/docs/_includes/css/forms.html
+++ b/docs/_includes/css/forms.html
@@ -240,7 +240,7 @@
 {% endhighlight %}
   <div class="bs-callout bs-callout-info" id="callout-xref-input-group">
     <h4>Input groups</h4>
-    <p>To add integrated text or buttons before and/or after any text-based <code>&lt;input&gt;</code>, <a href="../components/#input-groups">check out the input group component</a>.</p>
+    <p>To add integrated text or buttons before and/or after any text-based <code>&lt;input&gt;</code>, <a href="{{ site.baseurl }}/components/#input-groups">check out the input group component</a>.</p>
   </div>
 
   <h3>Textarea</h3>
@@ -639,7 +639,7 @@
   <div class="bs-callout bs-callout-warning" id="callout-form-validation-state-accessibility">
     <h4>Conveying validation state to assistive technologies and colorblind users</h4>
     <p>Using these validation styles to denote the state of a form control only provides a visual, color-based indication, which will not be conveyed to users of assistive technologies - such as screen readers - or to colorblind users.</p>
-    <p>Ensure that an alternative indication of state is also provided. For instance, you can include a hint about state in the form control's <code>&lt;label&gt;</code> text itself (as is the case in the following code example), include a <a href="../components/#glyphicons">Glyphicon</a> (with appropriate alternative text using the <code>.sr-only</code> class - see the <a href="../components/#glyphicons-examples">Glyphicon examples</a>), or by providing an additional <a href="#forms-help-text">help text</a> block. Specifically for assistive technologies, invalid form controls can also be assigned an <code>aria-invalid="true"</code> attribute.</p>
+    <p>Ensure that an alternative indication of state is also provided. For instance, you can include a hint about state in the form control's <code>&lt;label&gt;</code> text itself (as is the case in the following code example), include a <a href="{{ site.baseurl }}/components/#glyphicons">Glyphicon</a> (with appropriate alternative text using the <code>.sr-only</code> class - see the <a href="{{ site.baseurl }}/components/#glyphicons-examples">Glyphicon examples</a>), or by providing an additional <a href="#forms-help-text">help text</a> block. Specifically for assistive technologies, invalid form controls can also be assigned an <code>aria-invalid="true"</code> attribute.</p>
   </div>
 
   <div class="bs-example" data-example-id="form-validation-states">
@@ -728,7 +728,7 @@
   <p><strong class="text-danger">Feedback icons only work with textual <code>&lt;input class="form-control"&gt;</code> elements.</strong></p>
   <div class="bs-callout bs-callout-warning" id="callout-has-feedback-icon-positioning">
     <h4>Icons, labels, and input groups</h4>
-    <p>Manual positioning of feedback icons is required for inputs without a label and for <a href="../components#input-groups">input groups</a> with an add-on on the right. You are strongly encouraged to provide labels for all inputs for accessibility reasons. If you wish to prevent labels from being displayed, hide them with the <code>.sr-only</code> class. If you must do without labels, adjust the <code>top</code> value of the feedback icon. For input groups, adjust the <code>right</code> value to an appropriate pixel value depending on the width of your addon.</p>
+    <p>Manual positioning of feedback icons is required for inputs without a label and for <a href="{{ site.baseurl }}/components#input-groups">input groups</a> with an add-on on the right. You are strongly encouraged to provide labels for all inputs for accessibility reasons. If you wish to prevent labels from being displayed, hide them with the <code>.sr-only</code> class. If you must do without labels, adjust the <code>top</code> value of the feedback icon. For input groups, adjust the <code>right</code> value to an appropriate pixel value depending on the width of your addon.</p>
   </div>
   <div class="bs-callout bs-callout-warning" id="callout-has-feedback-icon-accessibility">
     <h4>Conveying the icon's meaning to assistive technologies</h4>
diff --git a/docs/_includes/css/grid.html b/docs/_includes/css/grid.html
index 509b4cec5..c226ed73c 100644
--- a/docs/_includes/css/grid.html
+++ b/docs/_includes/css/grid.html
@@ -292,7 +292,7 @@
   <div class="col-xs-6 col-sm-3">.col-xs-6 .col-sm-3</div>
 </div>
 {% endhighlight %}
-  <p>In addition to column clearing at responsive breakpoints, you may need to <strong>reset offsets, pushes, or pulls</strong>. See this in action in <a href="../examples/grid/">the grid example</a>.</p>
+  <p>In addition to column clearing at responsive breakpoints, you may need to <strong>reset offsets, pushes, or pulls</strong>. See this in action in <a href="{{ site.baseurl }}/examples/grid/">the grid example</a>.</p>
 {% highlight html %}
 <div class="row">
   <div class="col-sm-5 col-md-6">.col-sm-5 .col-md-6</div>
diff --git a/docs/_includes/css/helpers.html b/docs/_includes/css/helpers.html
index 2da68dffa..969872776 100644
--- a/docs/_includes/css/helpers.html
+++ b/docs/_includes/css/helpers.html
@@ -64,7 +64,7 @@
 
 
   <h3 id="helper-classes-carets">Carets</h3>
-  <p>Use carets to indicate dropdown functionality and direction. Note that the default caret will reverse automatically in <a href="../components/#btn-dropdowns-dropup">dropup menus</a>.</p>
+  <p>Use carets to indicate dropdown functionality and direction. Note that the default caret will reverse automatically in <a href="{{ site.baseurl }}/components/#btn-dropdowns-dropup">dropup menus</a>.</p>
   <div class="bs-example" data-example-id="caret">
     <span class="caret"></span>
   </div>
@@ -99,7 +99,7 @@
 
   <div class="bs-callout bs-callout-warning" id="callout-helper-pull-navbar">
     <h4>Not for use in navbars</h4>
-    <p>To align components in navbars with utility classes, use <code>.navbar-left</code> or <code>.navbar-right</code> instead. <a href="../components/#navbar-component-alignment">See the navbar docs</a> for details.</p>
+    <p>To align components in navbars with utility classes, use <code>.navbar-left</code> or <code>.navbar-right</code> instead. <a href="{{ site.baseurl }}/components/#navbar-component-alignment">See the navbar docs</a> for details.</p>
   </div>
 
 
@@ -180,7 +180,7 @@
 
 
   <h3 id="helper-classes-screen-readers">Screen reader and keyboard navigation content</h3>
-  <p>Hide an element to all devices <strong>except screen readers</strong> with <code>.sr-only</code>. Combine <code>.sr-only</code> with <code>.sr-only-focusable</code> to show the element again when it's focused (e.g. by a keyboard-only user). Necessary for following <a href="../getting-started/#accessibility">accessibility best practices</a>. Can also be used as mixins.</p>
+  <p>Hide an element to all devices <strong>except screen readers</strong> with <code>.sr-only</code>. Combine <code>.sr-only</code> with <code>.sr-only-focusable</code> to show the element again when it's focused (e.g. by a keyboard-only user). Necessary for following <a href="{{ site.baseurl }}/getting-started/#accessibility">accessibility best practices</a>. Can also be used as mixins.</p>
 {% highlight html %}
 <a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>
 {% endhighlight %}
diff --git a/docs/_includes/css/images.html b/docs/_includes/css/images.html
index a79a4d920..08aedb874 100644
--- a/docs/_includes/css/images.html
+++ b/docs/_includes/css/images.html
@@ -3,7 +3,7 @@
 
   <h2 id="images-responsive">Responsive images</h2>
   <p>Images in Bootstrap 3 can be made responsive-friendly via the addition of the <code>.img-responsive</code> class. This applies <code>max-width: 100%;</code>, <code>height: auto;</code> and <code>display: block;</code> to the image so that it scales nicely to the parent element.</p>
-  <p>To center images which use the <code>.img-responsive</code> class, use <code>.center-block</code> instead of <code>.text-center</code>. <a href="../css/#helper-classes-center">See the helper classes section</a> for more details about <code>.center-block</code> usage.</p>
+  <p>To center images which use the <code>.img-responsive</code> class, use <code>.center-block</code> instead of <code>.text-center</code>. <a href="{{ site.baseurl }}/css/#helper-classes-center">See the helper classes section</a> for more details about <code>.center-block</code> usage.</p>
   <div class="bs-callout bs-callout-warning" id="callout-images-ie-svg">
     <h4>SVG images and IE 8-10</h4>
     <p>In Internet Explorer 8-10, SVG images with <code>.img-responsive</code> are disproportionately sized. To fix this, add <code>width: 100% \9;</code> where necessary. Bootstrap doesn't apply this automatically as it causes complications to other image formats.</p>
diff --git a/docs/_includes/css/less.html b/docs/_includes/css/less.html
index 6dc3ae596..85787303b 100644
--- a/docs/_includes/css/less.html
+++ b/docs/_includes/css/less.html
@@ -7,11 +7,11 @@
 
 
   <h2 id="less-bootstrap">Compiling Bootstrap</h2>
-  <p>Bootstrap can be used in at least two ways: with the compiled CSS or with the source Less files. To compile the Less files, <a href="../getting-started/#grunt">consult the Getting Started section</a> for how to setup your development environment to run the necessary commands.</p>
+  <p>Bootstrap can be used in at least two ways: with the compiled CSS or with the source Less files. To compile the Less files, <a href="{{ site.baseurl }}/getting-started/#grunt">consult the Getting Started section</a> for how to setup your development environment to run the necessary commands.</p>
   <p>Third party compilation tools may work with Bootstrap, but they are not supported by our core team.</p>
 
   <h2 id="less-variables">Variables</h2>
-  <p>Variables are used throughout the entire project as a way to centralize and share commonly used values like colors, spacing, or font stacks. For a complete breakdown, please see <a href="../customize/#less-variables-section">the Customizer</a>.</p>
+  <p>Variables are used throughout the entire project as a way to centralize and share commonly used values like colors, spacing, or font stacks. For a complete breakdown, please see <a href="{{ site.baseurl }}/customize/#less-variables-section">the Customizer</a>.</p>
 
   <h3 id="less-variables-colors">Colors</h3>
   <p>Easily make use of two color schemes: grayscale and semantic. Grayscale colors provide quick access to commonly used shades of black while semantic include various colors assigned to meaningful contextual values.</p>
diff --git a/docs/_includes/footer.html b/docs/_includes/footer.html
index 6a41c7d09..fe19b6a70 100644
--- a/docs/_includes/footer.html
+++ b/docs/_includes/footer.html
@@ -6,8 +6,8 @@
     <ul class="bs-docs-footer-links">
       <li><a href="{{ site.repo }}">GitHub</a></li>
       <li><a href="https://twitter.com/getbootstrap">Twitter</a></li>
-      <li><a href="../getting-started/#examples">Examples</a></li>
-      <li><a href="../about/">About</a></li>
+      <li><a href="{{ site.baseurl }}/getting-started/#examples">Examples</a></li>
+      <li><a href="{{ site.baseurl }}/about/">About</a></li>
     </ul>
 
     <p>Designed and built with all the love in the world by <a href="https://twitter.com/mdo" target="_blank">@mdo</a> and <a href="https://twitter.com/fat" target="_blank">@fat</a>. Maintained by the <a href="https://github.com/orgs/twbs/people">core team</a> with the help of <a href="https://github.com/twbs/bootstrap/graphs/contributors">our contributors</a>.</p>
diff --git a/docs/_includes/getting-started/accessibility.html b/docs/_includes/getting-started/accessibility.html
index a21f7219e..60820c121 100644
--- a/docs/_includes/getting-started/accessibility.html
+++ b/docs/_includes/getting-started/accessibility.html
@@ -24,7 +24,7 @@
   <p>Learn more at <a href="http://squizlabs.github.io/HTML_CodeSniffer/Standards/Section508/">HTML CodeSniffer</a> and <a href="http://accessibility.psu.edu/headings">Penn State's AccessAbility</a>.</p>
 
   <h2>Color contrast</h2>
-  <p>Currently, some of the default color combinations available in Bootstrap (such as the various <a href="../css/#buttons">styled button</a> classes, some of the code highlighting colors used for <a href="../css/#code-block">basic code blocks</a>, the <code>.bg-primary</code> <a href="../css/#helper-classes-backgrounds">contextual background</a> helper class, and the default link color when used on a white background) have a low contrast ratio (below the <a href="http://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast">recommended ratio of 4.5:1</a>). This can cause problems to users with low vision or who are color blind. These default colors may need to be modified to increase their contrast and legibility.</p>
+  <p>Currently, some of the default color combinations available in Bootstrap (such as the various <a href="{{ site.baseurl }}/css/#buttons">styled button</a> classes, some of the code highlighting colors used for <a href="{{ site.baseurl }}/css/#code-block">basic code blocks</a>, the <code>.bg-primary</code> <a href="{{ site.baseurl }}/css/#helper-classes-backgrounds">contextual background</a> helper class, and the default link color when used on a white background) have a low contrast ratio (below the <a href="http://www.w3.org/TR/WCAG20/#visual-audio-contrast-contrast">recommended ratio of 4.5:1</a>). This can cause problems to users with low vision or who are color blind. These default colors may need to be modified to increase their contrast and legibility.</p>
 
   <h2>Additional resources</h2>
   <ul>
diff --git a/docs/_includes/getting-started/browser-device-support.html b/docs/_includes/getting-started/browser-device-support.html
index c7efd318c..3979392f9 100644
--- a/docs/_includes/getting-started/browser-device-support.html
+++ b/docs/_includes/getting-started/browser-device-support.html
@@ -74,11 +74,11 @@
   </div>
 
   <p>On Windows, <strong>we support Internet Explorer 8-11</strong>.</p>
-  
+
   <p>For Firefox, in addition to the latest normal stable release, we also support the latest <a href="https://www.mozilla.org/en-US/firefox/organizations/faq/">Extended Support Release (ESR)</a> version of Firefox.</p>
 
   <p>Unofficially, Bootstrap should look and behave well enough in Chromium and Chrome for Linux, Firefox for Linux, and Internet Explorer 7, as well as Microsoft Edge, though they are not officially supported.</p>
-  <p>For a list of some of the browser bugs that Bootstrap has to grapple with, see our <a href="../browser-bugs/">Wall of browser bugs</a>.</p>
+  <p>For a list of some of the browser bugs that Bootstrap has to grapple with, see our <a href="{ site.baseurl }}/browser-bugs/">Wall of browser bugs</a>.</p>
 
   <h2 id="support-ie8-ie9">Internet Explorer 8 and 9</h2>
   <p>Internet Explorer 8 and 9 are also supported, however, please be aware that some CSS3 properties and HTML5 elements are not fully supported by these browsers. In addition, <strong>Internet Explorer 8 requires the use of <a href="https://github.com/scottjehl/Respond">Respond.js</a> to enable media query support.</strong></p>
diff --git a/docs/_includes/getting-started/disabling-responsiveness.html b/docs/_includes/getting-started/disabling-responsiveness.html
index f58befc1f..883e63bb9 100644
--- a/docs/_includes/getting-started/disabling-responsiveness.html
+++ b/docs/_includes/getting-started/disabling-responsiveness.html
@@ -2,11 +2,11 @@
   <h1 id="disable-responsive" class="page-header">Disabling responsiveness</h1>
 
   <p class="lead">Bootstrap automatically adapts your pages for various screen sizes.
-    Here's how to disable this feature so your page works like <a href="../examples/non-responsive/">this non-responsive example</a>.</p>
+    Here's how to disable this feature so your page works like <a href="{{ site.baseurl }}/examples/non-responsive/">this non-responsive example</a>.</p>
 
   <h2>Steps to disable page responsiveness</h2>
   <ol>
-    <li>Omit the viewport <code>&lt;meta&gt;</code> mentioned in <a href="../css/#overview-mobile">the CSS docs</a></li>
+    <li>Omit the viewport <code>&lt;meta&gt;</code> mentioned in <a href="{{ site.baseurl }}/css/#overview-mobile">the CSS docs</a></li>
     <li>Override the <code>width</code> on the <code>.container</code> for each grid tier with a single width, for example <code>width: 970px !important;</code> Be sure that this comes after the default Bootstrap CSS. You can optionally avoid the <code>!important</code> with media queries or some selector-fu.</li>
     <li>If using navbars, remove all navbar collapsing and expanding behavior.</li>
     <li>For grid layouts, use <code>.col-xs-*</code> classes in addition to, or in place of, the medium/large ones. Don't worry, the extra-small device grid scales to all resolutions.</li>
@@ -17,6 +17,6 @@
   <h2>Bootstrap template with responsiveness disabled</h2>
   <p>We've applied these steps to an example. Read its source code to see the specific changes implemented.</p>
   <p>
-    <a href="../examples/non-responsive/" class="btn btn-primary">View non-responsive example</a>
+    <a href="{{ site.baseurl }}/examples/non-responsive/" class="btn btn-primary">View non-responsive example</a>
   </p>
 </div>
diff --git a/docs/_includes/getting-started/examples.html b/docs/_includes/getting-started/examples.html
index 6212f4db7..f659fe7c0 100644
--- a/docs/_includes/getting-started/examples.html
+++ b/docs/_includes/getting-started/examples.html
@@ -121,7 +121,7 @@
         <img src="../examples/screenshots/justified-nav.jpg" alt="Justified nav example">
       </a>
       <h3>Justified nav</h3>
-      <p>Create a custom navbar with justified links. Heads up! <a href="../components/#nav-justified">Not too Safari friendly.</a></p>
+      <p>Create a custom navbar with justified links. Heads up! <a href="{{ site.baseurl }}/components/#nav-justified">Not too Safari friendly.</a></p>
     </div>
     <div class="clearfix visible-xs"></div>
 
diff --git a/docs/_includes/header.html b/docs/_includes/header.html
index 8c7210abe..bf90dc408 100644
--- a/docs/_includes/header.html
+++ b/docs/_includes/header.html
@@ -14,27 +14,28 @@
 
 <!-- Bootstrap core CSS -->
 {% if site.github %}
-<link href="../dist/css/bootstrap.min.css" rel="stylesheet">
+  <link href="{{ site.baseurl }}/dist/css/bootstrap.min.css" rel="stylesheet">
 {% else %}
-<link href="../dist/css/bootstrap.css" rel="stylesheet">
+  <link href="{{ site.baseurl }}/dist/css/bootstrap.css" rel="stylesheet">
 {% endif %}
+
 {% if page.slug == "css" or page.slug == "components" or page.slug == "js" %}
   <!-- Optional Bootstrap Theme -->
-{% if site.github %}
-  <link href="data:text/css;charset=utf-8," data-href="../dist/css/bootstrap-theme.min.css" rel="stylesheet" id="bs-theme-stylesheet">
-{% else %}
-  <link href="data:text/css;charset=utf-8," data-href="../dist/css/bootstrap-theme.css" rel="stylesheet" id="bs-theme-stylesheet">
-{% endif %}
+  {% if site.github %}
+    <link href="data:text/css;charset=utf-8," data-href="{{ site.baseurl }}/dist/css/bootstrap-theme.min.css" rel="stylesheet" id="bs-theme-stylesheet">
+  {% else %}
+    <link href="data:text/css;charset=utf-8," data-href="{{ site.baseurl }}/dist/css/bootstrap-theme.css" rel="stylesheet" id="bs-theme-stylesheet">
+  {% endif %}
 {% endif %}
 
 <!-- Documentation extras -->
 {% if site.github %}
-<link href="../assets/css/docs.min.css" rel="stylesheet">
+<link href="{{ site.baseurl }}/assets/css/docs.min.css" rel="stylesheet">
 {% else %}
-<link href="../assets/css/docs.css" rel="stylesheet">
+<link href="{{ site.baseurl }}/assets/css/docs.css" rel="stylesheet">
 {% endif %}
-<!--[if lt IE 9]><script src="../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
-<script src="../assets/js/ie-emulation-modes-warning.js"></script>
+<!--[if lt IE 9]><script src="{{ site.baseurl }}/assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
+<script src="{{ site.baseurl }}/assets/js/ie-emulation-modes-warning.js"></script>
 
 <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
 <!--[if lt IE 9]>
@@ -43,8 +44,8 @@
 <![endif]-->
 
 <!-- Favicons -->
-<link rel="apple-touch-icon" href="/apple-touch-icon.png">
-<link rel="icon" href="/favicon.ico">
+<link rel="apple-touch-icon" href="{{ site.baseurl }}/apple-touch-icon.png">
+<link rel="icon" href="{{ site.baseurl }}/favicon.ico">
 
 <script>
   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
diff --git a/docs/_includes/js/modal.html b/docs/_includes/js/modal.html
index c2c772b5d..cb00fc80c 100644
--- a/docs/_includes/js/modal.html
+++ b/docs/_includes/js/modal.html
@@ -12,7 +12,7 @@
   </div>
   <div class="bs-callout bs-callout-warning" id="callout-modal-mobile-caveats">
     <h4>Mobile device caveats</h4>
-    <p>There are some caveats regarding using modals on mobile devices. <a href="../getting-started/#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
+    <p>There are some caveats regarding using modals on mobile devices. <a href="{{ site.baseurl }}/getting-started/#support-fixed-position-keyboards">See our browser support docs</a> for details.</p>
   </div>
 
   <p><strong class="text-danger">Due to how HTML5 defines its semantics, the <code>autofocus</code> HTML attribute has no effect in Bootstrap modals.</strong> To achieve the same effect, use some custom JavaScript:</p>
diff --git a/docs/_includes/js/scrollspy.html b/docs/_includes/js/scrollspy.html
index 186a48fb1..192ed45d5 100644
--- a/docs/_includes/js/scrollspy.html
+++ b/docs/_includes/js/scrollspy.html
@@ -53,7 +53,7 @@
 
   <div class="bs-callout bs-callout-warning" id="callout-scrollspy-needs-nav">
     <h4>Requires Bootstrap nav</h4>
-    <p>Scrollspy currently requires the use of a <a href="../components/#nav">Bootstrap nav component</a> for proper highlighting of active links.</p>
+    <p>Scrollspy currently requires the use of a <a href="{{ site.baseurl }}/components/#nav">Bootstrap nav component</a> for proper highlighting of active links.</p>
   </div>
   <div class="bs-callout bs-callout-danger" id="callout-scrollspy-target-ids">
     <h4>Resolvable ID targets required</h4>
diff --git a/docs/_includes/js/tabs.html b/docs/_includes/js/tabs.html
index 1dbe67c33..2abf2fd5a 100644
--- a/docs/_includes/js/tabs.html
+++ b/docs/_includes/js/tabs.html
@@ -33,7 +33,7 @@
 
   <div class="bs-callout bs-callout-info" id="callout-tabs-extends-component">
     <h4>Extends tabbed navigation</h4>
-    <p>This plugin extends the <a href="../components/#nav-tabs">tabbed navigation component</a> to add tabbable areas.</p>
+    <p>This plugin extends the <a href="{{ site.baseurl }}/components/#nav-tabs">tabbed navigation component</a> to add tabbable areas.</p>
   </div>
 
 
@@ -57,7 +57,7 @@ $('#myTabs li:eq(2) a').tab('show') // Select third tab (0-indexed)
 {% endhighlight %}
 
   <h3>Markup</h3>
-  <p>You can activate a tab or pill navigation without writing any JavaScript by simply specifying <code>data-toggle="tab"</code> or <code>data-toggle="pill"</code> on an element. Adding the <code>nav</code> and <code>nav-tabs</code> classes to the tab <code>ul</code> will apply the Bootstrap <a href="../components/#nav-tabs">tab styling</a>, while adding the <code>nav</code> and <code>nav-pills</code> classes will apply <a href="../components/#nav-pills">pill styling</a>.</p>
+  <p>You can activate a tab or pill navigation without writing any JavaScript by simply specifying <code>data-toggle="tab"</code> or <code>data-toggle="pill"</code> on an element. Adding the <code>nav</code> and <code>nav-tabs</code> classes to the tab <code>ul</code> will apply the Bootstrap <a href="{{ site.baseurl }}/components/#nav-tabs">tab styling</a>, while adding the <code>nav</code> and <code>nav-pills</code> classes will apply <a href="{{ site.baseurl }}/components/#nav-pills">pill styling</a>.</p>
 {% highlight html %}
 <div>
 
diff --git a/docs/_includes/nav/main.html b/docs/_includes/nav/main.html
index 4338e57e6..d0fd1f81c 100644
--- a/docs/_includes/nav/main.html
+++ b/docs/_includes/nav/main.html
@@ -7,24 +7,24 @@
         <span class="icon-bar"></span>
         <span class="icon-bar"></span>
       </button>
-      <a href="../" class="navbar-brand">Bootstrap</a>
+      <a href="{{ site.baseurl }}/" class="navbar-brand">Bootstrap</a>
     </div>
     <nav id="bs-navbar" class="collapse navbar-collapse">
       <ul class="nav navbar-nav">
         <li{% if page.slug == "getting-started" %} class="active"{% endif %}>
-          <a href="../getting-started/">Getting started</a>
+          <a href="{{ site.baseurl }}/getting-started/">Getting started</a>
         </li>
         <li{% if page.slug == "css" %} class="active"{% endif %}>
-          <a href="../css/">CSS</a>
+          <a href="{{ site.baseurl }}/css/">CSS</a>
         </li>
         <li{% if page.slug == "components" %} class="active"{% endif %}>
-          <a href="../components/">Components</a>
+          <a href="{{ site.baseurl }}/components/">Components</a>
         </li>
         <li{% if page.slug == "js" %} class="active"{% endif %}>
-          <a href="../javascript/">JavaScript</a>
+          <a href="{{ site.baseurl }}/javascript/">JavaScript</a>
         </li>
         <li{% if page.slug == "customize" %} class="active"{% endif %}>
-          <a href="../customize/">Customize</a>
+          <a href="{{ site.baseurl }}/customize/">Customize</a>
         </li>
       </ul>
       <ul class="nav navbar-nav navbar-right">