diff --git a/openstack_dashboard/dashboards/project/instances/views.py b/openstack_dashboard/dashboards/project/instances/views.py
index 904271e8f1..1c8ef8799b 100644
--- a/openstack_dashboard/dashboards/project/instances/views.py
+++ b/openstack_dashboard/dashboards/project/instances/views.py
@@ -222,11 +222,10 @@ def rdp(request, instance_id):
 
 
 class SerialConsoleView(generic.TemplateView):
-    template_name = 'project/instances/serial_console.html'
+    template_name = 'serial_console.html'
 
     def get_context_data(self, **kwargs):
         context = super(SerialConsoleView, self).get_context_data(**kwargs)
-        context['instance_id'] = self.kwargs['instance_id']
         instance = None
         try:
             instance = api.nova.server_get(self.request,
@@ -236,13 +235,14 @@ class SerialConsoleView(generic.TemplateView):
                 "Cannot find instance %s.") % self.kwargs['instance_id']
             # name is unknown, so leave it blank for the window title
             # in full-screen mode, so only the instance id is shown.
-            context['instance_name'] = ''
+            context['page_title'] = self.kwargs['instance_id']
             return context
-        context['instance_name'] = instance.name
+        context['page_title'] = "%s (%s)" % (instance.name, instance.id)
         try:
             console_url = project_console.get_console(self.request,
                                                       "SERIAL", instance)[1]
             context["console_url"] = console_url
+            context["protocols"] = "['binary', 'base64']"
         except exceptions.NotAvailable:
             context["error_message"] = _(
                 "Cannot get console for instance %s.") % self.kwargs[
diff --git a/openstack_dashboard/static/js/angular/directives/serialConsole.js b/openstack_dashboard/static/js/angular/directives/serialConsole.js
index e886aebab2..8101e79281 100644
--- a/openstack_dashboard/static/js/angular/directives/serialConsole.js
+++ b/openstack_dashboard/static/js/angular/directives/serialConsole.js
@@ -19,10 +19,6 @@ limitations under the License.
   'use strict';
 
   angular.module('serialConsoleApp', [])
-    .constant('protocols', [
-      'binary',
-      'base64'
-    ])
     .constant('states', [
       gettext('Connecting'),
       gettext('Open'),
@@ -36,16 +32,17 @@ limitations under the License.
      *
      * @description
      * The serial-console element creates a terminal based on the widely-used term.js.
-     * The "connection" attribute is input to a WebSocket object, which connects
-     * to a server. In Horizon, this directive is used to connect to nova-serialproxy,
-     * opening a serial console to any instance. Each key the user types is transmitted
-     * to the instance, and each character the instance reponds with is displayed.
+     * The "connection" and "protocols" attributes are input to a WebSocket object,
+     * which connects to a server. In Horizon, this directive is used to connect to
+     * nova-serialproxy, opening a serial console to any instance. Each key the user
+     * types is transmitted to the instance, and each character the instance reponds
+     * with is displayed.
      */
     .directive('serialConsole', serialConsole);
 
-  serialConsole.$inject = ['protocols', 'states'];
+  serialConsole.$inject = ['states'];
 
-  function serialConsole(protocols, states) {
+  function serialConsole(states) {
     return {
       scope: true,
       template: '<div id="terminalNode"></div><br>{{statusMessage()}}',
@@ -53,6 +50,7 @@ limitations under the License.
       link: function postLink(scope, element, attrs) {
 
         var connection = scope.$eval(attrs.connection);
+        var protocols = scope.$eval(attrs.protocols);
         var term = new Terminal();
         var socket = new WebSocket(connection, protocols);
 
diff --git a/openstack_dashboard/dashboards/project/instances/templates/instances/serial_console.html b/openstack_dashboard/templates/serial_console.html
similarity index 85%
rename from openstack_dashboard/dashboards/project/instances/templates/instances/serial_console.html
rename to openstack_dashboard/templates/serial_console.html
index a852da5255..13c1fc5159 100644
--- a/openstack_dashboard/dashboards/project/instances/templates/instances/serial_console.html
+++ b/openstack_dashboard/templates/serial_console.html
@@ -4,7 +4,7 @@
 <head>
   <meta content='IE=edge' http-equiv='X-UA-Compatible' />
   <meta content='text/html; charset=utf-8' http-equiv='Content-Type' />
-  <title>{{instance_name}} ({{instance_id}})</title>
+  <title>{{page_title}}</title>
   <link rel="stylesheet" href="{{ STATIC_URL }}dashboard/scss/serial_console.css" type="text/css" media="screen">
   <script src="{% url 'horizon:jsi18n' 'horizon' %}"></script>
   <script src='{{ STATIC_URL }}horizon/lib/termjs/term.js'></script>
@@ -17,7 +17,7 @@
     {% if error_message %}
         {{ error_message }}
     {% else %}
-        <serial-console connection='"{{console_url}}"'></serial-console>
+        <serial-console connection='"{{console_url}}"' protocols='{{protocols}}'></serial-console>
     {% endif %}
 
 </body>