Header menu on larger tablets

hey guys, i think the theme is a winner. I’m having a few growing pains coming from web expression to wordpress.

My question is this…and i apologize if its been addressed in another post…the menu turns from the individual text buttons, to the hamburger menu way too soon in my opinion. in a web browser on a PC or Mac, whenever the window is not maximized, or better put, under about 700-800 pixels, the hamburger menu appears. i want the buttons to remain for smaller windows, and for iPad and other tablets in landscape view.

could you help. I’ve seen you add CSS code for other inquiries. Maybe that is the solution here, or maybe I’m just doing something wrong.

thanks in advance.

Dear John,

I would like to apologize in advance for delayed reply.

In order to achieve this objective, you should modify the main theme’s JS file which was written in the js/main.min.js file.

  1. Open the js/main.js in your code editor, then copy the whole content of it; then paste it into js/main.min.js. So it will be more readable

  2. In the js/main.min.js, find the following code block

if ( matchMedia( 'only screen and (max-width: 1024px)' ).matches ) {
	currMenuType = 'mobile';
}

Here is the viewport breakpoint was specified.

  1. Change it to the following.
if ( matchMedia( 'only screen and (max-width: 768px)' ).matches ) {
  currMenuType = 'mobile';
}
  1. Save the changes, then update it through FTP or cPanel

CSS adjustment

Try to apply the following CSS code through the Simple Custom CSS plugin.

@media only screen and (min-width:769px){
  
  .site-header .col-md-4{
    width: 33.33333333% !important;
    float: left !important;
  }
  
  .site-header .col-md-8 {
    float: right !important;
    width: 66.66666667% !important;
  }
  
  .btn-menu{
    display: none !important;
  }
  
  .mainnav{
    display: block !important;
    top: 0 !important;
  }
  
  
}

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

P.S.

As you are editing the core theme’s file, you should take it at your own risk. The future theme update will overwrite the changes you have made in the main.min.js file.

Regards,
Kharis

Yes, it is working super. Many thanks for your help.