How to Hide the Home Page or First Menu Item Using Custom CSS in Zibster
Overview
This guide explains how to hide the Home page, or the first item in your website navigation menu, using Custom CSS in the Zibster Website Builder. This is useful when you want visitors to land on your Home page from your main website address without displaying Home as an option in your navigation menu.
Adding this CSS only hides the first navigation item. It does not delete the page or change its URL. Visitors can still access your Home page by entering your main website address or by clicking your logo if the logo is linked to your homepage.
There are two CSS options: one for standard navigation menus and one for split navigation menus where the logo appears between two groups of menu items.
Prerequisites
Before you begin, make sure:
- You have access to your Zibster Website Builder.
- Your website has already been created.
- The page or menu item you want to hide is the first item in your navigation menu.
- You are comfortable copying and pasting a short CSS snippet.
STEP ONE:
Log in to your Zibster account and click WEBSITE in the left-side menu.
This opens the Website Builder, where you can manage your website pages, content, and design settings.
STEP TWO:
Click DESIGN at the top center of the Website Builder.
STEP THREE
Click EDIT DESIGN SETTINGS to open your global design settings.
STEP FOUR
In the right-side panel, click Global CSS/JS.
The Global CSS/JS section allows you to add custom code that applies across your entire Zibster website.
STEP FIVE
Add the Custom CSS that matches your website's navigation style.
Use the regular menu CSS if your website uses a standard navigation menu. Use the split menu CSS if your logo appears between two groups of navigation items.
Using the correct version is important. If you add the regular menu CSS to a split menu design, it may hide the first menu item on both sides of the logo.
FINAL STEP
Click Save Changes to save your changes.
After saving, view your live website and confirm that the first navigation item is no longer displayed.
The page itself remains active. If you are hiding the Home menu item, visitors can still reach your homepage by entering your main website address or by clicking your logo when the logo is linked to the homepage.
Additional Options and Helpful Notes
- This method hides the first navigation item visually. It does not delete or disable the page.
- The page URL remains active and can still be accessed directly.
- Because the code is added to CSS/JS, the change applies throughout your website.
- The CSS targets the first item in the navigation menu. If another page is listed first, that page will be hidden instead.
- To hide the Home menu item specifically, make sure Home is the first item in your navigation before adding the CSS.
- This CSS only affects the main navigation menu item. It does not remove buttons, text links, or other website elements that link to the page.
- If your logo is linked to your homepage, visitors can continue using the logo to return to the Home page.
- If your website uses a split navigation menu, use only the split menu CSS. The regular menu CSS may hide the first navigation item on both sides of the logo.
- Custom CSS can be affected by future website design or platform updates. If the navigation changes unexpectedly, review or remove the custom CSS and test your website again.
Troubleshooting and FAQs
The Home page still appears in my navigation
Confirm that the CSS has been added to Global CSS/JS and that you clicked Save after adding it.
Also confirm that Home is the first item in your navigation menu and that you are using the CSS version that matches your navigation style.
If the live website still displays the item, refresh the page or clear your browser cache before testing again.
The wrong navigation item is hidden
The CSS targets the first item in your navigation menu, not a specific page name.
Review the order of your navigation items and make sure the page you want to hide is listed first.
The first navigation item on both sides of my logo disappeared
Your website may be using a split navigation menu with the regular menu CSS.
Remove the regular menu CSS and replace it with the split menu version.
Can visitors still access the hidden Home page?
Yes. The CSS only hides the navigation menu item. Your homepage remains active and will continue to load when visitors go to your main website address.
Visitors may also be able to access the page through other links on your website.
Does this CSS delete the page?
No. The page remains in your Zibster Website Builder. The CSS only prevents the first navigation item from being displayed in the main website menu.
What happens if I change the order of my navigation menu?
Because the CSS targets the first navigation item, whichever item is moved into the first position will become hidden.
If you want Home to remain hidden, keep Home as the first item in your navigation menu.
Need Help?
Zibster Support Hours: Monday–Friday, 9am–6pm EST
Phone: 844.353.3412
Channels: Phone, Live Chat, Support Ticket
