diff --git a/wagtail/admin/templates/wagtailadmin/generic/form.html b/wagtail/admin/templates/wagtailadmin/generic/form.html
index 95ce0f3f7a..2290371051 100644
--- a/wagtail/admin/templates/wagtailadmin/generic/form.html
+++ b/wagtail/admin/templates/wagtailadmin/generic/form.html
@@ -1,12 +1,16 @@
 {% extends "wagtailadmin/generic/base.html" %}
-{% load i18n %}
+{% load i18n wagtailadmin_tags %}
 
 {% block main_content %}
     {% block before_form %}{% endblock %}
     <form action="{{ action_url }}" method="POST" novalidate{% if form.is_multipart %} enctype="multipart/form-data"{% endif %}>
         {% csrf_token %}
 
-        {{ form.non_field_errors }}
+        {% block non_field_errors %}
+            {% for error in form.non_field_errors %}
+                {% help_block status="critical" %}{{ error }}{% endhelp_block %}
+            {% endfor %}
+        {% endblock %}
 
         {% block hidden_fields %}
             {% for field in form.hidden_fields %}{{ field }}{% endfor %}
diff --git a/wagtail/sites/tests.py b/wagtail/sites/tests.py
index c13e00fa82..02b7e5ee3c 100644
--- a/wagtail/sites/tests.py
+++ b/wagtail/sites/tests.py
@@ -154,9 +154,12 @@ class TestSiteCreateView(WagtailTestUtils, TestCase):
             {"hostname": "localhost", "port": "80", "root_page": str(self.home_page.id)}
         )
         expected_html = """
-            <ul class="errorlist nonfield">
-                <li>Site with this Hostname and Port already exists.</li>
-            </ul>
+            <div class="help-block help-critical">
+                <svg class="icon icon-warning icon" aria-hidden="true">
+                    <use href="#icon-warning"></use>
+                </svg>
+                Site with this Hostname and Port already exists.
+            </div>
         """
         self.assertTagInHTML(expected_html, str(response.content))
 
@@ -283,13 +286,13 @@ class TestSiteEditView(WagtailTestUtils, TestCase):
             hostname="something_different",
             port=80,
             is_default_site=False,
-            root_page=self.home_page
+            root_page=self.home_page,
         )
         response = self.post(
             {
-                'hostname': "Localhost",
+                "hostname": "Localhost",
             },
-            site_id=second_site.id
+            site_id=second_site.id,
         )
 
         # Should return the form with errors
@@ -304,18 +307,21 @@ class TestSiteEditView(WagtailTestUtils, TestCase):
             hostname="something_different",
             port=80,
             is_default_site=False,
-            root_page=self.home_page
+            root_page=self.home_page,
         )
         response = self.post(
             {
-                'hostname': "Localhost",
+                "hostname": "Localhost",
             },
-            site_id=second_site.id
+            site_id=second_site.id,
         )
         expected_html = """
-            <ul class="errorlist nonfield">
-                <li>Site with this Hostname and Port already exists.</li>
-            </ul>
+            <div class="help-block help-critical">
+                <svg class="icon icon-warning icon" aria-hidden="true">
+                    <use href="#icon-warning"></use>
+                </svg>
+                Site with this Hostname and Port already exists.
+            </div>
         """
         self.assertTagInHTML(expected_html, str(response.content))