Header Options

[Frank S.]

There are 3 primary header options
These are controlled from the *Header tab inside the LBSB Central Control Panel.

1) Use the default custom text effect fonts to create a main headline and a sub-headline (optional) to describe the title of the website. You can choose from a variety of font styles, colors special effects such as shadow, mirror and outline.

2) Upload a header image (defined as header "logo") which will override any text/font settings and just display the header/logo graphic (your default header text settings will be retained in case you choose to deactivate the graphic header). Make sure that the header/logo image is no wider than 660px as the theme styling will only display that width. That leaves a header space to the right of approximately 282px which is the styling area designated to the CTA arrow box & header widget.
N.B. In LBSB 3.5 there is a "Full Width" header option which will extend the header image area to 970px. In such instances, and where the header image extends to the right side of the full header width, you will need to remove the CTA arrow box or any header widgets which would overlay the header image.

3) If you wish to have a full width header for either boxed or full width styling then you need to create your header as a "background" and upload it using the "header background" upload field.

IMPORTANT: You can make your header logos/graphics as high as you want (default is 70px,.. but you could go to 200px+ if you like) but the width is fixed at 660px for the reasons stated in "2)" above. The menu tabs will always be pushed down the the lowest position sitting just above the page contents.
Please Note: If you use a custom header widget that has a higher sized content (such as a video with a 200px height) ... and you are also using the default text effect header headline or a header graphic of say 120px high, then the menu buttons will not be pushed down and may look suspended. The only way to rectify that is to create a header/logo graphic that's at least the same height as the header widget, or if you really only wanted say a 120px high header graphic then you can create it as a 200px high .png (clear) graphic and just delete the background for the lower 80px height of the graphic across its entire width. That way, the browser will call the 200px high header graphic and thus push the menu tabs into position, and the natural header background will show through thus making it all look very natural.