diff --git a/bookwyrm/templates/settings/announcements/announcement.html b/bookwyrm/templates/settings/announcements/announcement.html
index 8b49f4f4..09501382 100644
--- a/bookwyrm/templates/settings/announcements/announcement.html
+++ b/bookwyrm/templates/settings/announcements/announcement.html
@@ -1,5 +1,7 @@
 {% extends 'settings/layout.html' %}
-{% load i18n %}{% load humanize %}
+{% load i18n %}
+{% load humanize %}
+
 {% block title %}{% trans "Announcement" %} - {{ announcement.preview }}{% endblock %}
 
 {% block header %}
@@ -8,10 +10,12 @@
 {% endblock %}
 
 {% block edit-button %}
-{% trans "Edit Announcement" as button_text %}
 <div class="field has-addons">
     <div class="control">
-        {% include 'snippets/toggle/open_button.html' with controls_text="edit_announcement" icon_with_text="pencil" text=button_text focus="edit_announcement_header" %}
+        <a class="button" href="{% url 'settings-announcements-edit' announcement.id %}">
+            <span class="icon icon-pencil m-0-mobile" aria-hidden="true"></span>
+            <span class="is-sr-only-mobile">{% trans "Edit Announcement" %}</span>
+        </a>
     </div>
     <form class="control" action="{% url 'settings-announcements-delete' announcement.id %}" method="post">
         {% csrf_token %}
@@ -25,10 +29,6 @@
 
 {% block panel %}
 
-<form name="edit-announcement" method="post" action="{% url 'settings-announcements' announcement.id %}" class="block">
-    {% include 'settings/announcements/announcement_form.html' with controls_text="edit_announcement" %}
-</form>
-
 <div class="block content">
     <dl>
         <dt class="is-pulled-left mr-5 has-text-weight-bold">{% trans "Visible:" %}</dt>
diff --git a/bookwyrm/templates/settings/announcements/announcement_form.html b/bookwyrm/templates/settings/announcements/announcement_form.html
deleted file mode 100644
index 8f68e255..00000000
--- a/bookwyrm/templates/settings/announcements/announcement_form.html
+++ /dev/null
@@ -1,80 +0,0 @@
-{% extends 'components/inline_form.html' %}
-{% load i18n %}
-
-{% block header %}
-{% if announcement %}
-{% trans "Edit Announcement" %}
-{% else %}
-{% trans "Create Announcement" %}
-{% endif %}
-{% endblock %}
-
-{% block form %}
-{% csrf_token %}
-<input type="hidden" name="user" value="{{ request.user.id }}">
-<p>
-    <label class="label" for="id_preview">
-        {% trans "Preview:" %}
-    </label>
-    {{ form.preview }}
-    
-    {% include 'snippets/form_errors.html' with errors_list=form.preview.errors id="desc_preview" %}
-</p>
-<p>
-    <label class="label" for="id_content">
-        {% trans "Content:" %}
-    </label>
-    {{ form.content }}
-    
-    {% include 'snippets/form_errors.html' with errors_list=form.content.errors id="desc_content" %}
-</p>
-<p>
-    <label class="label" for="id_event_date">
-        {% trans "Event date:" %}
-    </label>
-    <input type="date" name="event_date" value="{{ form.event_date.value|date:'Y-m-d' }}" class="input" id="id_event_date">
-    
-    {% include 'snippets/form_errors.html' with errors_list=form.event_date.errors id="desc_event_date" %}
-</p>
-<hr aria-hidden="true">
-<div class="columns">
-    <div class="column">
-        <p>
-            <label class="label" for="id_start_date">
-                {% trans "Start date:" %}
-            </label>
-            <input type="date" name="start_date" class="input" value="{{ form.start_date.value|date:'Y-m-d' }}" id="id_start_date">
-            
-            {% include 'snippets/form_errors.html' with errors_list=form.start_date.errors id="desc_start_date" %}
-        </p>
-    </div>
-    <div class="column">
-        <p>
-            <label class="label" for="id_end_date">
-                {% trans "End date:" %}
-            </label>
-            <input type="date" name="end_date" class="input" id="id_end_date" value="{{ form.end_date.value|date:'Y-m-d' }}">
-            
-            {% include 'snippets/form_errors.html' with errors_list=form.end_date.errors id="desc_end_date" %}
-        </p>
-    </div>
-    <div class="column is-narrow">
-        <p>
-            <label class="label" for="id_active">
-                {% trans "Active:" %}
-            </label>
-            {{ form.active }}
-            
-            {% include 'snippets/form_errors.html' with errors_list=form.active.errors id="desc_active" %}
-        </p>
-    </div>
-</div>
-
-<div class="field has-addons">
-    <div class="control">
-        <button type="submit" class="button is-primary">
-            {% trans "Save" %}
-        </button>
-    </div>
-</div>
-{% endblock %}
diff --git a/bookwyrm/templates/settings/announcements/announcements.html b/bookwyrm/templates/settings/announcements/announcements.html
index d60ef376..6299ba3d 100644
--- a/bookwyrm/templates/settings/announcements/announcements.html
+++ b/bookwyrm/templates/settings/announcements/announcements.html
@@ -5,16 +5,15 @@
 {% block header %}{% trans "Announcements" %}{% endblock %}
 
 {% block edit-button %}
-{% trans "Create Announcement" as button_text %}
-{% include 'snippets/toggle/open_button.html' with controls_text="create_announcement" icon_with_text="plus" text=button_text focus="create_announcement_header" %}
+<a href="{% url 'settings-announcements-edit' %}">
+    {% trans "Create Announcement" as text %}
+    <span class="icon icon-plus" title="{{ text }}" aria-hidden="true"></span>
+    <span class="is-sr-only-mobile">{{ text }}</span>
+</a>
 {% endblock %}
 
 {% block panel %}
-<form name="create-announcement" method="post" action="{% url 'settings-announcements' %}" class="block">
-    {% include 'settings/announcements/announcement_form.html' with controls_text="create_announcement" %}
-</form>
-
-<div class="block">
+<div class="block table-container">
     <table class="table is-striped">
         <tr>
             <th>
diff --git a/bookwyrm/templates/settings/announcements/edit_announcement.html b/bookwyrm/templates/settings/announcements/edit_announcement.html
new file mode 100644
index 00000000..ef10c2a0
--- /dev/null
+++ b/bookwyrm/templates/settings/announcements/edit_announcement.html
@@ -0,0 +1,105 @@
+{% extends 'settings/layout.html' %}
+{% load i18n %}
+
+{% block header %}
+{% if announcement %}
+{% trans "Edit Announcement" %}
+{% else %}
+{% trans "Create Announcement" %}
+{% endif %}
+{% endblock %}
+
+{% block panel %}
+<form
+    name="edit-announcement"
+    method="POST"
+    {% if announcement.id %}
+    action="{% url 'settings-announcements-edit' announcement.id %}"
+    {% else %}
+    action="{% url 'settings-announcements-edit' %}"
+    {% endif %}
+    class="block"
+>
+    {% csrf_token %}
+    <input type="hidden" name="user" value="{{ request.user.id }}">
+    <h2 class="title is-4">{% trans "Announcement content" %}</h2>
+    <div class="box">
+        <p class="field">
+            <label class="label" for="id_preview">
+                {% trans "Summary:" %}
+            </label>
+            {{ form.preview }}
+
+            {% include 'snippets/form_errors.html' with errors_list=form.preview.errors id="desc_preview" %}
+        </p>
+        <p class="field">
+            <label class="label" for="id_content">
+                {% trans "Details:" %}
+            </label>
+            {{ form.content }}
+
+            {% include 'snippets/form_errors.html' with errors_list=form.content.errors id="desc_content" %}
+        </p>
+        <p class="field">
+            <label class="label" for="id_event_date">
+                {% trans "Event date:" %}
+            </label>
+            <input type="date" name="event_date" value="{{ form.event_date.value|date:'Y-m-d' }}" class="input" id="id_event_date">
+
+            {% include 'snippets/form_errors.html' with errors_list=form.event_date.errors id="desc_event_date" %}
+        </p>
+    </div>
+
+    <h2 class="title is-4">{% trans "Display settings" %}</h2>
+    <div class="box">
+        <div class="columns">
+            <div class="column">
+                <p>
+                    <label class="label" for="id_start_date">
+                        {% trans "Start date:" %}
+                    </label>
+                    <input type="date" name="start_date" class="input" value="{{ form.start_date.value|date:'Y-m-d' }}" id="id_start_date">
+
+                    {% include 'snippets/form_errors.html' with errors_list=form.start_date.errors id="desc_start_date" %}
+                </p>
+            </div>
+            <div class="column">
+                <p>
+                    <label class="label" for="id_end_date">
+                        {% trans "End date:" %}
+                    </label>
+                    <input type="date" name="end_date" class="input" id="id_end_date" value="{{ form.end_date.value|date:'Y-m-d' }}">
+
+                    {% include 'snippets/form_errors.html' with errors_list=form.end_date.errors id="desc_end_date" %}
+                </p>
+            </div>
+            <div class="column is-narrow">
+                <label class="label" for="id_active">
+                    {% trans "Color:" %}
+                </label>
+                <div class="select">
+                    {{ form.display_type }}
+                </div>
+
+                {% include 'snippets/form_errors.html' with errors_list=form.active.errors id="desc_display_type" %}
+            </div>
+        </div>
+        <p class="field">
+            <label class="label" for="id_active">
+                {% trans "Active:" %}
+                {{ form.active }}
+            </label>
+
+            {% include 'snippets/form_errors.html' with errors_list=form.active.errors id="desc_active" %}
+        </p>
+    </div>
+
+    <div class="field has-addons">
+        <div class="control">
+            <button type="submit" class="button is-primary">
+                {% trans "Save" %}
+            </button>
+        </div>
+    </div>
+</form>
+{% endblock %}
diff --git a/bookwyrm/urls.py b/bookwyrm/urls.py
index 79d868c9..5ee09a3a 100644
--- a/bookwyrm/urls.py
+++ b/bookwyrm/urls.py
@@ -93,6 +93,16 @@ urlpatterns = [
         views.Announcement.as_view(),
         name="settings-announcements",
     ),
+    re_path(
+        r"^settings/announcements/create/?$",
+        views.EditAnnouncement.as_view(),
+        name="settings-announcements-edit",
+    ),
+    re_path(
+        r"^settings/announcements/(?P<announcement_id>\d+)/edit/?$",
+        views.EditAnnouncement.as_view(),
+        name="settings-announcements-edit",
+    ),
     re_path(
         r"^settings/announcements/(?P<announcement_id>\d+)/delete/?$",
         views.delete_announcement,
diff --git a/bookwyrm/views/__init__.py b/bookwyrm/views/__init__.py
index 359bee82..579e89cb 100644
--- a/bookwyrm/views/__init__.py
+++ b/bookwyrm/views/__init__.py
@@ -1,6 +1,7 @@
 """ make sure all our nice views are available """
 # site admin
-from .admin.announcements import Announcements, Announcement, delete_announcement
+from .admin.announcements import Announcements, Announcement
+from .admin.announcements import EditAnnouncement, delete_announcement
 from .admin.dashboard import Dashboard
 from .admin.federation import Federation, FederatedServer
 from .admin.federation import AddFederatedServer, ImportServerBlocklist
diff --git a/bookwyrm/views/admin/announcements.py b/bookwyrm/views/admin/announcements.py
index 92ec1766..dd0ce862 100644
--- a/bookwyrm/views/admin/announcements.py
+++ b/bookwyrm/views/admin/announcements.py
@@ -45,23 +45,6 @@ class Announcements(View):
             request, "settings/announcements/announcements.html", data
         )
 
-    def post(self, request):
-        """edit the site settings"""
-        form = forms.AnnouncementForm(request.POST)
-        if form.is_valid():
-            form.save()
-            # reset the create form
-            form = forms.AnnouncementForm()
-        data = {
-            "announcements": Paginator(
-                models.Announcement.objects.order_by("-created_date"), PAGE_LENGTH
-            ).get_page(request.GET.get("page")),
-            "form": form,
-        }
-        return TemplateResponse(
-            request, "settings/announcements/announcements.html", data
-        )
-
 
 @method_decorator(login_required, name="dispatch")
 @method_decorator(
@@ -76,27 +59,52 @@ class Announcement(View):
         announcement = get_object_or_404(models.Announcement, id=announcement_id)
         data = {
             "announcement": announcement,
-            "form": forms.AnnouncementForm(instance=announcement),
         }
         return TemplateResponse(
             request, "settings/announcements/announcement.html", data
         )
 
-    def post(self, request, announcement_id):
-        """edit announcement"""
-        announcement = get_object_or_404(models.Announcement, id=announcement_id)
-        form = forms.AnnouncementForm(request.POST, instance=announcement)
-        if form.is_valid():
-            announcement = form.save()
-            form = forms.AnnouncementForm(instance=announcement)
+
+
+@method_decorator(login_required, name="dispatch")
+@method_decorator(
+    permission_required("bookwyrm.edit_instance_settings", raise_exception=True),
+    name="dispatch",
+)
+class EditAnnouncement(View):
+    """Create of edit an announcement"""
+    def get(self, request, announcement_id=None):
+        """announcement forms"""
+        announcement = None
+        if announcement_id:
+            announcement = get_object_or_404(models.Announcement, id=announcement_id)
+
         data = {
             "announcement": announcement,
-            "form": form,
+            "form": forms.AnnouncementForm(instance=announcement),
         }
         return TemplateResponse(
-            request, "settings/announcements/announcement.html", data
+            request, "settings/announcements/edit_announcement.html", data
         )
 
+    def post(self, request, announcement_id=None):
+        """edit announcement"""
+        announcement = None
+        if announcement_id:
+            announcement = get_object_or_404(models.Announcement, id=announcement_id)
+
+        form = forms.AnnouncementForm(request.POST, instance=announcement)
+        if not form.is_valid():
+            data = {
+                "announcement": announcement,
+                "form": form,
+            }
+            return TemplateResponse(
+                request, "settings/announcements/edit_announcement.html", data
+            )
+        announcement = form.save()
+        return redirect("settings-announcements", announcement.id)
+
 
 @login_required
 @permission_required("bookwyrm.edit_instance_settings", raise_exception=True)