diff --git a/addons/web_editor/static/src/js/editor/snippets.editor.js b/addons/web_editor/static/src/js/editor/snippets.editor.js
index c938b987ae2..1f170d8a7db 100644
--- a/addons/web_editor/static/src/js/editor/snippets.editor.js
+++ b/addons/web_editor/static/src/js/editor/snippets.editor.js
@@ -686,6 +686,7 @@ var SnippetsMenu = Widget.extend({
     cacheSnippetTemplate: {},
     events: {
         'click .o_install_btn': '_onInstallBtnClick',
+        'click .o_we_invisible_entry': '_onInvisibleEntryClick',
     },
     custom_events: {
         'activate_insertion_zones': '_onActivateInsertionZones',
@@ -697,6 +698,7 @@ var SnippetsMenu = Widget.extend({
         'go_to_parent': '_onGoToParent',
         'remove_snippet': '_onRemoveSnippet',
         'snippet_removed': '_onSnippetRemoved',
+        'snippet_cloned': '_onSnippetCloned',
         'reload_snippet_dropzones': '_disableUndroppableSnippets',
         'update_customize_elements': '_onUpdateCustomizeElements',
         'hide_overlay': '_onHideOverlay',
@@ -754,6 +756,19 @@ var SnippetsMenu = Widget.extend({
             this.customizePanel = document.createElement('div');
             this.customizePanel.classList.add('o_we_customize_panel', 'd-none');
             this.$el.append(this.customizePanel);
+
+            this.invisibleDOMPanelEl = document.createElement('div');
+            this.invisibleDOMPanelEl.classList.add('o_we_invisible_el_panel');
+            this.invisibleDOMPanelEl.appendChild(
+                $('<div/>', {
+                    text: _t('Invisible'),
+                    class: 'o_panel_header',
+                }).prepend(
+                    $('<i/>', {class: 'fa fa-eye-slash'})
+                )[0]
+            );
+            this.$el.append(this.invisibleDOMPanelEl);
+            this._updateInvisibleDOM();
         }));
 
         // Prepare snippets editor environment
@@ -1073,6 +1088,28 @@ var SnippetsMenu = Widget.extend({
             }
         });
     },
+    /**
+     * Adds an entry for every invisible snippet in the left panel box.
+     * The entries will contains an 'Edit' button to activate their snippet.
+     *
+     * @private
+     */
+    _updateInvisibleDOM: function () {
+        this.invisibleDOMMap = new Map();
+        const $invisibleDOMPanelEl = $(this.invisibleDOMPanelEl);
+        $invisibleDOMPanelEl.find('.o_we_invisible_entry').remove();
+        const $invisibleSnippets = this.getEditableArea().find('.o_snippet_invisible');
+
+        _.each($invisibleSnippets, el => {
+            const $invisEntry = $('<div/>', {
+                class: 'o_we_invisible_entry d-flex align-items-center',
+                text: el.title,
+            }).append($('<i/>', {class: 'fa fa-edit ml-2'}));
+            $invisibleDOMPanelEl.append($invisEntry);
+            this.invisibleDOMMap.set($invisEntry[0], el);
+        });
+        $invisibleDOMPanelEl.toggleClass('d-none', !$invisibleSnippets.length);
+    },
     /**
      * Disable the overlay editor of the active snippet and activate the new one
      * if given.
@@ -1613,6 +1650,8 @@ var SnippetsMenu = Widget.extend({
                         self.trigger_up('snippet_dropped', {$target: $target});
                         self._disableUndroppableSnippets();
 
+                        self._updateInvisibleDOM();
+
                         self._callForEachChildSnippet($target, function (editor, $snippet) {
                             editor.buildSnippet();
                         }).then(function () {
@@ -1792,6 +1831,21 @@ var SnippetsMenu = Widget.extend({
             }],
         }).open();
     },
+    /**
+     * @private
+     * @param {Event} ev
+     */
+    _onInvisibleEntryClick: function (ev) {
+        ev.preventDefault();
+        const $snippet = $(this.invisibleDOMMap.get(ev.currentTarget));
+        let prom = null;
+        $snippet.trigger('invisible_snippet_activation', {
+            onSuccess: _prom => prom = _prom,
+        });
+        Promise.resolve(prom).then(() => {
+            return this._activateSnippet($snippet);
+        });
+    },
     /**
      * @private
      */
@@ -1814,6 +1868,12 @@ var SnippetsMenu = Widget.extend({
             editor.removeSnippet();
         });
     },
+    /**
+     * @private
+     */
+    _onSnippetCloned: function (ev) {
+        this._updateInvisibleDOM();
+    },
     /**
      * Called when a snippet is removed -> checks if there is draggable snippets
      * to enable/disable as the DOM changed.
@@ -1822,6 +1882,7 @@ var SnippetsMenu = Widget.extend({
      */
     _onSnippetRemoved: function () {
         this._disableUndroppableSnippets();
+        this._updateInvisibleDOM();
     },
     /**
      * @private
diff --git a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
index 6f76811a704..b981a613521 100644
--- a/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
+++ b/addons/web_editor/static/src/scss/wysiwyg_snippets.scss
@@ -92,21 +92,20 @@ body.editor_enable.editor_has_snippets {
         overflow: auto;
     }
 
-    > #o_scroll {
+    .o_panel_header {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 3%;
+        color: inherit;
+        margin-bottom: 3%;
 
-        .o_panel_header {
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            padding: 3%;
-            color: inherit;
-            margin-bottom: 3%;
-
-            i {
-                margin-right: 5px;
-            }
+        i {
+            margin-right: 5px;
         }
+    }
 
+    > #o_scroll {
         .o_panel_body {
             &:after {
                 content: " ";
@@ -506,6 +505,23 @@ body.editor_enable.editor_has_snippets {
             }
         }
     }
+
+    > .o_we_invisible_el_panel {
+        flex: 0 0 auto;
+        max-height: 220px;
+        overflow-y: auto;
+        background-color: var(--o-we-bg-color);
+        border-top: 2px solid;
+
+        .o_we_invisible_entry {
+            padding: 0.5rem;
+            cursor: pointer;
+
+            &:hover {
+                background-color: var(--o-we-snippets-bg-color);
+            }
+        }
+    }
 }
 
 .oe_snippet {
diff --git a/addons/website/static/src/js/editor/snippets.options.js b/addons/website/static/src/js/editor/snippets.options.js
index 3a0cfa72c6d..e7e0efcb8d0 100644
--- a/addons/website/static/src/js/editor/snippets.options.js
+++ b/addons/website/static/src/js/editor/snippets.options.js
@@ -35,12 +35,13 @@ options.Class.include({
      *
      * @private
      * @param {jQuery} [$el=this.$target]
+     * @param {Object} [options]
      */
-    _refreshPublicWidgets: function ($el) {
-        this.trigger_up('widgets_start_request', {
+    _refreshPublicWidgets: function ($el, options) {
+        this.trigger_up('widgets_start_request', _.extend({
             editableMode: true,
             $target: $el || this.$target,
-        });
+        }, options || {}));
     },
 });
 
diff --git a/addons/website_mass_mailing/static/src/js/website_mass_mailing.editor.js b/addons/website_mass_mailing/static/src/js/website_mass_mailing.editor.js
index 526c7e35fec..ca10b5586a0 100644
--- a/addons/website_mass_mailing/static/src/js/website_mass_mailing.editor.js
+++ b/addons/website_mass_mailing/static/src/js/website_mass_mailing.editor.js
@@ -66,11 +66,15 @@ options.registry.newsletter_popup = options.registry.mailing_list_subscribe.exte
      */
     start: function () {
         var self = this;
-        this.$target.on('click.newsletter_popup_option', '.o_edit_popup', function (ev) {
+        this.$target.on('invisible_snippet_activation', function (ev, options) {
             // So that the snippet is not enabled again by the editor
             ev.stopPropagation();
             self.$target.data('quick-open', true);
-            self._refreshPublicWidgets();
+            options.onSuccess(new Promise(resolve => {
+                self._refreshPublicWidgets(self.$target, {
+                    onSuccess: () => resolve(),
+                });
+            }));
         });
         this.$target.on('shown.bs.modal.newsletter_popup_option hide.bs.modal.newsletter_popup_option', function () {
             self.$target.closest('.o_editable').trigger('content_changed');
diff --git a/addons/website_mass_mailing/views/snippets_templates.xml b/addons/website_mass_mailing/views/snippets_templates.xml
index 320b3e8ff11..31db4095204 100644
--- a/addons/website_mass_mailing/views/snippets_templates.xml
+++ b/addons/website_mass_mailing/views/snippets_templates.xml
@@ -51,11 +51,7 @@
 </template>
 
 <template id="s_newsletter_subscribe_popup" name="Newsletter Popup">
-    <div class="o_newsletter_popup" data-list-id="0">
-        <div class="alert alert-warning css_non_editable_mode_hidden o_not_editable" role="alert">
-            <strong>Newsletter Popup!</strong> The newsletter popup is active on this page. <a class="o_edit_popup" data-toggle="modal" href="#">Edit Popup</a>
-        </div>
-    </div>
+    <div class="o_newsletter_popup o_snippet_invisible" data-list-id="0" title="A newsletter popup is active on this page."/>
 </template>
 
 <template id="newsletter_subscribe_options" name="Newsletter Subscribe Options" inherit_id="website.snippet_options">