[Support request] Different navigation colors

Home Forums Support [Support request] Different navigation colors

Home Forums Support Different navigation colors

  • This topic has 9 replies, 2 voices, and was last updated 5 years ago by Leo.
Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #852671
    Jana

    Hi – how do I make the front page primary navigation color different from the rest of the site? Thanks.

    #852922
    Leo
    Staff
    Customer Support

    Hi there,

    I’m assuming you are wanting to merge the site header with the content?

    If so try our header element as it will allow to set a specific navigation/header color for that page hero:
    https://docs.generatepress.com/article/transparent-header-and-navigation/

    Let me know if this helps πŸ™‚

    #852928
    Jana

    No, on these pages I don’t want to merge the site header. Just want to change the colors of the primary navigation content.

    #852931
    Leo
    Staff
    Customer Support

    Can you link me to the page in question?

    #852936
    Jana

    Sure, any page from the home page:
    http://69.89.27.245/~animama7/test
    Thanks, Jana

    #852947
    Leo
    Staff
    Customer Support

    So the home is what I meant by merged, which you can replicate using the method I linked above and switch the navigation color for just that page/header element.

    Then the navigation color for the rest of the pages can use the settings from the customizer.

    Let me know if this makes sense πŸ™‚

    #852987
    Jana

    I totally getting this more! But I can’t find a place for the Sub-menu items in the elements so they don’t change with customize.

    Also, is there a downside to me using a child theme – I thought it was a safety measure.

    #853017
    Leo
    Staff
    Customer Support

    Generally people try to avoid using transparent background for the submenu.

    You can find all the CSS here:
    https://docs.generatepress.com/article/changing-navigation-colors/

    Just add .header-wrap in front so that it only applied to the merged header.

    Example:

    /* SUB-NAVIGATION */
    
    .header-wrap .main-navigation .main-nav ul ul li a {
    	background: #222222;
    	color: #FFFFFF;
    }
    #853773
    Jana

    Hi – why would you try to avoid using transparent background for the submenu?

    I tried this but it’s not working for me – I’m using a revolution slider as a hero so here’s what my code looks like in the header element:
    [rev_slider alias=”breaking-news”]

    Thanks!

    #853901
    Leo
    Staff
    Customer Support

    Your site is under coming soon page so I can’t see.

    Can you unlock it with the CSS above added?

    Let me know πŸ™‚

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.