Make the Nagivation Header Smaller

Home Forums Jevelin Theme Make the Nagivation Header Smaller

Home Forums Jevelin Theme Make the Nagivation Header Smaller

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • shanticfm
    Participant

    How can I decrease the height of the main menu?

    Hi @shanticfm,

     

    I hope you are well today and thank you for your question.

     

    You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.

     

    Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code

     

    .sh-header:not(.sh-header-4):not(.sh-header-5):not(.sh-header-6) .sh-nav > li.menu-item > a {
        padding-top: 15px;
        padding-bottom: 15px;
    }

     

    Best regards,
    Shufflehound team

    shanticfm
    Participant

    Installed the custom code but menu height didn’t change.

     

    Could you please share me your site URL where you are using the shared CSS code so that i can troubleshoot it?

    It seems you are using different header menu style so please try using following custom CSS code.

     

    .sh-header-4 .sh-nav-container {
        padding-top: 5px;
        padding-bottom: 5px;
    }

    wkolari
    Participant

    I’m using the Corporate Theme with Header Style 5 and am trying to find a way to reduce the fixed header navigation bar size when I scroll down (reduce by half the size). I’ve tried the code you posted above and have looked at many posts in overall forum, but haven’t found a solution yet. Ideally it would be nice to have this modified for both desktop and mobile site versions.

    @wkolari To help us keep support thread separates could you please create your own thread for your question instead of replying on others thread as it makes the thread messy and hard to read.

     

    If you want to you can also add reference of this thread in your newly created thread.

     

    We would be more than happy to help you on your new thread.

    abdullah
    Participant

    And how make reduce height on mobile menu. thanks

    This Screenshoot http://prntscr.com/fgpgf4

     

    For mobile menu please use the following custom CSS code.

     

    .sh-header-mobile-navigation .sh-nav-container {
        padding: 20px 0;
    }
Viewing 10 posts - 1 through 10 (of 10 total)

Popular choice

Professional Developers At Your Fingertips!

If you need services beyond standard support, we've got your back!

Services we offer:

Demo setup
Advanced customization
Layout adjustment
Graphic work / visualizations
Custom coding
Full WordPress development and design

Services

What we can offer

  • Demo setup +

    If you'd prefer not to handle the installation yourself or need help getting started, we'll set everything up for you.

  • Layout adjustment +

    We'll help you rearrange sections, adjust spacing, and modify the page structure to fit your needs.

  • Advanced customization +

    More complex styling changes, theme option modifications, and third-party integrations.

  • Custom coding +

    If you need something that's not included in the theme, we can code it for you.

  • Graphic work / visualizations +

    Web design services to create custom sections, pages, and blocks for your theme, plus graphics and visualizations.

  • Full WordPress development and design +

    Full website builds, custom theme development, or plugin creation from scratch.

  • About pricing +

    We'll provide a clear quote based on what you need. No hidden fees.

Professional Developers At Your Fingertips!

Custom Work Form