diff --git a/app/models/settings/general.rb b/app/models/settings/general.rb
index 74325f929..4d8c1a426 100644
--- a/app/models/settings/general.rb
+++ b/app/models/settings/general.rb
@@ -92,7 +92,8 @@ module Settings
       facebook: nil,
       github: nil,
       instagram: nil,
-      twitch: nil
+      twitch: nil,
+      mastodon: nil
     }
     setting :twitter_hashtag, type: :string
 
diff --git a/app/views/admin/settings/forms/_rate_limit.html.erb b/app/views/admin/settings/forms/_rate_limit.html.erb
index db9e99c80..e5b6a3b6a 100644
--- a/app/views/admin/settings/forms/_rate_limit.html.erb
+++ b/app/views/admin/settings/forms/_rate_limit.html.erb
@@ -42,38 +42,3 @@
     </div>
   </details>
 <% end %>
-
-<%= form_for(Settings::General.new,
-             url: admin_settings_general_settings_path,
-             html: { data: { action: "submit->config#updateConfigurationSettings" } }) do |f| %>
-  <details class="crayons-card">
-    <summary class="crayons-subtitle-2 p-6">Social Media</summary>
-    <div class="p-6 pt-0">
-      <fieldset class="grid gap-4">
-        <div class="crayons-field">
-          <%= admin_config_label :twitter_hashtag %>
-          <%= admin_config_description Constants::Settings::General.details[:twitter_hashtag][:description] %>
-          <%= f.text_field :twitter_hashtag,
-                           class: "crayons-textfield",
-                           value: Settings::General.twitter_hashtag.to_s,
-                           placeholder: Constants::Settings::General.details[:twitter_hashtag][:placeholder] %>
-        </div>
-        <%= f.fields_for :social_media_handles do |social_media_field| %>
-          <% Settings::General.social_media_handles.each do |platform, username| %>
-            <div class="crayons-field">
-              <%= admin_config_label platform %>
-              <p class="crayons-field__description">
-              <%= platform.capitalize %> username
-              </p>
-              <%= social_media_field.text_field platform,
-                                                class: "crayons-textfield",
-                                                value: Settings::General.social_media_handles[platform],
-                                                placeholder: "" %>
-            </div>
-          <% end %>
-        <% end %>
-      </fieldset>
-      <%= render "update_setting_button", f: f %>
-    </div>
-  </details>
-<% end %>
diff --git a/app/views/admin/settings/forms/_social_media.html.erb b/app/views/admin/settings/forms/_social_media.html.erb
new file mode 100644
index 000000000..5b5cf24ec
--- /dev/null
+++ b/app/views/admin/settings/forms/_social_media.html.erb
@@ -0,0 +1,34 @@
+<%= form_for(Settings::General.new,
+             url: admin_settings_general_settings_path,
+             html: { data: { action: "submit->config#updateConfigurationSettings" } }) do |f| %>
+  <details class="crayons-card">
+    <summary class="crayons-subtitle-2 p-6">Social Media</summary>
+    <div class="p-6 pt-0">
+      <fieldset class="grid gap-4">
+        <div class="crayons-field">
+          <%= admin_config_label :twitter_hashtag %>
+          <%= admin_config_description Constants::Settings::General.details[:twitter_hashtag][:description] %>
+          <%= f.text_field :twitter_hashtag,
+                           class: "crayons-textfield",
+                           value: Settings::General.twitter_hashtag.to_s,
+                           placeholder: Constants::Settings::General.details[:twitter_hashtag][:placeholder] %>
+        </div>
+        <%= f.fields_for :social_media_handles do |social_media_field| %>
+          <% Settings::General.social_media_handles.each do |platform, username| %>
+            <div class="crayons-field">
+              <%= admin_config_label platform %>
+              <p class="crayons-field__description">
+              <%= platform == "mastodon" ? "Mastodon complete URL including \"https://\"" : "#{platform.capitalize} username" %>
+              </p>
+              <%= social_media_field.text_field platform,
+                                                class: "crayons-textfield",
+                                                value: Settings::General.social_media_handles[platform],
+                                                placeholder: platform == "mastodon" ? "https://fosstodon.org/@thepracticaldev" : "" %>
+            </div>
+          <% end %>
+        <% end %>
+      </fieldset>
+      <%= render "update_setting_button", f: f %>
+    </div>
+  </details>
+<% end %>
diff --git a/app/views/admin/settings/show.html.erb b/app/views/admin/settings/show.html.erb
index 0f31f6f9b..00348cbfc 100644
--- a/app/views/admin/settings/show.html.erb
+++ b/app/views/admin/settings/show.html.erb
@@ -23,6 +23,7 @@
   <%= render partial: "forms/newsletter" %>
   <%= render partial: "forms/onboarding" %>
   <%= render partial: "forms/rate_limit" %>
+  <%= render partial: "forms/social_media" %>
   <%= render partial: "forms/tags" %>
   <%= render partial: "forms/user_experience" %>
 </div>
diff --git a/app/views/layouts/_social_media.html.erb b/app/views/layouts/_social_media.html.erb
index 4e14ca6d6..a7d35df7c 100644
--- a/app/views/layouts/_social_media.html.erb
+++ b/app/views/layouts/_social_media.html.erb
@@ -1,10 +1,13 @@
+<% compact_margin = Settings::General.social_media_handles.values.compact_blank.count > 5 %>
 <% Settings::General.social_media_handles.each do |social_media_type, handle| %>
   <% next if handle.blank? %>
+  <%# There isn't a single Mastodon site to build the target URL so the setting should contain the complete URL %>
+  <% target_url = social_media_type == "mastodon" ? handle : "https://#{social_media_type}.com/#{handle}" %>
   <a
-    href="<%= "https://#{social_media_type}.com/#{handle}" %>"
+    href="<%= target_url %>"
     target="_blank"
-    class="c-link c-link--icon-alone c-link--block mx-1"
-    rel="noopener">
+    class="c-link c-link--icon-alone c-link--block <%= compact_margin ? "" : "mx-1" %>"
+    rel="noopener me">
     <%= crayons_icon_tag(social_media_type, class: "c-link__icon", title: social_media_type.capitalize) %>
   </a>
 <% end %>