Title Bar

Hi there,

I am wondering whether could make the header_title bar in different colour and also when scrolling down, it wouldn't disappear.

Like what it works in this website: https://www.wxblockchain.com/index.html#/home

our webisite is now like this: http://www.mingie.cn/ using Busiprof Child.

Is is possible based on the template? thanks in advance.

Comments

  • attach
    example.png
    414K
  • Hi, @nadiali

    Thanks for contacting us.

    To change the header color please Go to Appearance >> Customize >> General settings >> Custom CSS and add the given below custom CSS code.

    .navbar {
        background-color: #161f65 !important;
    }
    .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover {
    color: #fff !important;
    }
    .navbar-default .navbar-nav > li > a {
     color: #fff !important;
    }
    .navbar .navbar-nav > li > a:hover, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover {
    background-color: #5e6282 !important;
    }

    Change color code value according to your needs.

    To fix the menu when scrolling down please download and activate Sticky Menu plugin. For more help refer to this screenshot.

    Let me know for any confusion.

    Thanks


  • Hello,

    Works perfect, thanks a lot. 
  • Sorry, there is  still a small quick question, where to change the colour of the bottom line of the navbar?
  • Hi, @nadiali

    To do this please add the given below custom CSS code.

    .navbar {
    border-bottom-color: #5e6282 !important;
    }

    Change color code value according to your needs.

    Let me know did it work.

    Thanks

  • Thanks, Sohail. It works.

    I know it might be a bit annoying, but could you also share me the CSS code to change the font and color of  LOGO text.

    I mean txt here: https://prnt.sc/qg9wkj




  • Hi, @nadiali

    To change the font and color of logo text please add the given below custom CSS code.

    .navbar-brand {
        color: #ad81ea !important;
    }
    .navbar-brand:hover{
    color: #5e6282 !important;
    }
    .navbar-brand {
        font-family: 'Droid Sans';
        font-size: 35px;
    }

    Change color code, font family and font size px  value according to your needs.

    Let me know did it work.

    Thanks

  • Thanks, works soomthly.


  • Glad to help you.

    If you like our Theme & Support, rate us HERE.

    Thanks
This discussion has been closed.