diff --git a/app/views/relationable/_form.html.erb b/app/views/relationable/_form.html.erb
new file mode 100644
index 000000000..e5d83bdfb
--- /dev/null
+++ b/app/views/relationable/_form.html.erb
@@ -0,0 +1,22 @@
+<%= form_tag related_contents_path, method: :post, id: "related_content", class: "hide", "data-toggler": ".hide" do %>
+    <label><%= t("related_content.label") %></label>
+
+    <p class="help-text" id="related_content_help_text">
+      <%= t("related_content.help", org: setting['org_name']) %>
+    </p>
+
+    <div class="input-group">
+      <div class="input-group-field">
+        <%= text_field_tag :url, '',
+                          "aria-describedby": "related_content_help_text",
+                          placeholder: t("related_content.placeholder", url: setting['url']) %>
+
+        <%= hidden_field_tag :relationable_klass, relationable.class.name %>
+        <%= hidden_field_tag :relationable_id, relationable.id %>
+      </div>
+
+      <div class="input-group-button">
+        <%= submit_tag t("related_content.submit"), class: "button" %>
+      </div>
+    </div>
+  <% end %>
diff --git a/app/views/relationable/_related_content.html.erb b/app/views/relationable/_related_content.html.erb
index e780d3cf7..19435fec2 100644
--- a/app/views/relationable/_related_content.html.erb
+++ b/app/views/relationable/_related_content.html.erb
@@ -4,12 +4,15 @@
     <h2 class="inline-block">
       <%= t("related_content.title") %>&nbsp;<span>(<%= relationable.relationed_contents.count %>)</span>
     </h2>
-
-    <a data-toggle="related_content" class="add-related-content">
-      <%= t("related_content.add") %>
+    <a>
+      <button type="button" data-toggle="related_content" class="add-related-content" id="add-related-content">
+        <%= t("related_content.add") %>
+      </button>
     </a>
   </div>
 
+  <%= render 'relationable/form', relationable: relationable %>
+
   <%= render 'relationable/related_list', relationable: relationable %>
 
 </div>