Okay
  Public Ticket #341439
Menu Color and logo different on homepage.
Closed

Comments

  • saad started the conversation
    December 26, 2014 at 12:30pm

    Hello Sir, 

    I would like to change the color of my menu (font color), but just on the homepage, would like to keep as is for rest of the pages. May i please have the css to make that happen?

    Same help with the logo. Would like the css/php edit to have different logo on the homepage. This is for transparent headers as well. 

    Thank You!

  •  8,992
    Tahir replied
    December 26, 2014 at 4:56pm

    Hey!

    Can you provide the site url as well as the other logo url so i can write up custom css .

    Thanks

    ThemeNectar Support Team 

  •   saad replied privately
  •  8,992
    Tahir replied
    December 29, 2015 at 1:59pm

    Hey Again!

    Add this into the Custom CSS box located in your Salient Options panel :
    .home #header-outer[data-transparent-header="true"].transparent #logo img.dark-version {
    opacity: 1 !important;
}


.home #header-outer[data-transparent-header="true"].transparent #logo img {
    opacity: 0 !important;
}


.home #header-outer.transparent header#top nav > ul > li > a {
    color: #1EA6A5 !important;
}
    Thanks 

    ThemeNectar Support Team 

  • saad replied
    December 30, 2015 at 4:56am

    Thank You!

  • Davide replied
    April 5, 2016 at 6:31pm

    Hi,
    I have try to use this css for a article page, but don't work...
    I'd like to change the logo url (dark version) in the follow page:

    http://www.irealizzabili.it/ciotola-fiore-in-ceramica/

    Can u help me please?
    Thx

    Davide

  •  8,992
    Tahir replied
    April 6, 2016 at 11:23pm

    Hey ,

    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

    .postid-1672 #header-outer:not([data-lhe="animated_underline"]) header#top #logo img.dark-version {
    opacity: 1 !important;
}


.postid-1672 #header-outer:not([data-lhe="animated_underline"]) header#top #logo img {
    opacity: 0 !important;
}


.postid-1672 #header-outer.transparent header#top nav > ul > li > a {
    color: #1EA6A5 !important;
}

    Best.

    ThemeNectar Support Team 

  • Davide replied
    April 7, 2016 at 10:37am

    Hi,
    i have found the CSS to customization the single header page:

    <code>

    #header-outer:not([data-lhe="animated_underline"]) header#top nav ul li.menu-item a,
    #header-outer:not([data-lhe="animated_underline"]) header#top nav ul li.menu-item a:active,
    #header-outer:not([data-lhe="animated_underline"]) header#top nav ul li.menu-item a:hover {
        color: #ffffff!important;
        text-shadow: -1px 1px 5px rgba(61, 61, 61, 0.75)!important;
    }
    #header-outer:not([data-lhe="animated_underline"]) header#top nav ul li.current-menu-item > a {
        color: #ffffff!important;
        font-weight: 500!important;
        text-shadow: -1px 1px 5px rgba(61, 61, 61, 0.75)!important;
    }
    #header-outer:not([data-lhe="animated_underline"]) header#top nav ul #search-btn a span.icon-salient-search {
        color: #ffffff!important;
        text-shadow: -1px 1px 5px rgba(61, 61, 61, 0.75)!important;
    }
    #header-outer:not([data-lhe="animated_underline"]) header#top nav .sf-menu li .sub-menu {
        background-color: rgba(255, 255, 255, 0.85)!important;
    box-shadow: none!important;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -o-box-shadow: none;
    text-shadow: none!important;
    }
    #header-outer:not([data-lhe="animated_underline"]) header#top nav .sf-menu li .sub-menu li a {
        background-color: rgba(255, 255, 255, 0.0)!important;
        color: #c13128!important;
    }
    #header-outer:not([data-lhe="animated_underline"]) header#top nav .sf-menu li .sub-menu li a:hover {
        color: #6c1110!important;
    }

    /* Change logo */
    #header-outer:not([data-lhe="animated_underline"]) header#top #logo img.dark-version {
        opacity: 0 !important;
    }
    #header-outer:not([data-lhe="animated_underline"]) header#top #logo img {
        opacity: 1 !important;
    }

    /* Change Hight Title */
    .section-title h1.entry-title {
    margin-top: 0px;
    text-shadow: -3px 3px 13px rgba(61, 61, 61, 0.75)!important;
    }

    </code>