diff --git a/content/contributing/documentation/rst_cheat_sheet.rst b/content/contributing/documentation/rst_cheat_sheet.rst
index 4eb876f72..ee7689c2f 100644
--- a/content/contributing/documentation/rst_cheat_sheet.rst
+++ b/content/contributing/documentation/rst_cheat_sheet.rst
@@ -454,6 +454,11 @@ The ``image`` markup allows inserting images in a document.
              :align: center
              :alt: Create an invoice.
 
+.. tip::
+   Add the :code:`:class: o-no-modal` `option
+   <https://docutils.sourceforge.io/docs/ref/rst/directives.html#common-options>`_ to an image to
+   prevent opening it in a modal.
+
 .. _contributing/alert-blocks:
 
 Alert blocks (admonitions)
diff --git a/extensions/odoo_theme/static/js/layout.js b/extensions/odoo_theme/static/js/layout.js
index dde541eaa..ada1b203c 100644
--- a/extensions/odoo_theme/static/js/layout.js
+++ b/extensions/odoo_theme/static/js/layout.js
@@ -8,24 +8,26 @@
             // Enforce the presence of the `img-fluid` class on all images.
             image.classList.add('img-fluid');
 
-            // Add a modal to each image.
-            const modalContainer = document.createElement('div');
-            modalContainer.classList.add('o_image_modal');
-            modalContainer.innerHTML = `<div class="modal fade" id="modal-${imageModalId}">
-                   <div class="modal-dialog modal-dialog-centered">
-                     <div class="modal-content">
-                       <div class="modal-body">
-                         <img src="${image.src}" alt="${image.alt}" class="img-fluid"/>
-                         <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
+            // Add a modal to each image that does not explicitly block it and has no target.
+            if (!image.classList.contains('o-no-modal') && image.parentElement.tagName !== 'A') {
+                const modalContainer = document.createElement('div');
+                modalContainer.classList.add('o_image_modal');
+                modalContainer.innerHTML = `<div class="modal fade" id="modal-${imageModalId}">
+                       <div class="modal-dialog modal-dialog-centered">
+                         <div class="modal-content">
+                           <div class="modal-body">
+                             <img src="${image.src}" alt="${image.alt}" class="o-no-modal img-fluid"/>
+                             <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
+                           </div>
+                         </div>
                        </div>
                      </div>
-                   </div>
-                 </div>
-            `;
-            image.parentNode.append(modalContainer);
-            image.setAttribute('data-bs-toggle', 'modal');
-            image.setAttribute('data-bs-target', `#modal-${imageModalId}`);
-            imageModalId++;
+                `;
+                image.parentNode.append(modalContainer);
+                image.setAttribute('data-bs-toggle', 'modal');
+                image.setAttribute('data-bs-target', `#modal-${imageModalId}`);
+                imageModalId++;
+            }
         });
 
         // Make all external links open in a new tab by default.