diff --git a/umap/static/umap/css/dialog.css b/umap/static/umap/css/dialog.css
index f608b97e..b3dcf0ff 100644
--- a/umap/static/umap/css/dialog.css
+++ b/umap/static/umap/css/dialog.css
@@ -14,6 +14,9 @@
     height: fit-content;
     max-height: 90vh;
 }
+.umap-dialog ul + h4 {
+  margin-top: var(--box-margin);
+}
 :where([data-component="no-dialog"]:not([hidden])) {
   display: block;
   position: relative;
diff --git a/umap/static/umap/js/modules/help.js b/umap/static/umap/js/modules/help.js
index 61ea1131..5d396a79 100644
--- a/umap/static/umap/js/modules/help.js
+++ b/umap/static/umap/js/modules/help.js
@@ -135,14 +135,23 @@ const ENTRIES = {
       <li>${translate('# one hash for main heading')}</li>
       <li>${translate('## two hashes for second heading')}</li>
       <li>${translate('### three hashes for third heading')}</li>
+      <li>${translate('--- for a horizontal rule')}</li>
+    </ul>
+    <h4>${translate('Links')}</h4>
+    <ul>
       <li>${translate('Simple link: [[https://example.com]]')}</li>
       <li>${translate('Link with text: [[https://example.com|text of the link]]')}</li>
+    </ul>
+    <h4>${translate('Images')}</h4>
+    <ul>
       <li>${translate('Image: {{https://image.url.com}}')}</li>
       <li>${translate('Image with custom width (in px): {{https://image.url.com|width}}')}</li>
+    </ul>
+    <h4>${translate('Iframes')}</h4>
+    <ul>
       <li>${translate('Iframe: {{{https://iframe.url.com}}}')}</li>
       <li>${translate('Iframe with custom height (in px): {{{https://iframe.url.com|height}}}')}</li>
       <li>${translate('Iframe with custom height and width (in px): {{{https://iframe.url.com|height*width}}}')}</li>
-      <li>${translate('--- for a horizontal rule')}</li>
     </ul>
   </div>
   `,