-
Posts
-
Depending on the page of the website that I’m creating, the white space below the footer looks different on each page because the footer is not attached to the bottom, and the position it depends on the quantity of the content and the screen size.
There is any way to fix this and make it completely responsive, attached to the bottom of the page like on this website: https://www.wgm-arch.com?
Any help would be appreciated.
Credentials below in case you need it.
Thank you.
Cheers,
Alexia.Hey Alexia R.,
Could you please enable the Advanced Layout Builder debug mode. Here is how to do it:
Best regards,
VictoriaHello Victoria,
I’m so sorry but I cannot find were or under what category I have to enable the Advanced layout Builder. I checked in all the Theme Options.
Thank you.
Cheers,
Alexia.Hi,
The advance layout builder is enabled by default. Victoria is asking if you could set it to debug mode. Please review the documentation. I wasn’t able to check the page properly because of my connection but maybe you could set the “socket” or “footer” container position to “fixed”.
#footer { position: fixed; bottom: 0; width: 100%; }Add the css code in the Enfold > General Styling > Quick CSS field.
Best regards,
IsmaelHi Ismael,
I read the documentation about how to enable the Advanced Layout Builder debug mode and I have to add a code to theme functions.php, but I have no technical skills at all.
I added the code you sent me for the fix footer but it is not working.
Any other ideas?
Thank you.
Cheers,
Alexia.Update:
Hello Ismael or Victoria,
I enabled the Advanced Layout Builder debug mode as you suggested it.
Could you please now take a closer look? The code for the fixed footer does not work for me.
Thank you.
Regards,
Alexia.Hi Alexia,
The thing is that the section with the page as a footer does not get the footer class or id and it gets different IDs on every page and so there is no one rule css to solve the issue. You can add that id on the footer page to the color section and maybe we could try to come up with the solution. Or just add some hr elements to other pages to push the footer down.
Best regards,
VictoriaGood afternoon Victoria,
Thanks for contacting me. About your explanation I’m so sorry but I thing I do not understand what I have to do to fix the footer, so maybe I’m wrong but I added the code below, in to the Section ID, on the footer page, but does not work and I cannot have a fixed footer. Any other ideas?
#footer {
position: fixed;
bottom: 0;
width: 100%;
}
Thank you again.
Regards,
Alexia.Hi,
Thanks for the update. We applied the correct ID to the section. Please remove browse cache prior to checking the page.
Best regards,
IsmaelHi,
Thanks for the update. We applied the correct ID to the section. Please remove browse cache prior to checking the page.
Best regards,
IsmaelHello Ismael,
After the ID to the section, some pages look different than others, with the content overwritten the footer, and others with more white space etc.
Also, If for some reason my client decided no to have a fixed footer after all of this, how can I go back?Thank you so much for your help.
Regards,
Alexia.Hi,
Thanks for the update. Please provide a link to the pages with that issue. We may need to apply a bottom padding to the main content container. If you want to revert the modifications, just remove the #custom-footer css code from the Quick CSS field.
Best regards,
IsmaelHello Ismael,
These are the pages were the issues are:
http://bayeng.wordpress.pratbcn.com (on this page it is a big white space at the bottom very noticeable in large screens)
http://bayeng.wordpress.pratbcn.com/about-us/
http://bayeng.wordpress.pratbcn.com/executive-team/
http://bayeng.wordpress.pratbcn.com/clients-and-projects/
http://bayeng.wordpress.pratbcn.com/leed/
http://bayeng.wordpress.pratbcn.com/awards/
http://bayeng.wordpress.pratbcn.com/resources/Thank you.
Regards,
Alexia.
- You must be logged in to reply to this topic.