Navigation
Archive / How can I remove the navigation from blog?
This is archived content. Visit our new forum.
1 2
  • Author
    Posts
  • June 30, 2014 at 6:37 am #63018

    Jens P
    Participant

    hey,

    I have a one-page webpage built as page, but I need a blogpage for news too. So I set in the main-menu a page for posts. That’s all fine, all example posts are in but I don’t need the menu on top and in the footer, because it will only work on the static one-page.
    With the custom css from the visual composer I tried to set on the blogpage a display:none for the navbar and the menu in the footer with `.x-navbar{visibility: hidden; display: none;}
    .x-nav{visibility: hidden; display: none;}`It works, But all posts are not shown because wordpress loose the settings to take this page as blogpage. that’s totally weired.
    When I safe all settings which page should use as blogpage again, the blogpage works with all example posts, but it shows the menu in the top and the menu in the footer again.

    How can I set a display none for the menu only for the blogpage with the news? I tried this in the customer css but it is wrong:

    
blog .x-navbar{visibility: hidden; display: none;} 
blog .x-nav{visibility: hidden; display: none;}

    Can you please help to fix it?

    Best

    jens

    June 30, 2014 at 1:01 pm #63180

    Kosher K
    Member

    Hi Jens,

    Thanks for writing in,

    Can you please provide URL to your site for us to advise accordingly,

    Cheers

    June 30, 2014 at 1:51 pm #63209

    Jens P
    Participant
    This reply has been marked as private.
    July 1, 2014 at 8:33 am #63543

    Zeshan
    Member

    Hi Jens,

    Thank you for dropping by!

    It seems that the CSS you have added to Customizer > Custom > CSS is wrong. “blog” is the class the <body> tag. A class always starts with a period “.” sign in CSS. So the updated code would be:

    .blog .x-navbar{visibility: hidden; display: none;} 
.blog .x-nav{visibility: hidden; display: none;}

    I have also added this styling. So the issue should be fixed now 🙂

    Hope this helps. Please let us know if you still face any issue, we will be happy to assist.

    Thank you

    July 2, 2014 at 11:11 am #64064

    Jens P
    Participant

    Hey Support, thanks for your help. It’s perfect now 🙂

    J.

    July 3, 2014 at 1:04 am #64415

    Christian
    Moderator

    You’re welcome Jens.

    July 17, 2014 at 11:31 pm #70464

    Broderick
    Participant

    Sorry to hijack this thread, but how would you remove the top navigation, but leave the footer navigation?

    July 17, 2014 at 11:31 pm #70465

    Broderick
    Participant

    .blog .x-nav{visibility: hidden; display: none;}

    Removes both

    July 18, 2014 at 1:26 pm #70682

    Zeshan
    Member

    Hi Paula,

    Thank you for writing in!

    Simply add the following CSS code instead of the one provided above:

    .blog header .x-navbar,
.blog header .x-nav {visibility: hidden; display: none;}

    It should hide only the top navbar.

    Hope this helps. 🙂

    Thank you.

    April 1, 2016 at 5:52 am #862391

    lingqlee
    Participant
    This reply has been marked as private.
    April 1, 2016 at 2:35 pm #862995

    Darshana
    Moderator

    Hi there,

    In that case, you could try an external plugin like Menu Swapper (http://wordpress.org/plugins/menu-swapper/) which allows you to specify menu per page/post basis. Check it’s video in it’s plugin description page to get started.

    Thanks!

    April 2, 2016 at 5:18 am #863656

    lingqlee
    Participant
    This reply has been marked as private.
    April 2, 2016 at 9:04 pm #864206

    Rue Nel
    Moderator

    Hello There,

    Upon checking, you are already using this code to remove navbar in the blog page;

    .blog header .x-navbar, 
.blog header .x-nav {
    visibility: hidden;
    display: none;
}

    1] For individual or single post, you use this code:

    .single-post header .x-navbar, 
.single-post header .x-nav {
    visibility: hidden;
    display: none;
}

    2] For case studies page, you need to use this:

    .page-template-template-layout-portfolio header .x-navbar, 
.page-template-template-layout-portfolio header .x-nav {
    visibility: hidden;
    display: none;
}

    And for single portfolio page, you need this code;

    .single-x-portfolio header .x-navbar, 
.single-x-portfolio header .x-nav {
    visibility: hidden;
    display: none;
}

    Hope this would help you.

    May 18, 2016 at 3:18 am #996949

    lingqlee
    Participant
    This reply has been marked as private.
    May 18, 2016 at 3:27 am #996956

    Christopher
    Moderator

    Hi there,

    Please add following code in Customize -> Custom -> CSS :

    .category-new .x-navbar,.category-popular .x-navbar,.category-news .x-navbar,.category-new .x-colophon.bottom,.category-popular .x-colophon.bottom,.category-news .x-colophon.bottom{

display:none;
}

    Hope it helps.

  • Author
    Posts
1 2