diff --git a/pygameweb/templates/wiki/view.html b/pygameweb/templates/wiki/view.html
index a717792..9a43748 100644
--- a/pygameweb/templates/wiki/view.html
+++ b/pygameweb/templates/wiki/view.html
@@ -9,121 +9,86 @@
   {% cache 60*5, 'wiki_content', link %}
   {% set wiki = wiki_for(link) %}
   {% set content_rendered, toc_rendered = wiki.content_toc %}
-  {% if toc_rendered %}
+
     <div class="row">
       <div class="col-sm-3 wiki-toc-nav">
-        {{ toc_rendered | safe }}
+        <div id="toc-sidebar">
+          {% if toc_rendered %}
+            {{ toc_rendered | safe }}
+          {% endif %}
+
+          <nav class="wiki-nav">
+            <p>Wiki tools</p>
+            <a class="btn btn-default" href="{{ url_for('wiki.edit', link=link) }}" role="button">Edit</a>
+            <a class="btn btn-default" href="{{ url_for('wiki.source', link=link) }}" role="button">Source</a>
+            <a class="btn btn-default" href="{{ url_for('wiki.history', link=link) }}" role="button">History</a>
+            {#- <a class="btn btn-default" href="#" role="button">Links</a> -#}
+            {#- <a class="btn btn-default" href="#" role="button">Wiki Map</a> -#}
+            <a class="btn btn-default" href="{{ url_for('wiki.recent') }}" role="button">Recent Changes</a>
+          </nav>
+        </div>
       </div>
       <div class="col-sm-9">
-  {% endif %}
-
         <h1>{{ wiki.title }} &mdash; <a href="/wiki">wiki</a></h1>
-
-        <nav>
-          <a class="btn btn-default" href="{{ url_for('wiki.edit', link=link) }}" role="button">Edit</a>
-          <a class="btn btn-default" href="{{ url_for('wiki.source', link=link) }}" role="button">Source</a>
-          <a class="btn btn-default" href="{{ url_for('wiki.history', link=link) }}" role="button">History</a>
-          {#- <a class="btn btn-default" href="#" role="button">Links</a> -#}
-          {#- <a class="btn btn-default" href="#" role="button">Wiki Map</a> -#}
-          <a class="btn btn-default" href="{{ url_for('wiki.recent') }}" role="button">Recent Changes</a>
-        </nav>
-
         <div class="wiki-content">
           {{ content_rendered | safe }}
         </div>
-
-  {% if toc_rendered %}
       </div>
     </div>
-  {% endif %}
-
   {% endcache %}
 {% endblock %}
 
 
-{#
-  Use a nicer side bar table of contents navigation component.
-  https://afeld.github.io/bootstrap-toc/
-#}
-
-
-
 {% block body_attribs %}{{ super() }}{% endblock body_attribs %}
 
 {%- block styles %}
   {{ super() }}
   <style>
-    .wiki-toc-nav .nav {
-      max-width: 170px;
-    }
+    #toc-sidebar {max-width: 170px;}
+    .header_link {visibility:hidden; padding-left:5px;}
+    .wiki-heading:hover .header_link {visibility: visible;}
     @media(max-width:768px){
-      .wiki-toc-nav .nav {
+      #toc-sidebar {
         max-width: inherit;
       }
     }
-    @media(min-width:1200px){
-      .wiki-toc-nav .nav {
-        max-width: 250px;
+    @media(min-width:780px){
+      #toc-sidebar {
+        position: fixed;
+        left: 20px;
       }
     }
+    .wiki-nav {
+      border: 1px solid #ddd;
+      border-radius: 4px;
+      margin-top: 20px;
+      padding: 10px 15px;
+    }
+
     .wiki-toc-nav .nav>li>a{
-      display:block;padding:4px 20px;font-size:13px;font-weight:500;color:#767676
+      display:block;padding:4px 4px;font-size:13px;font-weight:500;color:#767676
     }
     .wiki-toc-nav .nav>li>a:focus,.wiki-toc-nav .nav>li>a:hover{
-      padding-left:19px;color:#563d7c;text-decoration:none;background-color:transparent;border-left:1px solid #563d7c
+      padding-left:3px;color:#563d7c;text-decoration:none;background-color:transparent;border-left:1px solid #563d7c
     }
     .wiki-toc-nav .nav>.active:focus>a,.wiki-toc-nav .nav>.active:hover>a,.wiki-toc-nav .nav>.active>a{
-      padding-left:18px;font-weight:700;color:#563d7c;background-color:transparent;border-left:2px solid #563d7c
+      padding-left:2px;font-weight:700;color:#563d7c;background-color:transparent;border-left:2px solid #563d7c
     }
     .wiki-toc-nav .nav .nav{
       padding-bottom:10px
     }
     .wiki-toc-nav .nav .nav>li>a{
-      padding-top:1px;padding-bottom:1px;padding-left:30px;font-size:12px;font-weight:400
+      padding-top:1px;padding-bottom:1px;padding-left:14px;font-size:12px;font-weight:400
     }
     .wiki-toc-nav .nav .nav>li>a:focus,.wiki-toc-nav .nav .nav>li>a:hover{
-      padding-left:29px
+      padding-left:13px
     }
     .wiki-toc-nav .nav .nav>.active:focus>a,.wiki-toc-nav .nav .nav>.active:hover>a,.wiki-toc-nav .nav .nav>.active>a{
-      padding-left:28px;font-weight:500
+      padding-left:12px;font-weight:500
     }
     .wiki-toc-nav .nav>.active>ul{
       display:block
     }
   </style>
 
-{% endblock %}
-{%- block scripts %}
-  {{ super() }}
-  <script>
-/*
- * jQuery throttle / debounce - v1.1 - 3/7/2010
- * http://benalman.com/projects/jquery-throttle-debounce-plugin/
- *
- * Copyright (c) 2010 "Cowboy" Ben Alman
- * Dual licensed under the MIT and GPL licenses.
- * http://benalman.com/about/license/
- */
-(function(b,c){var $=b.jQuery||b.Cowboy||(b.Cowboy={}),a;$.throttle=a=function(e,f,j,i){var h,d=0;if(typeof f!=="boolean"){i=j;j=f;f=c}function g(){var o=this,m=+new Date()-d,n=arguments;function l(){d=+new Date();j.apply(o,n)}function k(){h=c}if(i&&!h){l()}h&&clearTimeout(h);if(i===c&&m>e){l()}else{if(f!==true){h=setTimeout(i?k:l,i===c?e-m:e)}}}if($.guid){g.guid=j.guid=j.guid||$.guid++}return g};$.debounce=function(d,e,f){return f===c?a(d,e,false):a(d,f,e!==false)}})(this);
-
-    $(function() {
-      var $toc = $('#toc'),
-        tooThin = $(window).width() < 769,
-        limit = $toc.offset().top,
-        $window = $(window),
-        shouldAffix = function () {
-          var scrollTop = $window.scrollTop();
-          if (!tooThin && scrollTop >= limit) {
-            $toc.addClass('affix');
-          } else {
-            $toc.removeClass('affix');
-          }
-        };
-      $(window).scroll($.throttle(150, shouldAffix));
-      $(window).resize($.throttle(150, function() {
-        tooThin = $window.width() < 769;
-        shouldAffix();
-      }));
-    });
-  </script>
 {% endblock %}
\ No newline at end of file
diff --git a/pygameweb/wiki/wiki.py b/pygameweb/wiki/wiki.py
index e402dd4..82a35e4 100644
--- a/pygameweb/wiki/wiki.py
+++ b/pygameweb/wiki/wiki.py
@@ -169,12 +169,20 @@ def table_of_contents(pq_content):
     # for i, heading in enumerate(pq_content.find('h1,h2,h3,h4')):
     for i, heading in enumerate(pq_content.find('h1,h2,h3,h4')):
         title = pq(heading).text()
-        pq(heading).attr('id', title)
+        header_link = (pq('<a title="Permalink to this definition">¶</a>')
+            .addClass('header_link')
+            .attr('href', '#' + title)
+        )
+        (pq(heading)
+            .attr('id', title)
+            .addClass('wiki-heading')
+            .append(header_link))
+
         link = (pq('<a></a>')
-                .text(title)
-                .attr('href', '#' + title)
-                .addClass('li' + heading.tag)
-                .wrap('<li>'))
+            .text(title)
+            .attr('href', '#' + title)
+            .addClass('li' + heading.tag)
+            .wrap('<li>'))
 
         if heading.tag in ['h1', 'h2']:
             previous_heading = heading
diff --git a/tests/unit/pygameweb/wiki/test_wiki.py b/tests/unit/pygameweb/wiki/test_wiki.py
index 201354d..5a5a26f 100644
--- a/tests/unit/pygameweb/wiki/test_wiki.py
+++ b/tests/unit/pygameweb/wiki/test_wiki.py
@@ -110,8 +110,8 @@ def test_wiki_section():
 
     """
     res = _wiki_section(content).outerHtml()
-    assert '<h1 id="Hello there matey">' in res, 'because headers should have an id'
-    assert '<h2 id="Another section, another day">' in res
+    assert '<h1 id="Hello there matey"' in res, 'because headers should have an id'
+    assert '<h2 id="Another section, another day"' in res
 
 
 def test_wiki_section_h3():
@@ -131,5 +131,5 @@ def test_wiki_section_h3():
     <h3>And finally the last one</h3>
     """
     res = _wiki_section(content).outerHtml()
-    assert '<h3 id="Hello there matey">' in res, 'because headers should have an id'
-    assert '<h3 id="Another section, another day">' in res
+    assert '<h3 id="Hello there matey"' in res, 'because headers should have an id'
+    assert '<h3 id="Another section, another day"' in res