Custom Header

barclaydigital · September 2016

I am trying to create a custom header similar to the one on my old site. How would I go about doing that?

The static image looks okay on a desktop on the current new site, but when displayed on a mobile device it just doesnt look right.

New: http://alexanderbarclay.co/bestlife/

Old: bestlifehypnotherapy.com

Albert · September 2016

Please explain what exactly does not look right on mobile because we did not noticed anything wrong.

barclaydigital · September 2016

It is much too small to read and the "Menu" text covers the image

Albert · September 2016

Hmm, we do not have any option to move the menu or to use such large images in header so the only way to do it is custom css but the menu wouldn't look good because menu is opening from the top and this behave couldn't be changed with custom css.

@media only screen and (max-width: 767px) {
    #Top_bar .logo #logo { margin: 0 !important; }
    #Top_bar a.responsive-menu-toggle, .header-plain #Top_bar a.responsive-menu-toggle, .header-transparent #Top_bar a.responsive-menu-toggle { top: 78px !important; }
}

barclaydigital · September 2016

What do you mean the menu is openeing from the top? I do not follow.

Can I or can I not custom code the header and enter the CSS into the theme?

barclaydigital · September 2016

I do not have sticky menu on and the menu is below my header.

Albert · September 2016

We mean that if you will move responsive menu to the bottom, the button will be overwritten by menu. Just use above css and you will see what we mean.

Custom Header

Comments