Why site header is important
The website header is located at the top of the page and contains important elements such as the website logo, navigation menu, and social media icons. It is usually the first thing that visitors see when they land on a webpage and provides them with a sense of familiarity and navigation.
Navigation
The website header is crucial for navigation and ease of use for visitors. By having a consistent header on each page, visitors can easily navigate to different sections of the website without getting lost. The navigation menu lets visitors quickly find what they are looking for, whether it be FAQs, services, or information. This saves visitors time and effort and ultimately improves their experience on your website.
Components of the site menu
Durable websites' header menu consists of main 4 areas.
Social media icons
Website title & logo
Menu
Buttons
How to edit the header menu
Social media icons
Please see this help centre document: Add social media icons on your site
Site name
Go to Website > Edit website.
Click the "..." and "Edit website header" buttons in the header section.
Change the website title, and click "Edit" to change the site name.
Click "Save" in the top bar.
Logo
Go to Website > Edit website.
Click the "..." and "Edit website header" buttons in the header section.
Click "Edit" in the Logo section.
If you want to use your own image as your logo:
Click the "Image" tab.
Choose the source. You can choose "Branding" if you already have uploaded the logo through the Brand section. You can also upload your logo image here by choosing "Upload file."
Click "Save" in the top bar.
If you want to manage your website's branding, please see this help document: Add a logo to your site.
If you want to use Text + Icon
Click the "Text + Icon" tab.
Enable Text and/or image toggles as needed.
Choose the font from the dropdown menu, or click regenerate to let AI pick the font.
Click "Replace" on the image to choose the image yourself, or click "Regenerate" to let AI pick the image.
Click "Save" in the top bar when you are happy with the logo.
Buttons
Please see this help centre document: Add buttons to your site.
Menu style
To customize the menu positioning, sticky header, and navigation style.
Go to Website > Edit website.
Click the "..." and "Edit website header" buttons in the header section.
Click the "Style" tab in the settings panel.
a. Color: See this page to change the site color.
b. Button style: See this page to change the button style.
c. Positioning: This will change the position of the elements within the header.
d. Show home link: Show a link to the home page in the main navigation.
e. Menu (only shows up when you have multiple pages): changes the menu alignment.
f. Navigation style: This will change the highlight style of the page when site visitors click on each menu.
g. Full width: shows the menu full width when seen on desktop
h. Sticky: Keep the header at the top of the scroll.
i. Spacing: this controls the space between the top and bottom.
Click "Save" in the top bar.
The website header is a vital element for any website. Not only does it help visitors navigate and find what they are looking for, but it also aids in branding, recognition, and SEO. For these reasons, it is essential to dedicate time and effort to creating a well-designed and functional website header for your website.