Navigation
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • #891318
    jsjmccracken
    Participant

    Hello,

    On http://www.tablerockkennels.com/ how do I change the height of the entire navbar including the logo?

    I thought of adding:

    .x-navbar {
    height: 50px;
    }

    Thank you!

    Jacob

    #891783
    Friech
    Moderator

    Hi Jacob,

    Thanks for writing in! On your admin dashboard navigate to Appearance > Customize. Then on Customizer under the Header tab, look for the Navbar Top Height field.

    Hope it helps, Cheers!

    #891883
    jsjmccracken
    Participant

    Thank you for the reply. When I changed it from 55 to 100 nothing happened and then when I changed it from 100 to 1 the slider was moved right next to the bottom of the navbar. I want to shrink the entire height of the navbar and the Navbar Top Height functions isn’t doing it.

    #892812
    Rue Nel
    Moderator

    Hello Again,

    The navbar height is dependent on the logo. In the customizer, you have a setting “Navbar Top Height” which would set a minimum height of the navbar. This setting will always be overridden especially if the logo height is greater. So to completely resize your navbar, please also consider changing the logo width in your customizer. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

    Thank you.

    #892847
    jsjmccracken
    Participant

    That makes sense that the logo height will override the navbar height. I’ll just shrink my logo height and that should solve it. Thank you for the help!

    #893360
    John Ezra
    Member

    You’re most welcome! 🙂

  • <script> jQuery(function($){ $("#no-reply-891318 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>