diff --git a/netbox/templates/dcim/frontport.html b/netbox/templates/dcim/frontport.html
index 08a3a8d2f..036a7d172 100644
--- a/netbox/templates/dcim/frontport.html
+++ b/netbox/templates/dcim/frontport.html
@@ -62,16 +62,27 @@
         </div>
         <div class="col col-12 col-md-6">
             <div class="card">
-                <h2 class="card-header">{% trans "Rear Ports" %}</h2>
-                <table class="table table-hover">
-                  {% for mapping in rear_port_mappings %}
+              <h2 class="card-header">{% trans "Port Mappings" %}</h2>
+              <table class="table table-hover">
+                {% if rear_port_mappings %}
+                  <thead>
                     <tr>
-                      <td>{{ mapping.front_port_position }}</td>
-                      <td>{{ mapping.rear_port|linkify }}</td>
-                      <td>{{ mapping.rear_port_position }}</td>
+                      <th>{% trans "Position" %}</th>
+                      <th>{% trans "Rear Port" %}</th>
                     </tr>
-                  {% endfor %}
-                </table>
+                  </thead>
+                {% endif %}
+                {% for mapping in rear_port_mappings %}
+                  <tr>
+                    <td>{{ mapping.front_port_position }}</td>
+                    <td>
+                      <a href="{{ mapping.rear_port.get_absolute_url }}">{{ mapping.rear_port }}:{{ mapping.rear_port_position }}</a>
+                    </td>
+                  </tr>
+                {% empty %}
+                  {% trans "No mappings defined" %}
+                {% endfor %}
+              </table>
             </div>
             <div class="card">
                 <h2 class="card-header">{% trans "Connection" %}</h2>
diff --git a/netbox/templates/dcim/rearport.html b/netbox/templates/dcim/rearport.html
index 98cb70851..872a437dc 100644
--- a/netbox/templates/dcim/rearport.html
+++ b/netbox/templates/dcim/rearport.html
@@ -62,16 +62,27 @@
         </div>
         <div class="col col-12 col-md-6">
             <div class="card">
-                <h2 class="card-header">{% trans "Rear Ports" %}</h2>
-                <table class="table table-hover">
-                  {% for mapping in front_port_mappings %}
+              <h2 class="card-header">{% trans "Port Mappings" %}</h2>
+              <table class="table table-hover">
+                {% if front_port_mappings %}
+                  <thead>
                     <tr>
-                      <td>{{ mapping.rear_port_position }}</td>
-                      <td>{{ mapping.front_port|linkify }}</td>
-                      <td>{{ mapping.front_port_position }}</td>
+                      <th>{% trans "Position" %}</th>
+                      <th>{% trans "Front Port" %}</th>
                     </tr>
-                  {% endfor %}
-                </table>
+                  </thead>
+                {% endif %}
+                {% for mapping in front_port_mappings %}
+                  <tr>
+                    <td>{{ mapping.rear_port_position }}</td>
+                    <td>
+                      <a href="{{ mapping.front_port.get_absolute_url }}">{{ mapping.front_port }}:{{ mapping.front_port_position }}</a>
+                    </td>
+                  </tr>
+                {% empty %}
+                  {% trans "No mappings defined" %}
+                {% endfor %}
+              </table>
             </div>
             <div class="card">
                 <h2 class="card-header">{% trans "Connection" %}</h2>