! site: introduce a navigation tree on documentation pages and reorder the site structure accordingly

26 files changed, 339 insertions, 79 deletions

diff --git a/site/src/main/jekyll/_includes/documentation-tree.html b/site/src/main/jekyll/_includes/documentation-tree.html
new file mode 100644
index 00000000..ae2bf15a
--- /dev/null
+++ b/site/src/main/jekyll/_includes/documentation-tree.html
@@ -0,0 +1,64 @@
+<div class="well" id="doc-tree">
+  <ul>
+    <li>
+      <label class="tree-toggler tree">Introduction</label>
+      <ul class = "tree">
+        <li><a href="/introduction/what-is-kamon/">What is Kamon?</a></li>
+        <li><a href="/introduction/get-started/">Get Started</a></li>
+      </ul>
+    </li>
+    <li class="divider"></li>
+
+    <li>
+      <label class="tree-toggler tree">Core Components</label>
+      <ul class = "tree">
+        <li>
+          <label class="tree-toggler tree">Metrics</label>
+          <ul class="tree">
+            <li><a href="/core/metrics/basics/">Basics</a></li>
+            <li><a href="/core/metrics/instruments/">Instruments</a></li>
+            <li><a href="/core/metrics/user-metrics/">User Metrics</a></li>
+            <li><a href="/core/metrics/subscription-protocol/">Subscription Protocol</a></li>
+          </ul>
+        </li>
+        <li><label class="tree-toggler tree">Tracing</label>
+          <ul class="">
+            <li><a href="/core/tracing/basics/">Basics</a></li>
+            <li><a href="/core/tracing/logging/">Logging</a></li>
+            <li><a href="/core/tracing/propagation/">Propagation</a></li>
+          </ul>
+        </li>
+      </ul>
+    </li>
+    <li class="divider"></li>
+
+    <li>
+      <label class="tree-toggler tree">Integrations</label>
+      <ul class = "tree">
+        <li>
+          <label class="tree-toggler tree">Spray</label>
+          <ul class="tree">
+            <li><a href="/integrations/spray/server-side/">Server Side</a></li>
+            <li><a href="/integrations/spray/client-side/">Client Side</a></li>
+          </ul>
+        </li>
+        <li><label class="tree-toggler">Play</label>
+          <ul class="">
+            <li><a href="/integrations/play/applications/">Play Applications</a></li>
+            <li><a href="/integrations/play/ws-library/">WS Client Library</a></li>
+          </ul>
+        </li>
+      </ul>
+    </li>
+    <li class="divider"></li>
+
+    <li>
+      <label class="tree-toggler tree">Backends</label>
+      <ul class="tree">
+        <li><a href="/backends/statsd/">StatsD</a></li>
+        <li><a href="/backends/newrelic/">New Relic</a></li>
+        <li><a href="/backends/datadog/">Datadog</a></li>
+      </ul>
+    </li>
+  </ul>
+</div>
\ No newline at end of file
diff --git a/site/src/main/jekyll/_includes/navigation-bar.html b/site/src/main/jekyll/_includes/navigation-bar.html
index a2ffb41e..cdc2a2d6 100644
--- a/site/src/main/jekyll/_includes/navigation-bar.html
+++ b/site/src/main/jekyll/_includes/navigation-bar.html
@@ -1,51 +1,73 @@
 <div class="navbar navbar-default navbar-fixed-top" role="navigation">
-    <div class="container">
-        <!-- Brand and toggle get grouped for better mobile display -->
-        <div class="navbar-header">
-            <button type="button" class="navbar-toggle" data-toggle="collapse"
-                    data-target="#bs-example-navbar-collapse-1">
-                <span class="sr-only">Toggle navigation</span>
-                <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
-                <span class="icon-bar"></span>
-            </button>
-            <a class="navbar-brand kamon-title" href="/"><img src="/assets/img/kamon-verde-120x120.png" width="25"
-                                                              height="25"/> <strong>Kamon</strong></a>
-        </div>
+  <div class="container">
+    <!-- Brand and toggle get grouped for better mobile display -->
+    <div class="navbar-header">
+      <button type="button" class="navbar-toggle" data-toggle="collapse"
+              data-target="#bs-example-navbar-collapse-1">
+        <span class="sr-only">Toggle navigation</span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+        <span class="icon-bar"></span>
+      </button>
+      <a class="navbar-brand kamon-title" href="/"><img src="/assets/img/kamon-verde-120x120.png" width="25"
+                                                        height="25"/> <strong>Kamon</strong></a>
+    </div>
+
+    <!-- Collect the nav links, forms, and other content for toggling -->
+    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+      <ul class="nav navbar-nav">
+        <li class="dropdown">
+          <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="modules">Documentation <span class="caret"></span></a>
+          <ul class="dropdown-menu multi-level" role="menu" aria-labelledby="dropdownMenu">
+            <li><a tabindex="-1" href="/introduction/what-is-kamon/"> What is Kamon?</a></li>
+            <li><a tabindex="-1" href="/introduction/get-started/"> Get Started</a></li>
+            <li class="divider"></li>
+            <li class="dropdown-submenu">
+              <a tabindex="-1" href="#">Core Concepts</a>
+              <ul class="dropdown-menu">
+                <li><a tabindex="-1" href="/core/metrics/basics/"> Metrics</a></li>
+                <li><a tabindex="-1" href="/core/metrics/tracing/"> Tracing</a></li>
+              </ul>
+            </li>
+            <li class="dropdown-submenu">
+              <a tabindex="-1" href="#">Integrations</a>
+              <ul class="dropdown-menu">
+                <li><a tabindex="-1" href="/integrations/spray/"><i class="fa fa-gears"></i> Spray</a></li>
+                <li><a tabindex="-1" href="/integrations/play/"><i class="fa fa-gears"></i> Play!</a></li>
+              </ul>
+            </li>
+            <li class="dropdown-submenu">
+              <a tabindex="-1" href="#">Backends</a>
+              <ul class="dropdown-menu">
+                <li><a tabindex="-1" href="/backends/statsd"><i class="fa fa-tasks"></i> StatsD</a></li>
+                <li><a tabindex="-1" href="/backends/datadog"><i class="glyphicon-dog"></i> Datadog</a></li>
+                <li><a tabindex="-1" href="/backends/newrelic"><i class="fa fa-bar-chart-o"></i> New Relic</a></li>
+              </ul>
+            </li>
+          </ul>
+        </li>
+      </ul>
+
 
-        <!-- Collect the nav links, forms, and other content for toggling -->
-        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
-            <ul class="nav navbar-nav">
-                <li class="dropdown">
-                    <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="modules">Modules <span
-                            class="caret"></span></a>
-                    <ul class="dropdown-menu" aria-labelledby="download">
-                        <li><a tabindex="-1" href="/spray"><i class="fa fa-gears"></i> Spray</a></li>
-                        <li><a tabindex="-1" href="/statsd"><i class="fa fa-tasks"></i> StatsD</a></li>
-                        <li><a tabindex="-1" href="/datadog"><i class="glyphicon-dog"></i> Datadog</a></li>
-                        <li><a tabindex="-1" href="/newrelic"><i class="fa fa-bar-chart-o"></i> New Relic</a></li>
-                    </ul>
-                </li>
-            </ul>
-            <ul class="nav navbar-nav navbar-right">
-                <li class="dropdown">
-                    <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="contact">Contact <span class="caret"></span></a>
-                    <ul class="dropdown-menu" aria-labelledby="download">
-                        <li><a tabindex="-1" href="https://twitter.com/kamonteam"><i class="fa fa-twitter"></i> Twitter</a></li>
-                        <li><a tabindex="-1" href="https://groups.google.com/forum/#!forum/kamon-user"><i class="fa fa-google-plus"></i> Mailing List</a></li>
-                    </ul>
-                </li>
-                <li class="dropdown">
-                    <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="project-info">Project Info <span class="caret"></span></a>
-                    <ul class="dropdown-menu" aria-labelledby="download">
-                        <li><a tabindex="-1" href="/acknowledgments/"><i class="fa fa-thumbs-up"></i> Acknowledgments</a></li>
-                        <li><a tabindex="-1" href="/changelog/"><i class="fa fa-code-fork"></i> Changelog</a></li>
-                        <li><a tabindex="-1" href="/license/"><i class="fa fa-info-circle"></i> License</a></li>
-                    </ul>
-                </li>
-                <li><a href="/teamblog/">Team Blog</a></li>
-            </ul>
-        </div>
-        <!-- /.navbar-collapse -->
+      <ul class="nav navbar-nav navbar-right">
+        <li class="dropdown">
+          <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="contact">Contact <span
+              class="caret"></span></a>
+          <ul class="dropdown-menu" aria-labelledby="download">
+            <li><a tabindex="-1" href="https://twitter.com/kamonteam"><i class="fa fa-twitter"></i> Twitter</a></li>
+            <li><a tabindex="-1" href="https://groups.google.com/forum/#!forum/kamon-user"><i class="fa fa-google-plus"></i> Mailing List</a></li>
+          </ul>
+        </li>
+        <li class="dropdown">
+          <a class="dropdown-toggle" data-toggle="dropdown" href="#" id="project-info">Project Info <span class="caret"></span></a>
+          <ul class="dropdown-menu" aria-labelledby="download">
+            <li><a tabindex="-1" href="/project-info/acknowledgments/"><i class="fa fa-thumbs-up"></i> Acknowledgments</a></li>
+            <li><a tabindex="-1" href="/project-info/changelog/"><i class="fa fa-code-fork"></i> Changelog</a></li>
+            <li><a tabindex="-1" href="/project-info/license/"><i class="fa fa-info-circle"></i> License</a></li>
+          </ul>
+        </li>
+        <li><a href="/teamblog/">Team Blog</a></li>
+      </ul>
     </div>
+  </div>
 </div>
diff --git a/site/src/main/jekyll/_layouts/documentation.html b/site/src/main/jekyll/_layouts/documentation.html
new file mode 100644
index 00000000..a958cb29
--- /dev/null
+++ b/site/src/main/jekyll/_layouts/documentation.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<!--
+  ~ =========================================================================================
+  ~ Copyright © 2013 the kamon project <http://kamon.io/>
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file
+  ~ except in compliance with the License. You may obtain a copy of the License at
+  ~
+  ~  http://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software distributed under the
+  ~ License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND,
+  ~ either express or implied. See the License for the specific language governing permissions
+  ~ and limitations under the License.
+  ~ =========================================================================================
+  -->
+
+<html lang="en">
+  <head>
+    <link href="https://plus.google.com/107736741680270898032?rel=author">
+    <title>{{ page.title }}</title>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="Kamon is a set of tools that will help you monitor your reactive applications">
+    
+    <link rel="stylesheet" href="/assets/css/bootstrap.min.css">
+    <link rel="stylesheet" href="/assets/css/syntax-highlight.css">
+    <link rel="stylesheet" href="/assets/css/font-awesome.min.css">
+    <link rel='stylesheet' href="/assets/css/glyphicons-free.css">
+    <link rel="stylesheet" href="/assets/css/kamon.css">
+
+  </head>
+  <body>
+    <div id="wrap">
+      {% include navigation-bar.html %}
+      <div class="container">
+        <div class="row">
+          <div class="col-sm-3">
+            {% include documentation-tree.html %}
+          </div>
+          <div class="col-sm-9">
+            {{ content }}
+          </div>
+        </div>
+      </div>
+      <hr>
+      <div id="push"></div>
+    </div>
+
+    <footer class="footer">
+      <div class="container">
+	<p class="muted credit text-center">Kamon is a open source project, go and check out the code at
+        <a href="http://github.com/kamon-io/Kamon"><img src="/assets/img/github-logo.png" id="github-logo" alt="GitHub"></a>
+        </p>
+      </div>
+    </footer>
+ 
+    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+    <script src="/assets/js/jquery.min.js"></script>
+    <!-- Include all compiled plugins (below), or include individual files as needed -->
+    <script src="/assets/js/bootstrap.min.js"></script>
+    <script src="/assets/js/kamon.js"></script>
+    {% include google-analytics.html %}
+
+  </body>
+</html>
diff --git a/site/src/main/jekyll/_posts/2014-03-17-kamon-meets-the-world.md b/site/src/main/jekyll/_posts/2014-03-17-kamon-meets-the-world.md
index e8d76651..68b315b3 100644
--- a/site/src/main/jekyll/_posts/2014-03-17-kamon-meets-the-world.md
+++ b/site/src/main/jekyll/_posts/2014-03-17-kamon-meets-the-world.md
@@ -27,5 +27,7 @@ to be happy with it, we hope now that you can try Kamon and let us know what you
 We are currently short on documentation, but feel free to ask anything you need through the mailing list! more docs are
 on the oven.
 
-So, what are you waiting for? go and learn about [tracing in Kamon](/core/tracing/) and [get started](/get-started/)
-right now!
+So, what are you waiting for? go and learn about [tracing in Kamon] and [get started] right now!
+
+[tracing in Kamon]: /core/tracing/basics/
+[get started]: /introduction/get-started/
\ No newline at end of file
diff --git a/site/src/main/jekyll/_posts/2014-04-24-kamon-for-akka-2-3-is-now-available.md b/site/src/main/jekyll/_posts/2014-04-24-kamon-for-akka-2-3-is-now-available.md
index 29911f92..08b8638a 100644
--- a/site/src/main/jekyll/_posts/2014-04-24-kamon-for-akka-2-3-is-now-available.md
+++ b/site/src/main/jekyll/_posts/2014-04-24-kamon-for-akka-2-3-is-now-available.md
@@ -15,5 +15,6 @@ our releases will come in pairs and aligned with the following Akka versions:
 * 0.2.x releases are compatible with Akka 2.2, Spray 1.2 and Play 2.2.
 
 The 0.3.0/0.2.0 releases contain exactly the same feature set as our 0.0.15 release, we just made the necessary changes
-to make it compatible with Akka 2.3. If you were waiting for this release, then go and [get started](/get-started) right
-away!
\ No newline at end of file
+to make it compatible with Akka 2.3. If you were waiting for this release, then go and [get started] right away!
+
+[get started]: /introduction/get-started/
\ No newline at end of file
diff --git a/site/src/main/jekyll/_posts/2014-04-27-get-started-quicker-with-our-docker-image.md b/site/src/main/jekyll/_posts/2014-04-27-get-started-quicker-with-our-docker-image.md
index f75628c6..853eb75a 100644
--- a/site/src/main/jekyll/_posts/2014-04-27-get-started-quicker-with-our-docker-image.md
+++ b/site/src/main/jekyll/_posts/2014-04-27-get-started-quicker-with-our-docker-image.md
@@ -8,7 +8,7 @@ tags: announcement
 
 We are very excited to see people adopting Kamon as their monitoring tool for reactive applications and, of course, we
 want to keep growing both in users base and features. According to our site metrics, the most visited section is the one
-describing our [StatsD module](/statsd/), that made us think, what can we do to make it easier for people to get started
+describing our [StatsD module], that made us think, what can we do to make it easier for people to get started
 with Kamon and StatsD?, well, that's an easy question to answer: build a package containing all the required
 infrastructure and plumping, and let the users just focus on what cares to them, their apps and their metrics. That's
 why today we are publishing a Docker image with all that you need to get started in a few minutes!
@@ -54,3 +54,6 @@ purpose of making your life easier. This should give you an idea of how the dash
 from one of our toy applications:
 
 <img class="img-responsive" src="/assets/img/kamon-statsd-grafana.png">
+
+
+[StatsD module]: /backends/statsd/
\ No newline at end of file
diff --git a/site/src/main/jekyll/assets/css/kamon.css b/site/src/main/jekyll/assets/css/kamon.css
index 7a5577da..cc0da027 100644
--- a/site/src/main/jekyll/assets/css/kamon.css
+++ b/site/src/main/jekyll/assets/css/kamon.css
@@ -73,4 +73,69 @@ img[alt=statsD] { width: 100%; }
     width: 700px ;
     margin-left: auto ;
     margin-right: auto ;
-}
\ No newline at end of file
+}
+
+
+#doc-tree ul {
+  list-style: none outside none;
+  margin-left: 0px;
+  padding-left: 6px;
+}
+
+.divider {
+  *width: 100%;
+  height: 1px;
+  margin: 9px 1px;
+  *margin: -5px 0 5px;
+  overflow: hidden;
+  background-color: #e5e5e5;
+  border-bottom:1px solid #e5e5e5;
+ }
+
+.dropdown-submenu {
+    position: relative;
+}
+
+.dropdown-submenu>.dropdown-menu {
+    top: 0;
+    left: 100%;
+    margin-top: -6px;
+    margin-left: -1px;
+    -webkit-border-radius: 0 6px 6px 6px;
+    -moz-border-radius: 0 6px 6px;
+    border-radius: 0 6px 6px 6px;
+}
+
+.dropdown-submenu:hover>.dropdown-menu {
+    display: block;
+}
+
+.dropdown-submenu>a:after {
+    display: block;
+    content: " ";
+    float: right;
+    width: 0;
+    height: 0;
+    border-color: transparent;
+    border-style: solid;
+    border-width: 5px 0 5px 5px;
+    border-left-color: #ccc;
+    margin-top: 5px;
+    margin-right: -10px;
+}
+
+.dropdown-submenu:hover>a:after {
+    border-left-color: #fff;
+}
+
+.dropdown-submenu.pull-left {
+    float: none;
+}
+
+.dropdown-submenu.pull-left>.dropdown-menu {
+    left: -100%;
+    margin-left: 10px;
+    -webkit-border-radius: 6px 0 6px 6px;
+    -moz-border-radius: 6px 0 6px 6px;
+    border-radius: 6px 0 6px 6px;
+}
diff --git a/site/src/main/jekyll/assets/js/kamon.js b/site/src/main/jekyll/assets/js/kamon.js
new file mode 100644
index 00000000..14a81e36
--- /dev/null
+++ b/site/src/main/jekyll/assets/js/kamon.js
@@ -0,0 +1,5 @@
+$(document).ready(function () {
+	$('label.tree-toggler').click(function () {
+		$(this).parent().children('ul.tree').toggle(300);
+	});
+});
\ No newline at end of file
diff --git a/site/src/main/jekyll/datadog/index.md b/site/src/main/jekyll/backends/datadog.md
index 0d840951..f14ec23e 100644
--- a/site/src/main/jekyll/datadog/index.md
+++ b/site/src/main/jekyll/backends/datadog.md
@@ -1,22 +1,21 @@
 ---
 title: Kamon | Datadog | Documentation
-layout: default
+layout: documentation
 ---
 
 Reporting Metrics to Datadog
 ===========================
 <hr>
 
-[Datadog](http://www.datadoghq.com/) Datadog is a monitoring service for IT, Operations and Development teams who write
-and run applications at scale, and want to turn the massive amounts of data produced by their apps,
-tools and services into actionable insight.
+[Datadog] is a monitoring service for IT, Operations and Development teams who write and run applications at scale, and
+want to turn the massive amounts of data produced by their apps, tools and services into actionable insight.
 
 Installation
 ------------
 
 To use the Datadog module just add the `kamon-datadog` dependency to your project and start your application using the
-Aspectj Weaver agent. Please refer to our [get started](/get-started) page for more info on how to add dependencies to
-your project and starting your application with the AspectJ Weaver.
+Aspectj Weaver agent. Please refer to our [get started] page for more info on how to add dependencies to your project
+and starting your application with the AspectJ Weaver.
 
 
 Configuration
@@ -83,3 +82,7 @@ Integration Notes
 Visualization and Fun
 ---------------------
 
+
+
+[Datadog]: http://www.datadoghq.com/
+[get started]: /introduction/get-started/
\ No newline at end of file
diff --git a/site/src/main/jekyll/dashboard/index.md b/site/src/main/jekyll/backends/kamon-dashboard.md
index 8a31899e..357bf904 100644
--- a/site/src/main/jekyll/dashboard/index.md
+++ b/site/src/main/jekyll/backends/kamon-dashboard.md
@@ -1,7 +1,6 @@
 ---
 title: kamon | Dashboard | Documentation
-layout: default
+layout: documentation
 ---
 Coming soon
---------
-
+-----------
\ No newline at end of file
diff --git a/site/src/main/jekyll/newrelic/index.md b/site/src/main/jekyll/backends/newrelic.md
index 38a87245..4ba14dd5 100644
--- a/site/src/main/jekyll/newrelic/index.md
+++ b/site/src/main/jekyll/backends/newrelic.md
@@ -1,6 +1,6 @@
 ---
 title: kamon | NewRelic Module | Documentation
-layout: default
+layout: documentation
 ---
 
 NewRelic Module
diff --git a/site/src/main/jekyll/statsd/index.md b/site/src/main/jekyll/backends/statsd.md
index ec818521..677552e5 100644
--- a/site/src/main/jekyll/statsd/index.md
+++ b/site/src/main/jekyll/backends/statsd.md
@@ -1,6 +1,6 @@
 ---
 title: Kamon | StatsD | Documentation
-layout: default
+layout: documentation
 ---
 
 Reporting Metrics to StatsD
diff --git a/site/src/main/jekyll/core/metrics.md b/site/src/main/jekyll/core/metrics/basics.md
index dcef8304..991ddf26 100644
--- a/site/src/main/jekyll/core/metrics.md
+++ b/site/src/main/jekyll/core/metrics/basics.md
@@ -1,6 +1,6 @@
 ---
 title: Kamon | Core | Documentation
-layout: default
+layout: documentation
 ---
 
 Metrics
diff --git a/site/src/main/jekyll/core/tracing.md b/site/src/main/jekyll/core/tracing/basics.md
index bf79bd47..c5df29a9 100644
--- a/site/src/main/jekyll/core/tracing.md
+++ b/site/src/main/jekyll/core/tracing/basics.md
@@ -1,6 +1,6 @@
 ---
 title: Kamon | Core | Documentation
-layout: default
+layout: documentation
 ---
 
 Traces
diff --git a/site/src/main/jekyll/core/logging.md b/site/src/main/jekyll/core/tracing/logging.md
index d8324f82..7d2251ef 100644
--- a/site/src/main/jekyll/core/logging.md
+++ b/site/src/main/jekyll/core/tracing/logging.md
@@ -1,6 +1,6 @@
 ---
 title: Kamon | Core | Documentation
-layout: default
+layout: documentation
 ---
 
 Logging
diff --git a/site/src/main/jekyll/index.html b/site/src/main/jekyll/index.html
index eba6146b..26730da8 100644
--- a/site/src/main/jekyll/index.html
+++ b/site/src/main/jekyll/index.html
@@ -13,7 +13,7 @@ title: Kamon - Tools for Reactive Applications Monitoring
                 <div class="col-sm-7">
                     <h1><strong>Kamon</strong></h1>
                     <p>Kamon is a set of tools that helps you to get metrics out of your reactive applications.</p>
-                    <p><a type="button" href="/get-started" class="btn btn-success">Get Started</a></p>
+                    <p><a type="button" href="/introduction/get-started" class="btn btn-success">Get Started</a></p>
                 </div>
             </div>
         </div>
@@ -35,12 +35,12 @@ title: Kamon - Tools for Reactive Applications Monitoring
             <li>Message processing times</li>
             <li>Time waiting in mailbox</li>
             <li>Mailbox sizes</li>
-            <li><a href="/core/tracing/">Message flow tracing</a></li>
+            <li><a href="/core/tracing/basics/">Message flow tracing</a></li>
             <li>Dispatchers health <span class="label label-info">soon</span></li>
           </ul>
       </p>
 
-      <p><a class="btn btn-default btn-sm" href="/akka" role="button">Tell me more &raquo;</a></p>
+      <p><a class="btn btn-default btn-sm" href="/integrations/akka" role="button">Tell me more &raquo;</a></p>
     </div>
 
     <div class="col-sm-4">
@@ -53,7 +53,7 @@ title: Kamon - Tools for Reactive Applications Monitoring
         </ul>
       </p>
 
-      <p><a class="btn btn-default btn-sm" href="/spray" role="button">Tell me more &raquo;</a></p>
+      <p><a class="btn btn-default btn-sm" href="/integrations/spray/server-side/" role="button">Tell me more &raquo;</a></p>
     </div>
 
     <div class="col-sm-4">
@@ -67,7 +67,7 @@ title: Kamon - Tools for Reactive Applications Monitoring
         </ul>
       </p>
 
-      <p><a class="btn btn-default btn-sm" href="/statsd/" role="button">Tell me more &raquo;</a></p>
+      <p><a class="btn btn-default btn-sm" href="/backends/statsd/" role="button">Tell me more &raquo;</a></p>
     </div>
   </div>
 </div>
diff --git a/site/src/main/jekyll/akka/index.md b/site/src/main/jekyll/integrations/akka/index.md
index dca297ad..6ca89409 100644
--- a/site/src/main/jekyll/akka/index.md
+++ b/site/src/main/jekyll/integrations/akka/index.md
@@ -1,6 +1,6 @@
 ---
 title: kamon | Akka Toolkit | Documentation
-layout: default
+layout: documentation
 ---
 
 Akka Module
diff --git a/site/src/main/jekyll/integrations/play/applications.md b/site/src/main/jekyll/integrations/play/applications.md
new file mode 100644
index 00000000..97918dc5
--- /dev/null
+++ b/site/src/main/jekyll/integrations/play/applications.md
@@ -0,0 +1,4 @@
+---
+title: kamon | Play | Documentation
+layout: documentation
+---
\ No newline at end of file
diff --git a/site/src/main/jekyll/integrations/play/ws-library.md b/site/src/main/jekyll/integrations/play/ws-library.md
new file mode 100644
index 00000000..97918dc5
--- /dev/null
+++ b/site/src/main/jekyll/integrations/play/ws-library.md
@@ -0,0 +1,4 @@
+---
+title: kamon | Play | Documentation
+layout: documentation
+---
\ No newline at end of file
diff --git a/site/src/main/jekyll/spray/index.md b/site/src/main/jekyll/integrations/spray/client-side.md
index f62072f0..15b41c72 100644
--- a/site/src/main/jekyll/spray/index.md
+++ b/site/src/main/jekyll/integrations/spray/client-side.md
@@ -1,6 +1,6 @@
 ---
 title: kamon | Spray | Documentation
-layout: default
+layout: documentation
 ---
 
 Spray Module(TODO)
diff --git a/site/src/main/jekyll/integrations/spray/server-side.md b/site/src/main/jekyll/integrations/spray/server-side.md
new file mode 100644
index 00000000..15b41c72
--- /dev/null
+++ b/site/src/main/jekyll/integrations/spray/server-side.md
@@ -0,0 +1,8 @@
+---
+title: kamon | Spray | Documentation
+layout: documentation
+---
+
+Spray Module(TODO)
+===
+
diff --git a/site/src/main/jekyll/get-started.md b/site/src/main/jekyll/introduction/get-started.md
index 07c59654..84c53314 100644
--- a/site/src/main/jekyll/get-started.md
+++ b/site/src/main/jekyll/introduction/get-started.md
@@ -1,6 +1,6 @@
 ---
 title: Kamon | Get Started
-layout: default
+layout: documentation
 ---
 
 Get Started with Kamon
@@ -47,12 +47,20 @@ the weaver's file location and you are done:
 ```
 
 In case you want to keep the AspectJ related settings in your build and enjoy using `run` from the console, take a look
-at the [sbt-aspectj](https://github.com/sbt/sbt-aspectj/) plugin.
+at the [sbt-aspectj] plugin.
 
 
 Third: Enjoy!
 -------------
 
-Refer to module's documentation to find out more about core concepts like [tracing](/core/tracing/),
-[metrics](/core/metrics/) and [logging](/core/logging/), and learn how to report your metrics data to external services
-like [StatsD](/statsd/) and [New Relic](/newrelic/).
+Refer to module's documentation to find out more about core concepts like [tracing], [metrics] and [logging], and learn
+how to report your metrics data to external services like [StatsD], [Datadog] and [New Relic].
+
+
+[sbt-aspectj]: https://github.com/sbt/sbt-aspectj/
+[tracing]: /core/tracing/basics/
+[metrics]: /core/metrics/basics/
+[logging]: /core/tracing/logging/
+[StatsD]: /backends/statsd/
+[Datadog]: /backends/datadog/
+[New Relic]: /backends/newrelic/
\ No newline at end of file
diff --git a/site/src/main/jekyll/introduction/what-is-kamon.md b/site/src/main/jekyll/introduction/what-is-kamon.md
new file mode 100644
index 00000000..3bc3ae8e
--- /dev/null
+++ b/site/src/main/jekyll/introduction/what-is-kamon.md
@@ -0,0 +1,6 @@
+---
+title: Kamon | Get Started
+layout: documentation
+---
+
+Intro on what is Kamon.
\ No newline at end of file
diff --git a/site/src/main/jekyll/acknowledgments.md b/site/src/main/jekyll/project-info/acknowledgments.md
index f75f4e24..f75f4e24 100644
--- a/site/src/main/jekyll/acknowledgments.md
+++ b/site/src/main/jekyll/project-info/acknowledgments.md
diff --git a/site/src/main/jekyll/changelog.md b/site/src/main/jekyll/project-info/changelog.md
index 5c0ee4ff..5c0ee4ff 100644
--- a/site/src/main/jekyll/changelog.md
+++ b/site/src/main/jekyll/project-info/changelog.md
diff --git a/site/src/main/jekyll/license.md b/site/src/main/jekyll/project-info/license.md
index 8bbc65b1..8bbc65b1 100644
--- a/site/src/main/jekyll/license.md
+++ b/site/src/main/jekyll/project-info/license.md