Full Height Row Minus The Header Area

Beaver Builder
1

Hi there.

Just started using the BeaverBuilder plugin to help clients more easily manage their website content. Loving the entire experience so far, especially with the new partial refresh feature - nice touch.

One question I have is in relation to the full height rows. If we are applying a ‘hero’ image to say the home page but wish to keep the global header in place, is there an easy way to deduct the header/menu bar height from the row height so the entire image is shown rather than forced to drop ‘below the fold’ (by the height of the header/menu bar.

Many thanks.

Alan.

1 Like
2

Hey Alan,

Welcome to the BB forums! :slight_smile:

There is no BB setting for that but it should be possible via custom CSS. The snippet below should override the plugin’s style. Simply change 213px to whatever is your header + footer height.

.fl-row-full-height .fl-row-content-wrap {
  min-height: calc(100vh - 213px);
}

The guys did at one point mention that they’ll be implementing something like this but there’s really no concrete timeline as to when. There’s already a request on our User Voice so feel free to vote for it on the link below.
https://wpbeaverbuilder.uservoice.com/forums/270594-general/suggestions/10223934-full-row-heights-with-offset-for-static-header

The full height option was intended for landing pages only, just in case you’re wondering. :slight_smile:

Ben

3

Hey Ben,

Thanks for the super speedy response - a bit like beaver builder itself :wink:

I thought I’d check with you first before I ‘encouraged’ it with some additional css.

That’s certainly easy enough to do, just wanted to make sure I wasn’t missing a trick first.

We have a couple of customers ‘test driving’ this for us at the moment and it’s looking very promising. Looks like a few sites built with Visual composer will be getting a makeover very soon.

Alan.

4

Awesome! Have fun with BB! :slight_smile:

Ben