diff --git a/ipynbsrv/api/serializer.py b/ipynbsrv/api/serializer.py
index 2e61a12..ced546a 100644
--- a/ipynbsrv/api/serializer.py
+++ b/ipynbsrv/api/serializer.py
@@ -138,6 +138,16 @@ class Meta:
         model = Server
 
 
+class PortMappingSerializer(serializers.ModelSerializer):
+    """
+
+    """
+    is_protected_mapping = serializers.BooleanField(read_only=True)
+
+    class Meta:
+        model = PortMapping
+
+
 class ContainerSerializer(serializers.ModelSerializer):
     """
     Todo: write doc.
@@ -145,12 +155,17 @@ class ContainerSerializer(serializers.ModelSerializer):
     Server is set through the server selection algorithm set in the conf module.
     """
     backend_name = serializers.CharField(read_only=True, source='get_backend_name')
+    backend_base_url = serializers.CharField(read_only=True, source='get_backend_base_url')
     friendly_name = serializers.CharField(read_only=True, source='get_friendly_name')
     is_clone = serializers.BooleanField(read_only=True)
     is_image_based = serializers.BooleanField(read_only=True)
     is_running = serializers.BooleanField(read_only=True)
     is_suspended = serializers.BooleanField(read_only=True)
     has_clones = serializers.BooleanField(read_only=True)
+    port_mappings = PortMappingSerializer(
+        many=True,
+        read_only=True
+        )
 
     owner = serializers.HiddenField(
         default=CurrentBackendUserDefault()
diff --git a/ipynbsrv/core/models.py b/ipynbsrv/core/models.py
index 60d5d52..6dea440 100644
--- a/ipynbsrv/core/models.py
+++ b/ipynbsrv/core/models.py
@@ -1173,6 +1173,12 @@ def get_available_server_port(cls, server):
             # ServerSelectionAlgorithm must guarantee enough ports are free!
         return port
 
+    def is_protected_mapping(self):
+        """
+        Return `True` if this mapping is for the protected container port.
+        """
+        return self.internal_port == self.container.image.protected_port
+
     def __str__(self):
         """
         :inherit.
diff --git a/ipynbsrv/web/templates/web/snippets/container_grid.html b/ipynbsrv/web/templates/web/snippets/container_grid.html
index e106094..a49ec22 100644
--- a/ipynbsrv/web/templates/web/snippets/container_grid.html
+++ b/ipynbsrv/web/templates/web/snippets/container_grid.html
@@ -2,8 +2,14 @@
 <div class="row container-grid">
    {% for ct in containers %}
     <div class="col-xs-12 col-sm-6 col-md-4">
-        {% if ct.running %}
-            <div class="panel panel-success panel-container">
+        {% if ct.is_running %}
+            {% if ct.is_suspended %}
+                <div class="panel panel-warning panel-container">
+            }
+            {% else %}
+                <div class="panel panel-success panel-container">
+                }
+            {% endif %}
         {% else %}
             <div class="panel panel-danger panel-container">
         {% endif %}
@@ -11,7 +17,7 @@
             <div class="panel-body">
                 {{ ct.description }}
             </div>
-            {% if ct.running and ct.port_mappings %}
+            {% if ct.is_running and ct.port_mappings %}
             <table class="table">
                 <thead>
                     <tr>
@@ -21,10 +27,12 @@
                 </thead>
                 <tbody>
                     {% for port_mapping in ct.port_mappings %}
-                    <tr>
-                        <td>{{ port_mapping.internal }}</td>
-                        <td>{{ port_mapping.external }}</td>
-                    </tr>
+                        {% if not port_mapping.is_protected_mappping %}
+                        <tr>
+                            <td>{{ port_mapping.internal_port }}</td>
+                            <td>{{ ct.server.external_ip }}:{{ port_mapping.external_port }}</td>
+                        </tr>
+                        {% endif %}
                     {% endfor %}
                 </tbody>
             </table>
@@ -37,13 +45,15 @@
                     </button>
                     <ul class="dropdown-menu" role="menu" aria-labelledby="actions-container_1">
                         {% if ct.is_running %}
-                            <li role="presentation">
-                                <a role="menuitem" tabindex="-1" href="javascript:document.getElementById('connect-{{ ct.id }}').getElementsByTagName('button')[0].click();">Connect</a>
-                                <form id="connect-{{ ct.id }}" action="/workspace/{{ ct.workspace_port }}/" method="GET" target="_blank" role="form">
-                                    {% csrf_token %}
-                                    <button type="submit"></button>
-                                </form>
-                            </li>
+                            {% if ct.backend_base_url %}
+                                <li role="presentation">
+                                    <a role="menuitem" tabindex="-1" href="javascript:document.getElementById('connect-{{ ct.id }}').getElementsByTagName('button')[0].click();">Connect</a>
+                                    <form id="connect-{{ ct.id }}" action="{{ ct.backend_base_url }}" method="GET" target="_blank" role="form">
+                                        {% csrf_token %}
+                                        <button type="submit"></button>
+                                    </form>
+                                </li>
+                            {% endif %}
                             <li role="presentation">
                                 <a role="menuitem" tabindex="-1" href="javascript:document.getElementById('stop-{{ ct.id }}').getElementsByTagName('button')[0].click();">Stop</a>
                                 <form id="stop-{{ ct.id }}" action="{% url 'container_stop' %}" method="POST" role="form">
@@ -60,6 +70,26 @@
                                     <button type="submit"><button>
                                 </form>
                             </li>
+                            {% if ct.is_suspended %}
+                                <li role="presentation">
+                                    <a role="menuitem" tabindex="-1" href="javascript:document.getElementById('resume-{{ ct.id }}').getElementsByTagName('button')[0].click();">Resume</a>
+                                    <form id="resume-{{ ct.id }}" action="{% url 'container_resume' %}" method="POST" role="form">
+                                        {% csrf_token %}
+                                        <input name="id" type="hidden" value="{{ ct.id }}">
+                                        <button type="submit"><button>
+                                    </form>
+                                </li>
+                            {% else %}
+                                <li role="presentation">
+                                    <a role="menuitem" tabindex="-1" href="javascript:document.getElementById('resume-{{ ct.id }}').getElementsByTagName('button')[0].click();">Suspend</a>
+                                    <form id="suspend-{{ ct.id }}" action="{% url 'container_suspend' %}" method="POST" role="form">
+                                        {% csrf_token %}
+                                        <input name="id" type="hidden" value="{{ ct.id }}">
+                                        <button type="submit"><button>
+                                    </form>
+                                </li>
+
+                            {% endif %}
                         {% else %}
                             <li role="presentation">
                                 <a role="menuitem" tabindex="-1" href="javascript:document.getElementById('start-{{ ct.id }}').getElementsByTagName('button')[0].click();">Start</a>