From 463de252a9d695d6b52045e5e7df4e7b82ffb116 Mon Sep 17 00:00:00 2001
From: Mark Otto <markotto@twitter.com>
Date: Fri, 13 Jul 2012 14:20:25 -0700
Subject: update static assets section of extend page, copy changes elsewhere

---
 docs/extend.html | 55 +++++++++++++++++++++++++++++++++++++++++++++++++++++--
 1 file changed, 53 insertions(+), 2 deletions(-)

(limited to 'docs/extend.html')

diff --git a/docs/extend.html b/docs/extend.html
index 1e1c753ea..8e9b79b6b 100644
--- a/docs/extend.html
+++ b/docs/extend.html
@@ -177,8 +177,59 @@
         <div class="page-header">
           <h1>Use as static assets</h1>
         </div>
-        <p class="lead">Quickly start any web project by dropping in the compiled or minified CSS and JS. Layer on custom styles separately for easy upgrades and maintenance moving forward.</p>
-        <p>...</p>
+        <p class="lead"><a href="./getting-started.html">Quickly start</a> any web project by dropping in the compiled or minified CSS and JS. Layer on custom styles separately for easy upgrades and maintenance moving forward.</p>
+
+        <h3>Setup file structure</h3>
+        <p>Download the latest compiled Bootstrap and place into your project. For example, you might have something like this:</p>
+<pre class="prettyprint">
+  app/
+  ├── layouts/
+  └── templates/
+  public/
+  ├── css/
+  │   ├── bootstrap.min.css
+  ├── js/
+  │   ├── bootstrap.min.js
+  └── img/
+      ├── glyphicons-halflings.png
+      └── glyphicons-halflings-white.png
+</pre>
+
+        <h3>Utilize starter template</h3>
+        <p>Copy the following base HTML to get started.</p>
+<pre class="prettyprint linenums">
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Bootstrap 101 Template&lt;/title&gt;
+    &lt;!-- Bootstrap --&gt;
+    &lt;link href="public/css/bootstrap.min.css" rel="stylesheet"&gt;
+    &lt;script src="public/js/bootstrap.min.js"&gt;&lt;/script&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;h1&gt;Hello, world!&lt;/h1&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
+        <h3>Layer on custom code</h3>
+        <p>Work in your custom CSS, JS, and more as necessary to make Bootstrap your own with your own separate CSS and JS files.</p>
+<pre class="prettyprint linenums">
+&lt;html&gt;
+  &lt;head&gt;
+    &lt;title&gt;Bootstrap 101 Template&lt;/title&gt;
+    &lt;!-- Bootstrap --&gt;
+    &lt;link href="public/css/bootstrap.min.css" rel="stylesheet"&gt;
+    &lt;script src="public/js/bootstrap.min.js"&gt;&lt;/script&gt;
+    &lt;!-- Project --&gt;
+    &lt;link href="public/css/application.css" rel="stylesheet"&gt;
+    &lt;script src="public/js/application.js"&gt;&lt;/script&gt;
+  &lt;/head&gt;
+  &lt;body&gt;
+    &lt;h1&gt;Hello, world!&lt;/h1&gt;
+  &lt;/body&gt;
+&lt;/html&gt;
+</pre>
+
       </section>
 
 
-- 
cgit v1.2.3