Hostinger

A header is the uppermost section of your website. It can also be called a menu bar, a navigation menu, or similar. 

If you can't see the header section in Hostinger Website Builder, all your website pages are likely <a href="https://support.hostinger.com/en/articles/6456821-website-builder-hiding-a-page-from-the-menu-bar">hidden from the navigation menu</a> 💡

Click on the header section to reveal its settings:

The header section settings in Hostinger Website Builder

<a href="#h_75aaf978bd">Edit header</a>

<a href="#h_553f54d3f2">Edit navigation</a>

<a href="#h_98a3110c9e">Edit shopping bag</a> — this option is visible only after <a href="https://support.hostinger.com/en/articles/6538318-website-builder-how-to-enable-e-commerce-features-on-your-website">enabling the eCommerce platform</a> on your site

<a href="#h_f001a45901">Edit styles</a>

1. <a href="#h_75aaf978bd">Edit header</a>
2. <a href="#h_553f54d3f2">Edit navigation</a>
3. <a href="#h_98a3110c9e">Edit shopping bag</a> — this option is visible only after <a href="https://support.hostinger.com/en/articles/6538318-website-builder-how-to-enable-e-commerce-features-on-your-website">enabling the eCommerce platform</a> on your site
4. <a href="#h_f001a45901">Edit styles</a>

And that's it! Now you know how to personalize the appearance of your website's header section 😊 

Learn about customizing your website's header section

Website Builder: How to Customize the Style of the Navigation Menu

Tutorials

Tutorial

Pamokos

Tutoriais

Tutoriales

Уроки

Tutoriels

Blog

Tinklaraštis

Блог

Pricing

Harga

Planai

Preços

Precios

Прайс

Tarifs

Hostinger Academy

YouTube

Academia Hostinger

L'Académie Hostinger

Instagram

Find answers and get help from Intercom Support and Community Experts

Empty Help Center

Uh oh. That page doesn’t exist.

Disappointed

Neutral

Smiley

Title

Track the progress of all tickets related to your company.

Tickets portal.

{assigneeName} needs more information from you

Edit header	Click on Edit header to customize the following: Layout: Make header sticky: this way, the menu bar will always be pinned at the top of the page and is visible to users even when they scroll down the page Element spacing Link spacing Menu layout Padding: change the top/bottom padding (height) of the header Logo — show, hide, or replace the logo, and change its size Style — change the style of the header or social icons
Edit navigation	Click on the header section and then on the Edit navigation icon: it'll expand the Pages and navigation panel on the left. Here, you can add, rename, sort, hide, or remove menu items.
Edit shopping bag	Click on the header section, and then click on the shopping bag icon. Here, you can enable or disable the shopping bag, as well as change its title and size. NOTE: This option is visible only after enabling the eCommerce platform on your site
Edit styles	Here, you can change the style of the following (choose from the dropdown): Header: Header background color Transparent header: if you make the header transparent, it inherits the background of the below section Text font Text color: you can set two colors — regular and hover To change the header text size, go to the global text style settings 💡 Button: Allow adding buttons to the header and customizing them Social icons: The toggle button to enable social media icons in the header Add new links to your profiles on various social media platforms Icon size Icon color: you can set two colors — regular and hover Learn more: How to Add Social Media Icons 💡