How to Hide the Home Page (or 1st Menu Item) Using Custom CSS in PhotoBiz

How to Hide the Home Page or First Menu Item Using Custom CSS in PhotoBiz

Overview

This guide explains how to hide the Home page, or the first item in your website navigation menu, using Custom CSS in the PhotoBiz Website Builder. This is helpful if you want visitors to land on your Home page when they type your website address, but you do not want Home to appear as a menu item in your site navigation.

After you add this CSS, the first navigation item will be hidden from your menu. The page itself is not deleted, and the page URL does not change. Visitors can still reach your Home page by typing your website address directly or by clicking your logo if your logo is linked to the homepage.

This setup is commonly used when you want a cleaner menu, such as About, Portfolio, Blog, and Contact, while keeping the Home page as the main landing page for your website.

Prerequisites

Before you begin, make sure:

You have access to the PhotoBiz Website Builder
Your website has already been created and is editable
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 snippet of CSS

STEP ONE

STEP TWO

Open your global design settings.

In the Website Builder, click DESIGN at the top center of the control panel.

Then click EDIT DESIGN SETTINGS to access your global design settings.

In the right-side panel, click Global CSS/JS. This section lets you add custom code that applies across your entire website.

STEP THREE

Add the custom CSS to hide the first menu item.

Paste the following code into the CSS field:

Copy & Paste Code:

<style>
.main-nav__item.grid__cell:nth-child(1) {
    display: none;
}
</style>

This CSS targets the first item in your main navigation menu and hides it from view across your website. In most cases, this is the Home page if it is listed first in your menu.

FINAL STEP

Click Save to store your changes.

Once saved, the first menu item will no longer be visible in your website navigation. Your homepage will still exist, and visitors can still access it when they go to your main website address.

Additional Options or Helpful Notes

This method hides the first menu item visually but does not delete the page.
The page URL remains active.
This code applies site-wide because it is added to Global CSS/JS.
If a different page is listed first in your navigation menu, that page will be hidden instead.
To hide the Home page specifically, make sure Home is the first item in your navigation menu before using this CSS.
This code only affects the main navigation menu item. It does not remove buttons, links, or other areas of your website that may link to the page.
Visitors can still reach the hidden page by typing the page URL directly.
If your logo is linked to your homepage, visitors can still click your logo to return to the Home page after visiting another page on your site.

Troubleshooting or FAQs

The Home page still appears in the menu

Clear your browser cache and refresh the page. Then confirm the code is saved in the Global CSS/JS section and that there are no typos in the CSS.

The wrong menu item is hidden

This CSS hides the first item in your navigation menu. If the wrong item is hidden, review your navigation order and move the page you want to hide into the first position.

Can visitors still access the Home page?

Yes. This CSS only hides the menu item. Your homepage is still active and will still load when visitors go to your main website address.

Does this delete the page?

No. The page remains in your Website Builder. The CSS only hides the first navigation item from view.

How to Hide the Logo Section Using Custom CSS in PhotoBiz

January 16, 2026

How to Hide View Previous & Next Post in Blog Posts Using CSS

March 5, 2026

How to Increase The Height of Story Panel Using CSS

March 5, 2026

How To Add Custom CSS To The Website

September 4, 2025