Get all themes with lifetime updates for 95 USD. View all promotions

An introduction to your header style options

With this theme, you get 3 header styles, where the 3rd one is a bit unique in a sense that it removes the typical main menu location from the header if you choose to use a menu widget instead. The benefit with this is that you get a cleaner header without the menu showing. However, with this option, you will get a horizontal menu show up on smaller screens because this theme is responsive, so when viewing your site on a tablet, the left or right sidebars will float below the main content — makes it difficult to navigate if you are at the top half of your page.

Header Style 1

jb header1

Header Style 2

jb header2

Header Style 3

jb header3

How the Header Style 3 Works

Several things are happening here when you use the 3rd header style. The first is that your header no longer has the main (primary) menu location, so even if you publish your menu there from the “menu locations setting”, it won’t show. The second thing that happens is that it allows you to use a Navigation menu widget for your left or right sidebar:

jb menu widget

Incidentally, the live demo site uses this header style. The third thing that is setup in place is that when you are viewing your site on a smaller screen, such as a tablet, your left or right sidebars will float below the main content. However, this header style is setup so that when this happens, you now get a visible menu at the top of your screen until you get into a much smaller screen like a phone.

jb header3 top menu 

Note The above screenshot shows the menu at the top, but you can change the colours of your menu links from the “Colours” tab of the customizer.

Change Your Header Style

  1. Go to Appearance >> Customize >> Theme Options
  2. Look for the “Header Style” setting and make your choice
    jb headerstyle setting
  3. Click “Save & Publish