diff options
Diffstat (limited to 'addons/website/static/src/xml/website.seo.xml')
| -rw-r--r-- | addons/website/static/src/xml/website.seo.xml | 179 |
1 files changed, 86 insertions, 93 deletions
diff --git a/addons/website/static/src/xml/website.seo.xml b/addons/website/static/src/xml/website.seo.xml index 8ada1a3088a..e6bb6aa378a 100644 --- a/addons/website/static/src/xml/website.seo.xml +++ b/addons/website/static/src/xml/website.seo.xml @@ -6,72 +6,10 @@ </t> </t> - <div t-name="website.seo_configuration"> - <section class="row"> - <div class="col-lg-6"> - <div class="mt16" role="form"> - <div class="form-group row"> - <label for="seo_page_title" class="col-3 col-form-label">Page Title</label> - <div class="col-9"> - <input type="text" name="seo_page_title" class="form-control" maxlength="70" size="70"/> - </div> - </div> - <div class="form-group row"> - <label for="seo_page_description" class="col-3 col-form-label">Description</label> - <div class="col-9"> - <textarea name="seo_page_description" class="form-control" style="max-width: 100%;height:145px;max-height:145px" t-att-maxlength="widget.maxDescriptionSize"/> - </div> - </div> - </div> - </div> - <div class="col-lg-6"> - <h5 class="mt16">Preview <small>how your page will be listed on Google</small></h5> - <div> - <div class="card mb0"> - <div class="card-body"> - <div class="js_seo_preview"/> - </div> - </div> - </div> - </div> - </section> - <hr/> - <div class="js_seo_tips" /> - <section class="js_seo_keywords_list"> - <h4 class="mt16">Define Keywords <small>describing your page content</small></h4> - <table class="table table-responsive"> - <thead> - <tr> - <td> - <div class="form-inline" role="form"> - <div class="input-group"> - <input type="text" style="min-width:170px" name="seo_page_keywords" class="form-control" placeholder="Keyword" maxlength="30"/> - <span class="input-group-append"> - <select name="seo_page_language" id="language-box" class="btn form-control"/> - </span> - <span class="input-group-append"> - <button data-action="add" class="btn btn-success" type="button">Add</button> - </span> - </div> - </div> - </td> - <td>Suggested<br/><small class="text-muted">Most searched topics related to your keywords, ordered by importance:</small></td> - </tr> - </thead> - <tfoot> - <tr> - <td/> - <td><hr/> - <small class="text-muted">Legend:</small> - <span class="badge badge-secondary">Not used</span> - <span class="badge badge-success">In title</span> - <span class="badge badge-primary">In description</span> - <span class="badge badge-info">In page's content</span> - </td> - </tr> - </tfoot> - </table> - </section> + <div t-name="website.seo_configuration" role="form"> + <section class="js_seo_meta_title_description"/> + <section class="js_seo_meta_keywords"/> + <section class="js_seo_image"/> </div> <t t-name="website.seo_suggestion_list"> @@ -86,35 +24,27 @@ </tbody> </t> - <t t-name="website.seo_tip"> - <div t-attf-class="alert alert-#{ widget.type }" role="alert"> - <t t-raw="widget.message"/> - </div> - </t> - <t t-name="website.seo_keyword"> - <tr> - <td> - <span t-attf-title="#{ widget.tooltip() }" t-attf-class="oe_seo_keyword #{ widget.highlight() } js_seo_keyword" t-att-data-keyword="widget.keyword"> - <t t-raw="widget.keyword"/> <a href="#" class="oe_remove" data-action="remove-keyword"/> - </span> - </td> - <td class="js_seo_keyword_suggestion"> - <!-- filled in JS --> - </td> + <tr class="js_seo_keyword" t-att-data-keyword="widget.keyword"> + <td t-esc="widget.keyword"/> + <td class="text-center"><i t-if="widget.used_h1" class="fa fa-check" t-attf-title="{{ widget.keyword }} is used in page first level heading"/></td> + <td class="text-center"><i t-if="widget.used_h2" class="fa fa-check" t-attf-title="{{ widget.keyword }} is used in page second level heading"/></td> + <td class="text-center"><i class="js_seo_keyword_title fa fa-check" style="visibility: hidden;" t-attf-title="{{ widget.keyword }} is used in page title"/></td> + <td class="text-center"><i class="js_seo_keyword_description fa fa-check" style="visibility: hidden;" t-attf-title="{{ widget.keyword }} is used in page description"/></td> + <td class="text-center"><i t-if="widget.used_content" class="fa fa-check" t-attf-title="{{ widget.keyword }} is used in page content"/></td> + <td class="js_seo_keyword_suggestion"/> + <td class="text-center"><a href="#" class="oe_remove" data-action="remove-keyword" t-attf-title="Remove {{ widget.keyword }}"><i class="fa fa-trash"/></a></td> </tr> </t> <t t-name="website.seo_suggestion"> - <li class="list-inline-item oe_seo_suggestion"> - <span t-attf-title="#{ widget.tooltip() }" t-attf-class="oe_seo_keyword #{ widget.highlight() } js_seo_suggestion" t-att-data-keyword="widget.keyword"> - <t t-raw="widget.keyword"/> - </span> + <li class="list-inline-item"> + <span class="js_seo_suggestion badge badge-info" t-att-data-keyword="widget.keyword" t-esc="widget.keyword"/> </li> </t> <t t-name="website.seo_preview"> - <li class="oe_seo_preview_g"> + <div class="oe_seo_preview_g"> <div class="rc"> <div class="r"><t t-esc="widget.title"/></div> <div class="s"> @@ -122,7 +52,70 @@ <div class="st"><t t-esc="widget.description"/></div> </div> </div> - </li> + </div> + </t> + + <div t-name="website.seo_meta_title_description"> + <h4><small>Optimize this page's referencing in search engines</small></h4> + <div class="row"> + <div class="col-lg-6"> + <div class="form-group"> + <label for="website_meta_title"> + Title <i class="fa fa-question-circle-o" title="The title will take a default value unless you specify one."/> + </label> + <input type="text" name="website_meta_title" id="website_meta_title" class="form-control" maxlength="70" size="70"/> + </div> + <div class="form-group"> + <label for="website_meta_description"> + Description <i class="fa fa-question-circle-o" title="The description will be generated by search engines based on page content unless you specify one."/> + </label> + <textarea name="website_meta_description" id="website_meta_description" class="form-control" style="height:120px;"/> + <div class="alert alert-warning mt16 mb0 small" id="website_meta_description_warning" style="display: none;"/> + </div> + </div> + <div class="col-lg-6"> + <div class="card-header">Preview</div> + <div class="card mb0 p-0"> + <div class="card-body"> + <div class="js_seo_preview"/> + </div> + </div> + </div> + </div> + </div> + + <t t-name="website.seo_meta_keywords"> + <label for="website_meta_keywords"> + Keywords + </label> + <div class="form-inline" role="form"> + <div class="input-group"> + <input type="text" name="website_meta_keywords" id="website_meta_keywords" class="form-control" placeholder="Keyword" maxlength="30"/> + <span class="input-group-append"> + <select name="seo_page_language" id="language-box" class="btn form-control"/> + </span> + <span class="input-group-append"> + <button data-action="add" class="btn btn-success" type="button">Add</button> + </span> + </div> + </div> + <div class="table-responsive mt16"> + <table class="table"> + <thead> + <tr> + <th>Keyword</th> + <th class="text-center" title="Used in page first level heading">H1</th> + <th class="text-center" title="Used in page second level heading">H2</th> + <th class="text-center" title="Used in page title">T</th> + <th class="text-center" title="Used in page description">D</th> + <th class="text-center" title="Used in page content">C</th> + <th title="Most searched topics related to your keyword, ordered by importance">Related keywords</th> + <th class="text-center"><i class="fa fa-trash" title="Remove"/></th> + </tr> + </thead> + <!-- body inserted in JS --> + </table> + </div> </t> <div t-name="website.seo_meta_image_selector" class="o_seo_og_image"> @@ -130,10 +123,9 @@ </div> <t t-name="website.og_image_body"> + <h4><small>Select an image for social share</small></h4> <div class="row"> - <div class="col-md-6"> - <h5 class="mt16 mb4">Image for Social Share</h5> - <div class="text-muted mb32">Select an image to use in social share.</div> + <div class="col-lg-6"> <t t-foreach="widget.images" t-as="image"> <div t-attf-class="o_meta_img mt4 #{image === widget.activeMetaImg and ' o_active_image' or ''}"> <img t-att-src="image"/> @@ -147,13 +139,14 @@ <i class="fa fa-upload"/> </div> </div> - <div class="col-md-6"> - <h6 class="mt16">Preview <small>how your page will be displayed on social media</small></h6> - <div class="card p-0"> + <div class="col-lg-6"> + <div class="card p-0 mb16"> + <div class="card-header">Preview</div> <img class="card-img-top o_meta_active_img" t-att-src="widget.activeMetaImg"/> <div class="card-body px-3 py-2"> <h6 class="text-alpha card-title mb0"><t t-esc="widget.metaTitle"/></h6> <small class="card-subtitle text-muted"><t t-esc="widget.serverUrl"/></small> + <p t-esc="widget.metaDescription"/> </div> </div> </div> |