I’m using the standard twenty sexteen theme, altering the css I managed to reposition logo and menus, but I’m not able to deal with the footer.
At the moment I’ve hidden the standard wp footer {the one that says that the site was made in wordpress}, but I’m struggling to find a way to add a professional footer for the page.
I’m using elementor basic as a page builder… most of the tutorials focus on how to create a footer using elementor por, but is there another way? At the moment I’m not swimming in gold, and I have to work with what I have…
Do you know a link, tutorial, page or other resources where I can learn exactly how to deal with footers?
If you had a second top write in here and share your knowledge I’d be greatful ??
Thank you for your help
]]>I saw some tutorials where they use plugins, others where they use widgets… I was thinking to create a div and including what I need… But at the moment I have hidden using the CSS the ‘powered by’ sentence that appears in the small footer of the twenty sexteen theme…
This is mainly the question… Should I alter that footer (maybe using some new files in the child theme)? And in that case how can I include widgets and plugins (for example the social media icons)?
Thank you and forgive me for the lots of questions… I tried to summarize as much as I could.
]]>The page will also be multilanguage, and for this reason the footer should be multilanguage too.
For now the solution I found is to design a new page with Elementor Basic {just the footer}, show the page and copy the resulting html code.
Paste the code into the child theme footer in order to show it on all the pages.
Problem #1: The footer requires additional tweaks as some of the elements will lose the style… for this reason I’ll have to add a class and define it as !important or the tweaks will not be visible.
Problem #2: The widget will not be multy language… Polylang will not translate the it as it will be integrated into the bottom informations of the page.
Do you have another idea on how I can place a footer on the page?
You can come back to me saying that being a landing page I could place the footer directly on the bottom of the page using Elementor, but I’m soon planning to add a blog section where my client will be able to post short curiosity about the B&b so the footer should be applied to all pages.
Thank you for your help guys!
]]>What I came out with is adding custom html to the widget of the footer, creasting two versions {one for the italian and another for the english}.
Problem will be that any alteration to the footer will have to be don “hard coding” changing the html code written.
I’m using basic elementor as page builder {that doesn’t include footers}.
The advantage is that I can chose what widget to use and in this way not caring too much about polylang.
Do you think this is a good solution? I’m writing here also to get a little of self confidence as this solution seems quite tricky.
Thank you for your help guys!
]]>Basically seen that with Elementor basic it isn’t possible to customise the footer I decided to hard coding it and include into the footer widget of the theme I’m using… Big problem everything is wrapped into small divs and I have no idea ho wo make it work properly…
I tried to write html and css and include them (html into the “insert html” widget inside of the footer widget, and css into the style css of the child theme).
The result is weird as I got two small bars (I wrote it full width).
Because of this, hard codin it is out of discussion ??
Do you have better ideas on how to insert a footer?
FYI this are html and css of the footer
HTML:
<!DOCTYPE html>
<html>
<head>
<title>Footer</title>
<link rel="stylesheet" type="text/css" href="footer.css">
</head>
<body>
<div class="contenitore larg-piena">
<div class="footer-cont1 larg-piena">
<div class="larg-int">
<span class="testo-norm">Prova1</span>
</div>
</div>
<div class="footer-cont2 larg-piena">
<div class="larg-int">
<span class="testo-norm">Copyright - B&b Cinque Teste | All Rights Reserved</span>
</div>
</div>
</div>
</body>
</html>CSS:
body{
margin: 0px;
}
.footer-cont1{
background: #444;
}
.footer-cont2{
background-color: #000;
}
.larg-piena{
width: 100%;
}
.testo-norm{
color: white;
font-family: "Roboto", Sans-serif;
font-weight: 400;
font-size: small;
}
.larg-int{
width: 1140px;
margin: auto;
padding: 5px 0px 5px 0px;
}I finally found a solution that works!!!!! YEEE!!!
Basically I installed the “Header and Footer Elementor” Plugin that allows you to create custom header and footer.
Now the problem is that the plugin just works on 5 themes… but here is the magic… I found a nice article that allows you to alter the header.php and footer.php files in order to activatew this plugin.
In my very case all I wanted was to use it as a footer, so I just changed the footer.php file… BUT IT WORKS!!!
If you had similar problems the link to the documentation is
https://github.com/Nikschavan/header-footer-elementor/wiki/Add-support-to-Header-Footer-Elementor-from-the-Child-Theme
I hope this will help someone else in may same situation.
I’m considering to buy the full version of Elementor as I find it quite handy… but before doing it I prefer to create my landing page with what I have and then decide.
Thank you very much for your help! You are precious!!!!
]]>