When the maintenance mode page in Elementor is active, I used to encounter an issue where the header and footer of the website would show up, despite the maintenance mode being active. This is something that I didn’t want to happen, as the pages in the header and footer wouldn’t link anywhere, which would confuse a user visiting the website. I used to use some CSS to hide the header and footer, and it used to frustrate me that these were not hidden by default when the maintenance mode page was active, or that there was not an easy option to hide them too. That was until I discovered there is an option to hide them, but it is slightly hidden.
In this video, I demonstrate how to hide the header and footer while the maintenance mode page is active, without the need for any custom code.