Browse By

Guide: Hide or Remove WordPress menu from a single landing page

You may be thinking of building a dedicated landing page for a new business product or to collect email addresses for a free giveaway. A landing page can be very effective in increasing conversions.

Links can be distracting and can often reduce conversion rates. An effective way of building landing pages is to reduce the number of links on the page that takes users to other pages away from your goal.

Wordpress | Contact Form 7 | Navigation Menu Dashboard

Step 1 – Find the page ID

All pages in WordPress have a unique ID. When you first create the page, this ID is generated in the background. In order to view this ID, save the page as a draft, go to all pages and click on edit. It will be displayed in the URL bar of your web browser and looks something like this. If your page is already created all you have to do is edit it to see the ID.

We may earn a small commision at no extra cost to you if you sign up.

http:/yoursite.com/wp-admin/post.php?post=2&action=edit

Step 2 – Get navigation menu bar CSS attribute or ID

You menu will have a CSS attribute and is different based on the theme you are using. In order to find it, right-click on any menu item and look for the <nav> element. within this element you will have a (class=”menuclass”). This will typically be your CSS attribute. You can also use the ID attribute to hide the menu.

Step 3 – Hide menu

In your CSS editor or through the Simple Custom CSS plugin simply use the CSS attribute or ID and add the ‘display: none’ piece of code and there you have it: it will look something like this:

.page-id-2 .site-navigation .primary-navigation{ 

display: none; 

}

Read Next:

You may also like

Leave a Reply

Your email address will not be published. Required fields are marked *