diff --git a/lib/gollum/frontend/app.rb b/lib/gollum/frontend/app.rb
index 94352f49..84c6c515 100644
--- a/lib/gollum/frontend/app.rb
+++ b/lib/gollum/frontend/app.rb
@@ -6,6 +6,8 @@ require 'mustache/sinatra'
 require 'gollum/frontend/views/layout'
 require 'gollum/frontend/views/editable'
 
+require 'extensions/toc'
+
 module Precious
   class App < Sinatra::Base
     register Mustache::Sinatra
@@ -108,10 +110,20 @@ module Precious
     end
 
     post '/preview' do
-      wiki      = Gollum::Wiki.new(settings.gollum_path, settings.wiki_options)
-      @name     = "Preview"
-      @page     = wiki.preview_page(@name, params[:content], params[:format])
-      @content  = @page.formatted_data
+      wiki     = Gollum::Wiki.new(settings.gollum_path, settings.wiki_options)
+      @name    = "Preview"
+      @page    = wiki.preview_page(@name, params[:content], params[:format])
+      @content = @page.formatted_data do
+        |doc|
+        # Insert anchors for table of contents
+        toc = Gollum::Extensions::Toc_gen.new doc
+        if (toc_content = toc.generate)
+             toc.insert_anchors 
+             @toc_content = toc_content.to_xhtml(:save_with => Nokogiri::XML::Node::SaveOptions::AS_XHTML)
+           else
+             @toc_content = nil
+           end
+      end
       @editable = false
       mustache :page
     end
@@ -195,8 +207,18 @@ module Precious
       if page = wiki.page(name)
         @page = page
         @name = name
-        @content = page.formatted_data
         @editable = true
+        @content = page.formatted_data do
+          |doc|
+           # Insert anchors for table of contents
+           toc = Gollum::Extensions::Toc_gen.new doc
+           if (toc_content = toc.generate)
+             toc.insert_anchors 
+             @toc_content = toc_content.to_xhtml(:save_with => Nokogiri::XML::Node::SaveOptions::AS_XHTML)
+           else
+             @toc_content = nil
+           end
+        end
         mustache :page
       elsif file = wiki.file(name)
         content_type file.mime_type
diff --git a/lib/gollum/frontend/public/gollum/css/gollum.css b/lib/gollum/frontend/public/gollum/css/gollum.css
index e8847dcb..5419d141 100755
--- a/lib/gollum/frontend/public/gollum/css/gollum.css
+++ b/lib/gollum/frontend/public/gollum/css/gollum.css
@@ -71,6 +71,7 @@ a:hover, a:visited {
 #wiki-body {
   display: block;
   float: left;
+  clear: left;
   margin-right: 3%;
   margin-bottom: 40px;
   width: 100%;
@@ -80,6 +81,42 @@ a:hover, a:visited {
   width: 68%;
 }
 
+/* @section toc */
+#wiki-toc-main {
+  background-color: #F7F7F7;
+  border: 1px solid #DDD;
+  font-size: 13px;
+  padding: 7px;
+  float:left;
+  margin-bottom: 20px;
+  
+  border-radius: 0.5em;
+  -moz-border-radius: 0.5em;
+  -webkit-border-radius: 0.5em;
+}
+
+#wiki-toc-main > h2 {
+  font-size: 24px;
+  border-bottom: 1px solid #CCC;
+  color: black;
+  margin-top: 5px;
+  margin-bottom: 20px;
+}
+
+#wiki-toc-main ul {
+  -webkit-margin-before: 0px;
+  -webkit-padding-start: 0px;
+  margin-left: 1em;
+  margin-right: 1em;
+  padding-left: 0;
+}
+
+#wiki-toc-main ul li {
+  line-height: 1.75em;
+  list-style-position: inside;
+  list-style-type: round;
+}
+
 /* @section rightbar */
 #wiki-rightbar {
   background-color: #f7f7f7;
@@ -141,6 +178,7 @@ a:hover, a:visited {
 #wiki-header #header-content {
   margin-bottom: 1.5em;
 }
+
 #wiki-footer #footer-content {
   margin-top: 1.5em;
 }
diff --git a/lib/gollum/frontend/templates/page.mustache b/lib/gollum/frontend/templates/page.mustache
index d60ae5d6..f43969db 100644
--- a/lib/gollum/frontend/templates/page.mustache
+++ b/lib/gollum/frontend/templates/page.mustache
@@ -18,7 +18,20 @@
   </ul>
 </div>
 <div id="wiki-content">
-<div class="wrap {{#has_footer}} has-footer {{/has_footer}} {{#has_sidebar}}  has-rightbar{{/has_sidebar}}">
+<div class="wrap{{#has_footer}} has-footer{{/has_footer}}{{#has_sidebar}} has-rightbar{{/has_sidebar}}{{#has_toc}} has-toc{{/has_toc}}">
+  {{#has_toc}}
+  <div id="wiki-toc-main" class="gollum-{{sidebar_format}}-content">
+    <h2>Table of contents</h2>
+    {{{toc_content}}}
+  </div>
+  {{/has_toc}}
+  {{#has_sidebar}}
+  <div id="wiki-rightbar" class="gollum-{{sidebar_format}}-content">
+    <div id="sidebar-content" class="markdown-body">
+      {{{sidebar_content}}}
+    </div>
+  </div>
+  {{/has_sidebar}}
   <div id="wiki-body" class="gollum-{{format}}-content">
     {{#has_header}}
     <div id="wiki-header" class="gollum-{{header_format}}-content">
@@ -31,13 +44,6 @@
       {{{content}}}
     </div>
   </div>
-  {{#has_sidebar}}
-  <div id="wiki-rightbar" class="gollum-{{sidebar_format}}-content">
-    <div id="sidebar-content" class="markdown-body">
-      {{{sidebar_content}}}
-    </div>
-  </div>
-  {{/has_sidebar}}
   {{#has_footer}}
   <div id="wiki-footer" class="gollum-{{footer_format}}-content">
     <div id="footer-content" class="markdown-body">
diff --git a/lib/gollum/frontend/views/page.rb b/lib/gollum/frontend/views/page.rb
index 2fe2ab0f..953cdb10 100644
--- a/lib/gollum/frontend/views/page.rb
+++ b/lib/gollum/frontend/views/page.rb
@@ -65,6 +65,12 @@ module Precious
       def sidebar_format
         has_sidebar && @sidebar.format.to_s
       end
+      def has_toc
+        !@toc_content.nil?
+      end
+      def toc_content
+        @toc_content
+      end
     end
   end
 end