diff --git a/addons/knowledge/models/knowledge_article.py b/addons/knowledge/models/knowledge_article.py
index 06e34ed3fa7..bebecce9047 100644
--- a/addons/knowledge/models/knowledge_article.py
+++ b/addons/knowledge/models/knowledge_article.py
@@ -859,6 +859,8 @@ class Article(models.Model):
                 'body': Markup('<h1>%s</h1>') % title,
                 'name': title,
             })
+        else:
+            values['body'] = Markup('<h1 class="oe-hint"><br></h1>')
 
         if parent:
             if not is_private and parent.category == "private":
diff --git a/addons/knowledge/static/src/js/knowledge_controller.js b/addons/knowledge/static/src/js/knowledge_controller.js
index 09a49da2b02..3e3bc6006d7 100644
--- a/addons/knowledge/static/src/js/knowledge_controller.js
+++ b/addons/knowledge/static/src/js/knowledge_controller.js
@@ -14,6 +14,7 @@ const KnowledgeArticleFormController = FormController.extend({
         'click .o_knowledge_add_icon': '_onAddRandomIcon',
         'click .o_knowledge_add_cover': '_onAddCover',
         'click #knowledge_search_bar': '_onSearch',
+        'click .o_breadcrumb_article_name': '_onArticleBreadcrumbClick',
         'change .o_breadcrumb_article_name': '_onRename',
         'click i.o_toggle_favorite': '_onToggleFavorite',
         'input .o_breadcrumb_article_name': '_adjustInputSize',
@@ -102,8 +103,35 @@ const KnowledgeArticleFormController = FormController.extend({
      * @param {Event} event
      */
     _onRename: async function (event) {
+        var name = event.currentTarget.value;
+        if (name.length === 0) {
+            name = _t('New Article');
+        }
         const id = await this._getId();
-        await this._rename(id, event.currentTarget.value);
+        await this._rename(id, name);
+    },
+
+    /**
+     * When the user clicks on the name of the article, checks if the article
+     * name hasn't been set yet. If it hasn't, it will look for a title in the
+     * body of the article and set it as the name of the article.
+     * @param {Event} event
+     */
+     _onArticleBreadcrumbClick: async function (event) {
+        const name = event.currentTarget.value;
+        if (name === _t('New Article')) {
+            const $articleTitle = this.$('.o_knowledge_editor h1');
+            if ($articleTitle.text().length !== 0) {
+                this.$('.o_breadcrumb_article_name').val($articleTitle.text());
+                this.trigger_up('field_changed', {
+                    dataPointID: this.handle,
+                    changes: {
+                        'name': $articleTitle.text(),
+                    }
+                });
+                this._rename(await this._getId(), $articleTitle.text());
+            }
+        }
     },
 
     /**
@@ -269,6 +297,7 @@ const KnowledgeArticleFormController = FormController.extend({
      */
     _rename: async function (id, name) {
         this.$(`.o_knowledge_tree .o_article[data-article-id="${id}"] > .o_article_handle > .o_article_name`).text(name);
+        this.$(`.o_breadcrumb_article_name`).val(name);
     },
 
     /**