[IMP] website: add templates for footer
Also remove all t-fields from footers to have only static contents in footers. For social links, a controller is added so that a "static url" /website/social/xxx always redirect to the correct set URL for the given xxx social network. Part of https://github.com/odoo/odoo/pull/38950 task-2087641 Co-authored-by: qsm-odoo <qsm@odoo.com>
This commit is contained in:
Benjamin Vray
committed by
qsm-odoo
qsm-odoo
co-authored by
qsm-odoo
qsm-odoo
parent
cb20435069
commit
5ba817c453
@@ -218,6 +218,13 @@ class Website(Home):
|
||||
}
|
||||
return request.render('website.website_info', values)
|
||||
|
||||
@http.route(['/website/social/<string:social>'], type='http', auth="public", website=True, sitemap=False)
|
||||
def social(self, social, **kwargs):
|
||||
url = getattr(request.website, 'social_%s' % social, False)
|
||||
if not url:
|
||||
raise werkzeug.exceptions.NotFound()
|
||||
return request.redirect(url)
|
||||
|
||||
# ------------------------------------------------------
|
||||
# Edit
|
||||
# ------------------------------------------------------
|
||||
|
||||
@@ -162,6 +162,7 @@ class Theme(models.AbstractModel):
|
||||
'navbar-font-number': 'null',
|
||||
'buttons-font-number': 'null',
|
||||
'header-template': 'null',
|
||||
'footer-template': 'null',
|
||||
}
|
||||
)
|
||||
|
||||
@@ -170,6 +171,13 @@ class Theme(models.AbstractModel):
|
||||
self.disable_view('website.template_header_hamburger_left')
|
||||
self.disable_view('website.template_header_navbar_text_center')
|
||||
|
||||
# Reinitialize footer templates
|
||||
self.disable_view('website.template_footer_logo_about_us_below')
|
||||
self.disable_view('website.template_footer_links_address_logo')
|
||||
self.disable_view('website.template_footer_name_logo_links_about_us')
|
||||
self.disable_view('website.template_footer_logo_only')
|
||||
self.disable_view('website.template_footer_address_logo')
|
||||
|
||||
# Call specific theme post copy
|
||||
theme_post_copy = '_%s_post_copy' % mod.name
|
||||
if hasattr(self, theme_post_copy):
|
||||
|
||||
@@ -53,6 +53,7 @@ $o-base-website-values-palette: (
|
||||
'buttons-font-number': 1,
|
||||
'google-fonts': null,
|
||||
'header-template': 'logo_menu',
|
||||
'footer-template': 'products_contacts_about_us',
|
||||
);
|
||||
$o-website-values-palettes: (
|
||||
(),
|
||||
|
||||
@@ -787,22 +787,6 @@ header {
|
||||
@include make-container-max-widths($-mm-max-widths);
|
||||
}
|
||||
|
||||
// Copyright
|
||||
.o_footer_copyright {
|
||||
padding: 8px;
|
||||
.js_language_selector {
|
||||
display: inline-block;
|
||||
}
|
||||
@include media-breakpoint-up(md) {
|
||||
.row {
|
||||
display: flex;
|
||||
> div {
|
||||
margin: auto 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#wrapwrap.o_header_overlay {
|
||||
> header:not(.o_header_affix) {
|
||||
@include o-position-absolute(0, 0, auto, 0);
|
||||
@@ -826,6 +810,48 @@ header {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Footer Templates
|
||||
#footer {
|
||||
@if o-website-value('footer-template') != 'products_contacts_about_us' {
|
||||
@if o-website-value('footer-template') == 'logo_about_us_below' {
|
||||
.o_footer_logo {
|
||||
margin-top: $spacer;
|
||||
margin-bottom: $spacer;
|
||||
}
|
||||
.o_footer_about_us {
|
||||
margin-bottom: $spacer;
|
||||
}
|
||||
} @else if o-website-value('footer-template') == 'links_address_logo' {
|
||||
&, p {
|
||||
text-align: center;
|
||||
}
|
||||
&, ul, .o_footer_address, .o_footer_logo {
|
||||
padding-top: $spacer;
|
||||
}
|
||||
li a {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Copyright
|
||||
.o_footer_copyright {
|
||||
padding: 8px;
|
||||
.js_language_selector {
|
||||
display: inline-block;
|
||||
}
|
||||
@include media-breakpoint-up(md) {
|
||||
.row {
|
||||
display: flex;
|
||||
> div {
|
||||
margin: auto 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Figure with special style
|
||||
.o_figure_relative_layout {
|
||||
position: relative;
|
||||
|
||||
@@ -449,6 +449,32 @@
|
||||
data-no-check="true"
|
||||
groups="website.group_website_designer">
|
||||
<we-colorpicker string="Background" data-customize-website-color="" data-color="footer"/>
|
||||
<we-select string="Footer Template" data-variable="footer-template" data-reload="/">
|
||||
<we-button id="option_template_footer_products_contacts_about_us"
|
||||
data-customize-website-views="website.footer_custom"
|
||||
data-customize-website-variable="products_contacts_about_us"
|
||||
string="Products - Contacts - About us"/>
|
||||
<we-button id="option_template_footer_logo_about_us_below"
|
||||
data-customize-website-views="website.template_footer_logo_about_us_below"
|
||||
data-customize-website-variable="logo_about_us_below"
|
||||
string="Logo - About us"/>
|
||||
<we-button id="option_template_footer_links_address_logo"
|
||||
data-customize-website-views="website.template_footer_links_address_logo"
|
||||
data-customize-website-variable="links_address_logo"
|
||||
string="Links - Address - Logo"/>
|
||||
<we-button id="option_template_footer_name_logo_links_about_us"
|
||||
data-customize-website-views="website.template_footer_name_logo_links_about_us"
|
||||
data-customize-website-variable="name_logo_links_about_us"
|
||||
string="Name - Logo - Links - About us"/>
|
||||
<we-button id="option_template_footer_logo_only"
|
||||
data-customize-website-views="website.template_footer_logo_only"
|
||||
data-customize-website-variable="logo_only"
|
||||
string="Logo only"/>
|
||||
<we-button id="option_template_footer_address_logo"
|
||||
data-customize-website-views="website.template_footer_address_logo"
|
||||
data-customize-website-variable="address_logo"
|
||||
string="Address - Logo"/>
|
||||
</we-select>
|
||||
</div>
|
||||
|
||||
<!-- Anchor Name -->
|
||||
|
||||
@@ -265,6 +265,7 @@
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<!-- Footer templates -->
|
||||
<template id="footer_custom" inherit_id="website.layout" name="Footer">
|
||||
<xpath expr="//div[@id='footer']" position="replace">
|
||||
<div id="footer" class="oe_structure oe_structure_solo" t-ignore="true" t-if="not no_footer">
|
||||
@@ -281,31 +282,155 @@
|
||||
<h5>Connect with us</h5>
|
||||
<ul class="list-unstyled">
|
||||
<li><a href="/contactus">Contact us</a></li>
|
||||
<li><i class="fa fa-phone"/> <span class="o_force_ltr" t-field="res_company.phone"/></li>
|
||||
<li><i class="fa fa-envelope"/> <span t-field="res_company.email"/></li>
|
||||
<li><i class="fa fa-phone fa-fw"/> <span class="o_force_ltr"><a href="tel:1 (650) 691-3277">1 (650) 691-3277</a></span></li>
|
||||
<li><i class="fa fa-envelope fa-fw"/> <span><a href="mailto:info@yourcompany.example.com">info@yourcompany.example.com</a></span></li>
|
||||
</ul>
|
||||
<p>
|
||||
<a t-if="website.social_facebook" t-att-href="website.social_facebook" class="btn btn-sm btn-link"><i class="fa fa-2x fa-facebook-square"/></a>
|
||||
<a t-if="website.social_twitter" t-att-href="website.social_twitter" class="btn btn-sm btn-link"><i class="fa fa-2x fa-twitter"/></a>
|
||||
<a t-if="website.social_linkedin" t-att-href="website.social_linkedin" class="btn btn-sm btn-link"><i class="fa fa-2x fa-linkedin"/></a>
|
||||
<a t-if="website.social_youtube" t-att-href="website.social_youtube" class="btn btn-sm btn-link"><i class="fa fa-2x fa-youtube-play"/></a>
|
||||
<a t-if="website.social_github" t-att-href="website.social_github" class="btn btn-sm btn-link"><i class="fa fa-2x fa-github"/></a>
|
||||
<a t-if="website.social_instagram" t-att-href="website.social_instagram" class="btn btn-sm btn-link"><i class="fa fa-2x fa-instagram"/></a>
|
||||
<p class="o_footer_social_media_links">
|
||||
<a href="/website/social/facebook" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-facebook-square"/></a>
|
||||
<a href="/website/social/twitter" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-twitter"/></a>
|
||||
<a href="/website/social/linkedin" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-linkedin"/></a>
|
||||
<a href="/website/social/youtube" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-youtube-play"/></a>
|
||||
<a href="/website/social/github" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-github"/></a>
|
||||
<a href="/website/social/instagram" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-instagram"/></a>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-lg-4">
|
||||
<h5>
|
||||
<span t-field="res_company.name"/>
|
||||
<small> - <a href="/aboutus">About us</a></small>
|
||||
</h5>
|
||||
<p>
|
||||
<div class="o_footer_about_us">
|
||||
<h5>
|
||||
<span>YourCompany</span>
|
||||
<small> - <a href="/aboutus">About us</a></small>
|
||||
</h5>
|
||||
<p>
|
||||
We are a team of passionate people whose goal is to improve everyone's
|
||||
life through disruptive products. We build great products to solve your
|
||||
business problems.
|
||||
</p>
|
||||
<p>
|
||||
Our products are designed for small to medium size companies willing to optimize
|
||||
their performance.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<!-- Logo - About us (below)-->
|
||||
<template id="template_footer_logo_about_us_below" inherit_id="website.layout" name="Template Footer Logo About Us Below" active="False">
|
||||
<xpath expr="//div[@id='footer']" position="replace">
|
||||
<div id="footer" class="oe_structure oe_structure_solo" t-ignore="true" t-if="not no_footer">
|
||||
<section class="s_text_block pt16 pb8">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-5 o_footer_logo">
|
||||
<a href="/" class="footer-brand logo">
|
||||
<img src="website/static/src/img/website_logo.png" class="img-fluid" aria-label="Logo of MyCompany" title="MyCompany" role="img" style="width: 50%;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-5">
|
||||
<div class="o_footer_about_us">
|
||||
<h5>
|
||||
<span>YourCompany</span>
|
||||
<small> - <a href="/aboutus">About us</a></small>
|
||||
</h5>
|
||||
<p>
|
||||
We are a team of passionate people whose goal is to improve everyone's
|
||||
life through disruptive products. We build great products to solve your
|
||||
business problems.
|
||||
</p>
|
||||
<p>
|
||||
Our products are designed for small to medium size companies willing to optimize
|
||||
their performance.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-lg-7 text-lg-right">
|
||||
<p class="o_footer_social_media_links text-lg-right">
|
||||
<a href="/website/social/facebook" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-facebook-square"/></a>
|
||||
<a href="/website/social/twitter" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-twitter"/></a>
|
||||
<a href="/website/social/linkedin" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-linkedin"/></a>
|
||||
<a href="/website/social/youtube" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-youtube-play"/></a>
|
||||
<a href="/website/social/github" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-github"/></a>
|
||||
<a href="/website/social/instagram" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-instagram"/></a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<!-- Links - Address - Logo-->
|
||||
<template id="template_footer_links_address_logo" inherit_id="website.layout" name="Template Footer Links Address Logo" active="False">
|
||||
<xpath expr="//div[@id='footer']" position="replace">
|
||||
<div id="footer" class="oe_structure oe_structure_solo" t-ignore="true" t-if="not no_footer">
|
||||
<section class="s_text_block pt16 pb8">
|
||||
<div class="container">
|
||||
<p class="o_footer_social_media_links">
|
||||
<a href="/website/social/facebook" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-facebook-square"/></a>
|
||||
<a href="/website/social/twitter" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-twitter"/></a>
|
||||
<a href="/website/social/linkedin" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-linkedin"/></a>
|
||||
<a href="/website/social/youtube" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-youtube-play"/></a>
|
||||
<a href="/website/social/github" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-github"/></a>
|
||||
<a href="/website/social/instagram" class="btn btn-sm btn-link" target="_blank"><i class="fa fa-2x fa-instagram"/></a>
|
||||
</p>
|
||||
<ul class="list-inline">
|
||||
<li class="list-inline-item"><a href="/">Home</a></li>
|
||||
<li class="list-inline-item"><a href="/contactus">Contact us</a></li>
|
||||
<li class="list-inline-item"><a href="/aboutus">About us</a></li>
|
||||
</ul>
|
||||
<div class="o_footer_address">
|
||||
250 Executive Park Blvd, Suite 3400<br/>San Francisco CA 94134<br/>United States
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="offset-md-3 col-md-6 o_footer_logo">
|
||||
<a href="/" class="footer-brand logo">
|
||||
<img src="website/static/src/img/website_logo.png" class="img-fluid" aria-label="Logo of MyCompany" title="MyCompany" role="img" style="width: 50%;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<!-- Website name - Logo - (below) Links - About us-->
|
||||
<template id="template_footer_name_logo_links_about_us" inherit_id="website.layout" name="Template Footer Name Logo Links About us" active="False">
|
||||
<xpath expr="//div[@id='footer']" position="replace">
|
||||
<div id="footer" class="oe_structure oe_structure_solo" t-ignore="true" t-if="not no_footer">
|
||||
<section class="s_text_block pt16 pb8">
|
||||
<div class="container">
|
||||
<div class="row mt-2 mb-4">
|
||||
<div class="col-lg-6 mb-3 mb-lg-0">
|
||||
<h3><a href="/" class="text-decoration-none">YourCompany</a></h3>
|
||||
</div>
|
||||
<div class="col-lg-6 o_footer_logo text-center text-lg-right">
|
||||
<a href="/" class="footer-brand logo">
|
||||
<img src="website/static/src/img/website_logo.png" class="img-fluid" aria-label="Logo of MyCompany" title="MyCompany" role="img" style="width: 50%;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<ul class="list-inline">
|
||||
<li class="list-inline-item"><a href="/">Home</a></li>
|
||||
<li class="list-inline-item"><a href="/contactus">Contact us</a></li>
|
||||
<li class="list-inline-item"><a href="/aboutus">About us</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-lg-6 text-lg-right">
|
||||
<p class="text-lg-right">
|
||||
We are a team of passionate people whose goal is to improve everyone's
|
||||
life through disruptive products. We build great products to solve your
|
||||
business problems.
|
||||
</p>
|
||||
<p>
|
||||
Our products are designed for small to medium size companies willing to optimize
|
||||
their performance.
|
||||
business problems. Our products are designed for small to medium size
|
||||
companies willing to optimize their performance.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@@ -315,6 +440,49 @@
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<!-- Logo only-->
|
||||
<template id="template_footer_logo_only" inherit_id="website.layout" name="Template Footer Logo Only" active="False">
|
||||
<xpath expr="//div[@id='footer']" position="replace">
|
||||
<div id="footer" class="oe_structure oe_structure_solo" t-ignore="true" t-if="not no_footer">
|
||||
<section class="s_text_block pt16 pb8">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="offset-md-3 col-md-6 o_footer_logo text-center my-3">
|
||||
<a href="/" class="footer-brand logo">
|
||||
<img src="website/static/src/img/website_logo.png" class="img-fluid" aria-label="Logo of MyCompany" title="MyCompany" role="img" style="width: 50%;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<!-- Address - Logo (below)-->
|
||||
<template id="template_footer_address_logo" inherit_id="website.layout" name="Template Footer Address Logo" active="False">
|
||||
<xpath expr="//div[@id='footer']" position="replace">
|
||||
<div id="footer" class="oe_structure oe_structure_solo" t-ignore="true" t-if="not no_footer">
|
||||
<section class="s_text_block pt16 pb8 text-center">
|
||||
<div class="container">
|
||||
<div class="m-4">
|
||||
YourCompany, 250 Executive Park Blvd, Suite 3400,<br/>
|
||||
San Francisco CA 94134, United States<br/>
|
||||
<a href="tel:+1 (650) 691-3277">+1 (650) 691-3277</a> - <a href="mailto:info@yourcompany.example.com">info@yourcompany.example.com</a>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="offset-lg-3 col-lg-6 o_footer_logo my-4">
|
||||
<a href="/" class="footer-brand logo">
|
||||
<img src="website/static/src/img/website_logo.png" class="img-fluid" aria-label="Logo of MyCompany" title="MyCompany" role="img" style="width: 50%;"/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
<template id="cookies_bar" inherit_id="website.footer_custom" name="Cookies Bar">
|
||||
<xpath expr="//div[@id='footer']" position="before">
|
||||
<div id="website_cookies_bar" t-if="website.cookies_bar" class="s_popup o_snippet_invisible" data-name="Cookies Bar">
|
||||
|
||||
Reference in New Issue
Block a user