Group single and multiple select box examples under "The basics".

docs/_includes/examples/basics.html

@@ -1,6 +1,8 @@
 <section>
 
-  <h1 id="basic">The basics</h1>
+  <h1 id="basics" class="page-header">The basics</h1>
+
+  <h2 id="single">Single select boxes</h2>
 
   <p>
     Select2 can take a regular select box like this...
@@ -32,6 +34,32 @@ $(document).ready(function() {
     ...
   <option value="WY">Wyoming</option>
 </select>
+</script>
+
+  <h2 id="multiple">Multiple select boxes</h2>
+
+  <p>
+    Select2 also supports multi-value select boxes. The select below is declared with the <code>multiple</code> attribute.
+  </p>
+
+  <div class="s2-example">
+    <p>
+      <select class="js-example-basic-multiple js-states form-control" multiple="multiple"></select>
+    </p>
+  </div>
+
+  <pre data-fill-from=".js-code-multiple"></pre>
+
+<script type="text/x-example-code" class="js-code-multiple">
+$(".js-example-basic-multiple").select2();
+
+<select class="js-example-basic-multiple" multiple="multiple">
+  <option value="AL">Alabama</option>
+    ...
+  <option value="WY">Wyoming</option>
+</select>
 </script>
 
 </section>
+
+</section>

docs/_includes/examples/multiple.html

@@ -1,27 +0,0 @@
-<section>
-
-  <h1 id="multiple">Multiple select boxes</h1>
-
-  <p>
-    Select2 also supports multi-value select boxes. The select below is declared with the <code>multiple</code> attribute.
-  </p>
-
-  <div class="s2-example">
-    <p>
-      <select class="js-example-basic-multiple js-states form-control" multiple="multiple"></select>
-    </p>
-  </div>
-
-  <pre data-fill-from=".js-code-multiple"></pre>
-
-<script type="text/x-example-code" class="js-code-multiple">
-$(".js-example-basic-multiple").select2();
-
-<select class="js-example-basic-multiple" multiple="multiple">
-  <option value="AL">Alabama</option>
-    ...
-  <option value="WY">Wyoming</option>
-</select>
-</script>
-
-</section>

docs/_includes/nav/examples.html

@@ -1,11 +1,16 @@
 <nav class="s2-docs-sidebar hidden-print hidden-xs hidden-sm">
   <ul class="nav s2-docs-sidenav">
     <li>
-      <a href="#basic">The basics</a>
+      <a href="#basics">The basics</a>
+      <ul class="nav">
+        <li>
+          <a href="#single">Single select boxes</a>
         </li>
         <li>
           <a href="#multiple">Multiple select boxes</a>
         </li>
+      </ul>
+    </li>
     <li>
       <a href="#placeholders">Placeholders</a>
     </li>

docs/examples.html

@@ -27,7 +27,6 @@ slug: examples
     <div class="col-md-9" role="main">
 
       {% include examples/basics.html %}
-      {% include examples/multiple.html %}
       {% include examples/placeholders.html %}
       {% include examples/data.html %}
       {% include examples/disabled-mode.html %}