diff --git a/addons/web_editor/static/src/js/common/grid_layout_utils.js b/addons/web_editor/static/src/js/common/grid_layout_utils.js
index b86bb5b4f59..ffa5da88b69 100644
--- a/addons/web_editor/static/src/js/common/grid_layout_utils.js
+++ b/addons/web_editor/static/src/js/common/grid_layout_utils.js
@@ -304,7 +304,8 @@ export function _convertToNormalColumn(columnEl) {
 /**
  * Checks whether the column only contains an image or not. An image is
  * considered alone if the column only contains empty textnodes and line breaks
- * in addition to the image.
+ * in addition to the image. Note that "image" also refers to an image link
+ * (i.e. `a > img`).
  *
  * @private
  * @param {Element} columnEl
@@ -312,7 +313,7 @@ export function _convertToNormalColumn(columnEl) {
  */
 export function _checkIfImageColumn(columnEl) {
     let isImageColumn = false;
-    const imageEls = columnEl.querySelectorAll(':scope > img');
+    const imageEls = columnEl.querySelectorAll(":scope > img, :scope > a > img");
     const columnChildrenEls = [...columnEl.children].filter(el => el.nodeName !== 'BR');
     if (imageEls.length === 1 && columnChildrenEls.length === 1) {
         // If there is only one image and if this image is the only "real"
diff --git a/addons/web_editor/static/src/scss/web_editor.frontend.scss b/addons/web_editor/static/src/scss/web_editor.frontend.scss
index bc467ce0bbf..e2acea2f452 100644
--- a/addons/web_editor/static/src/scss/web_editor.frontend.scss
+++ b/addons/web_editor/static/src/scss/web_editor.frontend.scss
@@ -75,19 +75,19 @@
     }
 
     .o_grid_item_image {
-        > img, > .media_iframe_video {
+        img, .media_iframe_video {
             width: 100% !important;
             height: 100% !important;
             object-fit: cover !important;
         }
 
-        &.o_grid_item_image_contain > img,
-        > img[data-shape] {
+        &.o_grid_item_image_contain img,
+        img[data-shape] {
             object-fit: contain !important;
         }
 
         // Allowing "cover" for some hover effects.
-        &:not(.o_grid_item_image_contain) > img[data-shape$="geo_square"] {
+        &:not(.o_grid_item_image_contain) img[data-shape$="geo_square"] {
             &:not(
                 [data-hover-effect="dolly_zoom"],
                 [data-hover-effect="outline"],
@@ -96,6 +96,12 @@
                 object-fit: cover !important;
             }
         }
+
+        // Needed when "a" is "display: block".
+        > a {
+            width: 100% !important;
+            height: 100% !important;
+        }
     }
 }
 
diff --git a/addons/website/static/src/js/editor/snippets.options.js b/addons/website/static/src/js/editor/snippets.options.js
index d08790baacc..82f7df86978 100644
--- a/addons/website/static/src/js/editor/snippets.options.js
+++ b/addons/website/static/src/js/editor/snippets.options.js
@@ -4029,7 +4029,11 @@ options.registry.GridImage = options.Class.extend({
      * @returns {?HTMLElement}
      */
     _getImageGridItem() {
-        const parentEl = this.$target[0].parentNode;
+        let parentEl = this.$target[0].parentNode;
+        if (parentEl.matches("a")) {
+            // Case of an image link.
+            parentEl = parentEl.parentNode;
+        }
         if (parentEl && parentEl.classList.contains('o_grid_item_image')) {
             return parentEl;
         }