Skip to main content

Hostinger Website Builder: How to Hide the Header Section From Specific Pages

Learn how to hide the header section from particular website pages in Hostinger Website Builder

Updated yesterday

If you use Hostinger Website Builder and want to hide the menu section from some particular pages, check the information below 👇

The header section is the topmost section of a website that contains your website's menu:

The header section in Hostinger Website Builder

By default, the header section is visible on all your website pages. To hide the header section from a particular page, follow these steps:

  1. Copy the code below

  2. Paste the customized code into the Custom code field in your website's integrations settings

Code

<script>
setInterval(() => {
if (window.location.pathname === '/page-title') {
document.querySelector('header').style.display = "none";
}
else {
document.querySelector('header').style.display = "grid";
}
}, 50);
</script>

Customize the Code

To specify the page to hide the header from, replace page-title with the slug of your page here:

if (window.location.pathname === '/page-title')

For example, if you want to hide the header section from your About page, the URL of which is https://domain.tld/about, the code would look like this:

if (window.location.pathname === '/about')


If you'd like to disable the header on multiple pages, edit the line this way:

if (window.location.pathname === '/about' || window.location.pathname === '/contacts' || window.location.pathname === '/faq')

In other words, if you need to disable the header on multiple pages, use || symbols, copy the phrase window.location.pathname === '/about' and specify the slugs of your pages.

Did this answer your question?