diff --git a/addons/website/static/src/css/editor.css b/addons/website/static/src/css/editor.css index 3b6c7055e13..2b5de84c05b 100644 --- a/addons/website/static/src/css/editor.css +++ b/addons/website/static/src/css/editor.css @@ -506,19 +506,24 @@ table.editorbar-panel td.selected { .oe_seo_configuration .oe_remove { color: #e00101; } -.oe_seo_configuration .oe_seo_keyword { +.oe_seo_configuration .oe_seo_suggestion { cursor: pointer; +} +.oe_seo_configuration .oe_seo_keyword { padding: 0.2em 0.4em 0.2em 0.5em; border-radius: 0.4em; } .oe_seo_configuration .keyword-in-title { background-color: #5cb85c; + color: white; } .oe_seo_configuration .keyword-in-description { background-color: #428bca; + color: white; } .oe_seo_configuration .keyword-in-body { background-color: #5bc0de; + color: white; } /* ---- ACE EDITOR ---- */ diff --git a/addons/website/static/src/css/editor.sass b/addons/website/static/src/css/editor.sass index 4db40a8f9c2..20fa98ec96d 100644 --- a/addons/website/static/src/css/editor.sass +++ b/addons/website/static/src/css/editor.sass @@ -432,21 +432,26 @@ $remove_color: $icon_close $in_title_color: #5cb85c $in_description_color: #428bca $in_body_color: #5bc0de +$highlighted_text_color: #ffffff .oe_seo_configuration .modal-dialog width: 80% .oe_remove color: $remove_color - .oe_seo_keyword + .oe_seo_suggestion cursor: pointer + .oe_seo_keyword padding: .2em .4em .2em .5em border-radius: .4em .keyword-in-title background-color: $in_title_color + color: $highlighted_text_color .keyword-in-description background-color: $in_description_color + color: $highlighted_text_color .keyword-in-body background-color: $in_body_color + color: $highlighted_text_color /* ---- ACE EDITOR ---- */ diff --git a/addons/website/static/src/js/website.seo.js b/addons/website/static/src/js/website.seo.js index 810fa3c737c..e38d63c9ef5 100644 --- a/addons/website/static/src/js/website.seo.js +++ b/addons/website/static/src/js/website.seo.js @@ -15,6 +15,19 @@ website.seo = {}; + function analyzeKeyword(htmlPage, keyword) { + return htmlPage.isInTitle(keyword) ? { + title: 'keyword-in-title', + description: "This keyword is used in the page title", + } : htmlPage.isInDescription(keyword) ? { + title: 'keyword-in-description', + description: "This keyword is used in the page description", + } : htmlPage.isInBody(keyword) ? { + title: 'keyword-in-body', + description: "This keyword is used in the page content." + } : { title: "", description: "" }; + } + website.seo.Suggestion = openerp.Widget.extend({ template: 'website.seo_suggestion', events: { @@ -30,11 +43,14 @@ this.htmlPage.on('title-changed', this, this.renderElement); this.htmlPage.on('description-changed', this, this.renderElement); }, + analyze: function () { + return analyzeKeyword(this.htmlPage, this.keyword); + }, highlight: function () { - return this.htmlPage.isInTitle(this.keyword) ? 'keyword-in-title' - : this.htmlPage.isInDescription(this.keyword) ? 'keyword-in-description' - : this.htmlPage.isInBody(this.keyword) ? 'keyword-in-body' - : ""; + return this.analyze().title; + }, + tooltip: function () { + return this.analyze().description; }, select: function () { this.trigger('selected', this.keyword); @@ -103,15 +119,19 @@ }); this.suggestionList.appendTo(this.$('.js_seo_keyword_suggestion')); }, + analyze: function () { + return analyzeKeyword(this.htmlPage, this.keyword); + }, highlight: function () { - return this.htmlPage.isInTitle(this.keyword) ? 'keyword-in-title' - : this.htmlPage.isInDescription(this.keyword) ? 'keyword-in-description' - : this.htmlPage.isInBody(this.keyword) ? 'keyword-in-body' - : ""; + return this.analyze().title; + }, + tooltip: function () { + return this.analyze().description; }, updateLabel: function () { var cssClass = "oe_seo_keyword js_seo_keyword " + this.highlight(); this.$(".js_seo_keyword").attr('class', cssClass); + this.$(".js_seo_keyword").attr('title', this.tooltip()); }, destroy: function () { this.trigger('removed'); @@ -326,6 +346,8 @@ }); self.keywordList.appendTo($modal.find('.js_seo_keywords_list')); $modal.modal(); + // Avoid the 'Edit' button in the background boucing needlessly + $modal.on('click', function (e) { e.stopPropagation(); }); }, suggestImprovements: function () { var tips = []; @@ -340,13 +362,13 @@ if (htmlPage.headers('h1').length === 0) { tips.push({ type: 'warning', - message: "You don't have an <h1> tag on your page.", + message: "This page seems to be missing an <h1> tag.", }); } if (htmlPage.headers('h1').length > 1) { tips.push({ type: 'warning', - message: "You have more than one <h1> tag on your page.", + message: "The page contains more than one <h1> tag.", }); } if (tips.length > 0) { @@ -354,7 +376,7 @@ displayTip(tip.message, tip.type); }); } else { - displayTip("Your page makup is appropriate for search engines.", 'success'); + displayTip("The markup on this page is appropriate for search engines.", 'success'); } }, confirmKeyword: function (e) { diff --git a/addons/website/static/src/xml/website.seo.xml b/addons/website/static/src/xml/website.seo.xml index 9d5b1700a91..d77dacd10bc 100644 --- a/addons/website/static/src/xml/website.seo.xml +++ b/addons/website/static/src/xml/website.seo.xml @@ -26,7 +26,7 @@ - Here are the most searched topics related to these keywords, ordered by importance: + Most searched topics related your keywords, ordered by importance:
@@ -69,16 +69,15 @@ -
- - +
+
- + x
@@ -90,7 +89,7 @@
  • - +