diff --git a/wagtail/wagtailadmin/static/wagtailadmin/js/edit_bird.js b/wagtail/wagtailadmin/static/wagtailadmin/js/edit_bird.js
new file mode 100644
index 000000000..afc06b24a
--- /dev/null
+++ b/wagtail/wagtailadmin/static/wagtailadmin/js/edit_bird.js
@@ -0,0 +1,11 @@
+/* No jQuery to speed up loading */
+document.addEventListener('DOMContentLoaded', function(){
+    var body = document.querySelectorAll('body')[0];
+    var className = 'ready';
+
+    if (body.classList){
+        body.classList.add(className);
+    }else{
+        body.className += ' ' + className;
+    }
+});
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/static/wagtailadmin/scss/mixins.scss b/wagtail/wagtailadmin/static/wagtailadmin/scss/mixins.scss
index c990eb43c..48a577483 100644
--- a/wagtail/wagtailadmin/static/wagtailadmin/scss/mixins.scss
+++ b/wagtail/wagtailadmin/static/wagtailadmin/scss/mixins.scss
@@ -1,8 +1,8 @@
 @mixin clearfix() {
     &:before,
     &:after {
-        content: " "; /* 1 */
-        display: table; /* 2 */
+        content: " ";
+        display: table;
     }
     &:after {
         clear: both;
@@ -24,16 +24,16 @@
 @mixin transition($transition...){
     body.ready &{
         -webkit-transition: $transition;
-        -moz-transition: $transition;
-        -o-transition: $transition;
-        transition: $transition;
+           -moz-transition: $transition;
+             -o-transition: $transition;
+                transition: $transition;
     }
 }
 @mixin transition-immediate($transition...){
     -webkit-transition: $transition;
-    -moz-transition: $transition;
-    -o-transition: $transition;
-    transition: $transition;
+       -moz-transition: $transition;
+         -o-transition: $transition;
+            transition: $transition;
 }
 
 @mixin transition-transform($transition...) {
@@ -43,22 +43,31 @@
           transition: transform $transition;
 }
 
+@mixin transition-delay($delay...){
+    body.ready &{
+        -webkit-transition-delay: $delay;
+           -moz-transition-delay: $delay;
+             -o-transition-delay: $delay;
+                transition-delay: $delay;
+    }
+}
+
 @mixin notransition() {
     -webkit-transition: none !important;
-    -moz-transition: none !important;
-    -o-transition: none !important;
-    -ms-transition: none !important;
-    transition: none !important;
+       -moz-transition: none !important;
+         -o-transition: none !important;
+        -ms-transition: none !important;
+            transition: none !important;
 }
 
 @mixin border-radius($radius){
     -webkit-border-radius: $radius;
-    border-radius: $radius;
+            border-radius: $radius;
 }
 
 @mixin box-shadow($shadow){  
     -webkit-box-shadow: $shadow; //e.g inset 2px 2px 3px 2px rgba(0, 0, 0, 1)
-    box-shadow: $shadow;
+            box-shadow: $shadow;
 }
 
 @mixin visuallyhidden{
diff --git a/wagtail/wagtailadmin/static/wagtailadmin/scss/userbar.scss b/wagtail/wagtailadmin/static/wagtailadmin/scss/userbar.scss
new file mode 100644
index 000000000..759026744
--- /dev/null
+++ b/wagtail/wagtailadmin/static/wagtailadmin/scss/userbar.scss
@@ -0,0 +1,129 @@
+@import "variables.scss";
+@import "mixins.scss";
+
+@import "components/icons.scss";
+
+html, body{
+    background-color:transparent;
+}
+body{
+    -webkit-font-smoothing: antialiased; /* Do not remove! */
+    font-family:Open Sans,Arial,sans-serif;
+    font-size:80%;
+}
+
+nav{
+    padding:0 0 3em 3em;
+    float:right;
+
+    /* moving menu only for browser that can support hover and transitions */
+    /*.no-touch.csstransitions & {
+        ul{
+            height:0;
+        }
+        li{
+            left:50px;
+        }
+
+        &:hover{
+            ul{
+                height:300px;
+            }
+            li{
+                left:0;
+            }
+        }
+    }*/
+}
+
+.home{
+    float:right;
+    width:1.5em;
+    margin-bottom:1px;
+    background-color:white;
+    color:$color-text-base;
+
+    &.icon:before{
+        @include transition(color 0.2s ease);
+        margin:-0.1em 0 0 -0.2em;
+        font-size:35px;
+    }
+
+    &:hover:before{
+        color:black;
+    }
+}
+
+ul{
+    @include transition(height 0.2s ease);
+    @include unlist();
+    overflow:hidden;
+    clear:both;
+}
+
+li{
+    @include transition(left 0.2s ease, width 0.1s ease);
+    float:right;
+    clear:both;
+    width:3.5em;
+    overflow:hidden;
+    position:relative;
+    padding-bottom:1px;
+
+    &:hover{
+        width:10em;
+    }
+}
+
+.action{
+    @include transition(background-color 0.2s ease, color 0.2s ease);
+    background-color:$color-teal;
+    color:white;
+
+    &:before{
+        margin-right:0.3em;
+        vertical-align:middle;
+    }
+
+    &:hover{
+        background-color:$color-teal-dark;
+        color:white;
+    }
+}
+
+/* actions which can be accomplished just with a link tag */
+a.action, a{
+    display:block;
+    width:10em;
+    height:1.5em;
+    text-align:left;
+    overflow:hidden;
+    text-decoration:none;
+    text-transform:uppercase;
+    padding:1em;   
+}
+
+/* actions which require wrapping a form input */
+div.action{
+    input{
+        color:white;
+        -webkit-font-smoothing: antialiased; /* Do not remove! */
+        font-family:Open Sans,Arial,sans-serif;
+        border:0;
+        background:none;
+        display:block;
+        text-transform:uppercase;
+        padding:1em;
+        width:100%;
+        position:relative;
+        z-index:1;
+        text-align:left;
+        padding-left:3.5em;
+    }
+    &:before{
+        position:absolute;
+        top:0.6em;
+        left:0.6em;
+        z-index:0;
+    }
+}
diff --git a/wagtail/wagtailadmin/static/wagtailadmin/scss/wagtail-userbar.css b/wagtail/wagtailadmin/static/wagtailadmin/scss/wagtail-userbar.css
deleted file mode 100644
index 44103abcf..000000000
--- a/wagtail/wagtailadmin/static/wagtailadmin/scss/wagtail-userbar.css
+++ /dev/null
@@ -1,117 +0,0 @@
-/* NB: This embedding format references ttf/eo/svg files that don't exist. 
-This is a deliberate means of forcing the browser to use the base64 encoded woff instead. Somehow. */
-@font-face {
-    font-family: 'wagtailuserbar';
-    src: url('wagtailuserbar.eot');
-}
-
-@font-face {
-    font-family: 'wagtailuserbar';
-    src: url(data:application/x-font-woff;charset=utf-8;base64,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) format('woff'),
-         url('wagtailuserbar.ttf') format('truetype'),
-         url('wagtailuserbar.svg#wagtailuserbar') format('svg');
-    font-weight: normal;
-    font-style: normal;
-}
-
-body{
-	padding-top:50px;
-}
-
-#wagtail-userbar{
-	-webkit-box-sizing: border-box; 
-    -moz-box-sizing: border-box; 
-    box-sizing: border-box;
-	-webkit-font-smoothing: antialiased; 
-	font-family:Open Sans,sans-serif;
-	font-size:13px;
-	min-height:50px;
-	position:fixed;
-	width:100%;
-	top:0;
-	background-color:#333;
-	z-index:10000;
-	padding:10px 10px 0px 70px;
-	color:white;
-}
-	#wagtail-userbar:before,
-	#wagtail-userbar:after {
-	    content: " ";
-	    display: table;
-	}
-	#wagtail-userbar:after {
-	    clear: both;
-	}
-
-	#wagtail-userbar:before{
-		position:absolute;
-		font-family:wagtailuserbar;
-		content:"v";
-		width:50px;
-		height:100%;
-		min-height:50px;
-		line-height:57px;
-		font-size:40px;
-		background-color:blue;
-		display:block;
-		float:left;
-		margin:-10px 0 0 -70px;
-		background-color:#000;
-		color:white;
-		opacity:0.4;
-		text-align:center;
-	}
-
-	#wagtail-userbar ul,
-	#wagtail-userbar li{
-		margin:0;
-		padding:0;
-		list-style-type:none;
-	}
-	#wagtail-userbar li{
-		margin-bottom:10px;
-	}
-	#wagtail-userbar p{
-		margin:0.5em 0 1em 0;
-	}
-	#wagtail-userbar .message{
-		float:left;
-	}
-	#wagtail-userbar .actions{
-		float:right;
-	}
-		#wagtail-userbar .actions form{
-			float:left;
-		}
-	#wagtail-userbar .button{
-		border:0;
-		font-family:Open Sans,Arial,sans-serif;
-		border-radius:2px;
-		background-color:#666;
-		-webkit-font-smoothing: antialiased; 
-		text-transform:uppercase;
-		padding:0.5em 1em;
-		float:left;
-		margin:0 1em 1em 0;
-		font-weight:normal;
-		font-size:0.9em;
-		color:white;
-		line-height:1.2em;
-		text-decoration:none;
-	}
-		#wagtail-userbar .button:hover{
-			background-color:#555;
-		}
-		#wagtail-userbar .button.yes{
-			background-color:#43b1b0;
-		}
-		#wagtail-userbar .button.yes:hover{
-			background-color:#2c7d7b;
-		}
-		#wagtail-userbar .button.no{
-			background-color:#f7474e;
-		}
-		#wagtail-userbar .button.no:hover{
-			background-color:#cf0911;
-		}
-
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/admin_base.html b/wagtail/wagtailadmin/templates/wagtailadmin/admin_base.html
new file mode 100644
index 000000000..00559e7b4
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/admin_base.html
@@ -0,0 +1,31 @@
+{% extends "wagtailadmin/skeleton.html" %}
+{% load compress %}
+
+{% block css %}
+    {% compress css %}
+        <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/vendor/jquery-ui/jquery-ui-1.10.3.verdant.css" />
+        <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/vendor/jquery.timepicker.css" />
+        <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/core.scss" type="text/x-scss" />
+    {% endcompress %}
+
+    {% block extra_css %}{% endblock %}
+{% endblock %}
+
+{% block js %}
+    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
+    {% compress js %}
+        {% comment %}
+            Core JS includes (for inclusion on all pages) to be specified here
+        {% endcomment %}
+
+        <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery-ui-1.10.3.js"></script>
+        <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery.timepicker.min.js"></script>
+        <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery.autosize.js"></script>
+        <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/bootstrap-modal.js"></script>
+        <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/bootstrap-tab.js"></script>
+        <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery.dlmenu.js"></script>
+        <script src="{{ STATIC_URL }}wagtailadmin/js/core.js"></script>
+    {% endcompress %}
+    
+    {% block extra_js %}{% endblock %}
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/base.html b/wagtail/wagtailadmin/templates/wagtailadmin/base.html
index 6a7b2f567..a847ada18 100644
--- a/wagtail/wagtailadmin/templates/wagtailadmin/base.html
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/base.html
@@ -1,4 +1,4 @@
-{% extends "wagtailadmin/skeleton.html" %}
+{% extends "wagtailadmin/admin_base.html" %}
 {% load wagtailadmin_nav %}
 {% load i18n %}
 {% block furniture %}
@@ -33,4 +33,4 @@
             {% block content %}{% endblock %}
         </div>
     </div>
-{% endblock %}
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/login.html b/wagtail/wagtailadmin/templates/wagtailadmin/login.html
index cf28de7f1..9cb28ed86 100644
--- a/wagtail/wagtailadmin/templates/wagtailadmin/login.html
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/login.html
@@ -1,4 +1,4 @@
-{% extends "wagtailadmin/skeleton.html" %}
+{% extends "wagtailadmin/admin_base.html" %}
 {% load compress %}
 {% load i18n %}
 {% block titletag %}{% trans "Sign in" %}{% endblock %}
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/skeleton.html b/wagtail/wagtailadmin/templates/wagtailadmin/skeleton.html
index 1ddda14d6..fa45d0702 100644
--- a/wagtail/wagtailadmin/templates/wagtailadmin/skeleton.html
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/skeleton.html
@@ -13,19 +13,14 @@
     
     <script src="//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"></script>
 
-    {% block css %}{# Block defined for timing breakdowns in django debug toolbar - not expected to be overridden #}
-        <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" />
-        <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Bitter:400,700" /> 
-        
-        {% compress css %}
-            <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/normalize.css" />
-            <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/vendor/jquery-ui/jquery-ui-1.10.3.verdant.css" />
-            <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/vendor/jquery.timepicker.css" />
-            <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/core.scss" type="text/x-scss" />
-        {% endcompress %}
+    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600,700" />
+    <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Bitter:400,700" /> 
 
-        {% block extra_css %}{% endblock %}
-    {% endblock %}
+    {% compress css %}
+        <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/normalize.css" />
+    {% endcompress %}
+
+    {% block css %}{% endblock %}
 </head>
 <body class="{% block bodyclass %}{% endblock %} {% if messages %}has-messages{% endif %}">
     <!--[if lt IE 9]>
@@ -36,23 +31,6 @@
        {% block furniture %}{% endblock %}
     </div>
 
-    {% block js %}
-        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
-        {% compress js %}
-            {% comment %}
-                Core JS includes (for inclusion on all pages) to be specified here
-            {% endcomment %}
-
-            <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery-ui-1.10.3.js"></script>
-            <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery.timepicker.min.js"></script>
-            <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery.autosize.js"></script>
-            <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/bootstrap-modal.js"></script>
-            <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/bootstrap-tab.js"></script>
-            <script src="{{ STATIC_URL }}wagtailadmin/js/vendor/jquery.dlmenu.js"></script>
-            <script src="{{ STATIC_URL }}wagtailadmin/js/core.js"></script>
-        {% endcompress %}
-        
-        {% block extra_js %}{% endblock %}
-    {% endblock %}
+    {% block js %}{% endblock %}
 </body>
 </html>
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html
new file mode 100644
index 000000000..293d43bc7
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/base.html
@@ -0,0 +1,28 @@
+{% extends "wagtailadmin/skeleton.html" %}
+{% load compress i18n %}
+
+{% block titletag %}{% trans 'User bar' %}{% endblock %}
+{% block css %}
+    {% compress css %}
+        <link rel="stylesheet" href="{{ STATIC_URL }}wagtailadmin/scss/userbar.scss" type="text/x-scss" />
+    {% endcompress %}
+{% endblock %}
+
+{% block furniture %}
+    <div class="wagtail-userbar">
+        <nav>
+            <a href="{% url 'wagtailadmin_home' %}" target="_parent" class="home icon icon-wagtail" title="{% trans 'Go to Wagtail admin interface' %}">{% trans 'Go to Wagtail admin interface' %}</a>
+            <ul>
+                {% for item in items %}
+                    {{ item|safe }}
+                {% endfor %}
+            </ul>
+        </nav>
+    </div>
+{% endblock %}
+
+{% block js %}
+    {% compress js %}
+        <script src="{{ STATIC_URL }}wagtailadmin/js/edit_bird.js"></script>
+    {% endcompress %}
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/frame.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/frame.html
new file mode 100644
index 000000000..d4b69de1c
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/frame.html
@@ -0,0 +1,13 @@
+<style type="text/css">
+    #wagtail-userbar{
+    	background:transparent;
+        position:absolute;
+        top:0;
+        right:0;
+        z-index:9000;
+        border:0;
+        width:150px;
+        height:300px;
+    }
+</style>
+<iframe id="wagtail-userbar" src="{% if revision_id %}{% url 'wagtailadmin_userbar_moderation' revision_id %}{% else %}{% url 'wagtailadmin_userbar_frontend' page.self.id %}{% endif %}" width="1000px" height="1000px" frameborder="0" allowtransparency="true" scrolling="no"></iframe>
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_base.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_base.html
new file mode 100644
index 000000000..8e9666d4c
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_base.html
@@ -0,0 +1 @@
+<li class="{% block item_classes %}{% endblock %}">{% block item_content %}{% endblock %}</li>
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_add.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_add.html
new file mode 100644
index 000000000..45f0002e9
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_add.html
@@ -0,0 +1,6 @@
+{% extends "wagtailadmin/userbar/item_base.html" %}
+{% load i18n  %}
+
+{% block item_content %}
+    <a href="{% url 'wagtailadmin_pages_add_subpage' self.parent_page.id %}" target="_parent" class="action icon icon-plus" title="{% trans 'Add another page at this level' %}">{% trans 'Add' %}</a>
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_approve.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_approve.html
new file mode 100644
index 000000000..eed4b5b85
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_approve.html
@@ -0,0 +1,11 @@
+{% extends "wagtailadmin/userbar/item_base.html" %}
+{% load i18n %}
+
+{% block item_content %}
+    <form action="{% url 'wagtailadmin_pages_approve_moderation' self.revision.id %}" target="_parent" method="post">
+        {% csrf_token %}
+        <div class="action icon icon-tick">
+            <input type="submit" value="{% trans 'Approve' %}" />
+        </div>
+    </form>
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html
new file mode 100644
index 000000000..c6bb077ad
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_edit.html
@@ -0,0 +1,6 @@
+{% extends "wagtailadmin/userbar/item_base.html" %}
+{% load i18n %}
+
+{% block item_content %}
+    <a href="{% url 'wagtailadmin_pages_edit' self.page.id %}" target="_parent" class="action icon icon-edit">{% trans 'Edit' %}</a>
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_reject.html b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_reject.html
new file mode 100644
index 000000000..ff145a508
--- /dev/null
+++ b/wagtail/wagtailadmin/templates/wagtailadmin/userbar/item_page_reject.html
@@ -0,0 +1,11 @@
+{% extends "wagtailadmin/userbar/item_base.html" %}
+{% load i18n %}
+
+{% block item_content %}
+    <form action="{% url 'wagtailadmin_pages_reject_moderation' self.revision.id %}" target="_parent" method="post">
+        {% csrf_token %}
+        <div class="action icon icon-cross">
+            <input type="submit" value="{% trans 'Reject' %}" />
+        </div>
+    </form>
+{% endblock %}
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/templatetags/wagtailuserbar.py b/wagtail/wagtailadmin/templatetags/wagtailuserbar.py
index e708740ff..b7d7de35a 100644
--- a/wagtail/wagtailadmin/templatetags/wagtailuserbar.py
+++ b/wagtail/wagtailadmin/templatetags/wagtailuserbar.py
@@ -1,17 +1,25 @@
 from django import template
-from django.contrib.staticfiles.storage import staticfiles_storage
-from django.utils.html import format_html, format_html_join
+from wagtail.wagtailadmin.views import userbar
+from wagtail.wagtailcore.models import Page
 
 register = template.Library()
 
-
 @register.simple_tag(takes_context=True)
-def wagtailuserbar(context, cssfile=None):
-    try:
-        items = format_html_join(u'', u'<li>{0}</li>', [(item,) for item in context['request'].userbar])
-        context.hasuserbar = True
-        if not cssfile:
-            cssfile = staticfiles_storage.url('wagtailadmin/css/wagtail-userbar.css')
-        return format_html(u'<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Open+Sans:400" /><link rel="stylesheet" href="{0}" /><ul id="wagtail-userbar">{1}</ul>', cssfile, items)
-    except AttributeError:
+def wagtailuserbar(context, current_page=None, items=None):
+
+    # Find request object
+    request = context['request']
+    
+    # Don't render if user doesn't have permission to access the admin area
+    if not request.user.has_perm('wagtailadmin.access_admin'):
         return ''
+
+    # Find page object
+    if not current_page:
+        if 'self' in context and isinstance(context['self'], Page):
+            current_page = context['self']
+        else:
+            return ''
+
+    # Render edit bird
+    return userbar.render_edit_frame(request, context) or ''
\ No newline at end of file
diff --git a/wagtail/wagtailadmin/urls.py b/wagtail/wagtailadmin/urls.py
index b26591905..081337803 100644
--- a/wagtail/wagtailadmin/urls.py
+++ b/wagtail/wagtailadmin/urls.py
@@ -79,4 +79,7 @@ urlpatterns += patterns(
 
     url(r'^account/$', 'account.account', name='wagtailadmin_account'),
     url(r'^account/change_password/$', 'account.change_password', name='wagtailadmin_account_change_password'),
+
+    url(r'^userbar/(\d+)/$', 'userbar.for_frontend', name='wagtailadmin_userbar_frontend'),
+    url(r'^userbar/moderation/(\d+)/$', 'userbar.for_moderation', name='wagtailadmin_userbar_moderation'),
 )
diff --git a/wagtail/wagtailadmin/userbar.py b/wagtail/wagtailadmin/userbar.py
new file mode 100644
index 000000000..a641a7b1d
--- /dev/null
+++ b/wagtail/wagtailadmin/userbar.py
@@ -0,0 +1,80 @@
+from django.core.urlresolvers import reverse
+from django.template import RequestContext
+from django.template.loader import render_to_string
+
+class BaseItem(object):
+    template = 'wagtailadmin/userbar/item_base.html'
+
+    def render(self, request):
+        return render_to_string(self.template, dict(self=self, request=request), context_instance=RequestContext(request))
+
+class AddPageItem(BaseItem):
+    template = 'wagtailadmin/userbar/item_page_add.html'
+
+    def __init__(self, page):
+        self.page = page
+        self.parent_page = page.get_parent()
+
+    def render(self, request):
+        # Don't render if the page doesn't have an id
+        if not self.page.id:
+            return ""
+
+        # Don't render if user doesn't have permission to access the admin area
+        if not request.user.has_perm('wagtailadmin.access_admin'):
+            return ""
+
+        # Don't render if user doesn't have ability to add siblings
+        permission_checker = self.page.get_parent().permissions_for_user(request.user)
+        if not permission_checker.can_add_subpage():
+            return ""
+
+        return super(AddPageItem, self).render(request)
+
+class EditPageItem(BaseItem):
+    template = 'wagtailadmin/userbar/item_page_edit.html'
+
+    def __init__(self, page):
+        self.page = page
+
+    def render(self, request):
+        # Don't render if the page doesn't have an id
+        if not self.page.id:
+            return ""
+
+        # Don't render if user doesn't have permission to access the admin area
+        if not request.user.has_perm('wagtailadmin.access_admin'):
+            return ""
+ 
+        # Don't render if the user doesn't have permission to edit this page
+        permission_checker = self.page.permissions_for_user(request.user)
+        if not permission_checker.can_edit():
+            return ""
+
+        return super(EditPageItem, self).render(request)
+
+class ModeratePageItem(BaseItem):
+
+    def __init__(self, revision):
+        self.revision = revision
+
+    def render(self, request):
+        if not self.revision.id:
+            return ""
+
+        if not self.revision.submitted_for_moderation:
+            return ""
+
+        if not request.user.has_perm('wagtailadmin.access_admin'):
+            return ""
+
+        if not self.revision.page.permissions_for_user(request.user).can_publish():
+            return ""
+       
+        return super(ModeratePageItem, self).render(request)
+
+class ApproveModerationEditPageItem(ModeratePageItem):
+    template = 'wagtailadmin/userbar/item_page_approve.html'
+
+class RejectModerationEditPageItem(ModeratePageItem):
+    template = 'wagtailadmin/userbar/item_page_reject.html'
diff --git a/wagtail/wagtailadmin/views/pages.py b/wagtail/wagtailadmin/views/pages.py
index 769fd4662..9032d3410 100644
--- a/wagtail/wagtailadmin/views/pages.py
+++ b/wagtail/wagtailadmin/views/pages.py
@@ -622,12 +622,7 @@ def preview_for_moderation(request, revision_id):
         return redirect('wagtailadmin_home')
 
     page = revision.as_page_object()
-    if not hasattr(request, 'userbar'):
-        request.userbar = []
-    request.userbar.append(
-        render_to_string('wagtailadmin/pages/_moderator_userbar.html', {
-            'revision': revision,
-        }, context_instance=RequestContext(request))
-    )
+
+    request.revision_id = revision_id
 
     return page.serve(request)
diff --git a/wagtail/wagtailadmin/views/userbar.py b/wagtail/wagtailadmin/views/userbar.py
new file mode 100644
index 000000000..9d15dfe45
--- /dev/null
+++ b/wagtail/wagtailadmin/views/userbar.py
@@ -0,0 +1,65 @@
+from django.conf import settings
+from django.shortcuts import render, redirect
+from django.template.loader import render_to_string
+from django.contrib import messages
+from django.contrib.auth.forms import SetPasswordForm
+from django.contrib.auth.decorators import permission_required
+from django.utils.translation import ugettext as _ 
+
+from wagtail.wagtailadmin.userbar import EditPageItem, AddPageItem, ApproveModerationEditPageItem, RejectModerationEditPageItem
+from wagtail.wagtailadmin import hooks
+from wagtail.wagtailcore.models import Page, PageRevision
+
+def render_edit_frame(request, context):
+    try:
+        revision_id = request.revision_id
+    except:
+        revision_id = None
+
+    # Render the frame to contain the userbar items
+    return render_to_string('wagtailadmin/userbar/frame.html', {
+        'page': context,
+        'revision_id': revision_id
+    })
+
+def for_frontend(request, page_id):
+    items = [
+        EditPageItem(Page.objects.get(id=page_id)),
+        AddPageItem(Page.objects.get(id=page_id)),
+    ]
+
+    for fn in hooks.get_hooks('construct_wagtail_edit_bird'):
+        fn(request, items)
+
+    # Render the items
+    rendered_items = [item.render(request) for item in items]
+
+    # Remove any unrendered items
+    rendered_items = [item for item in rendered_items if item]
+
+    # Render the edit bird
+    return render(request, 'wagtailadmin/userbar/base.html', {
+        'items': rendered_items,
+    })
+
+def for_moderation(request, revision_id):
+    items = [
+        EditPageItem(PageRevision.objects.get(id=revision_id).page),
+        AddPageItem(PageRevision.objects.get(id=revision_id).page),
+        ApproveModerationEditPageItem(PageRevision.objects.get(id=revision_id)),
+        RejectModerationEditPageItem(PageRevision.objects.get(id=revision_id)),
+    ]
+
+    for fn in hooks.get_hooks('construct_wagtail_edit_bird'):
+        fn(request, items)
+
+    # Render the items
+    rendered_items = [item.render(request) for item in items]
+
+    # Remove any unrendered items
+    rendered_items = [item for item in rendered_items if item]
+
+    # Render the edit bird
+    return render(request, 'wagtailadmin/userbar/base.html', {
+        'items': rendered_items,
+    })
\ No newline at end of file