[Support request] Beaver builder and Generatepress Pro?

[Jim]

Hi All,

I’m new here so not up to speed with the ways things work but hoping to get there and help along the way.

I’m using beaver builder as my page builder and generatepress with the pro plugin as my theme.

My question is:
Can anyone point me to any videos showing a how-video to build out a responsive site using both?

I’ve seen elementor and GP Pro combos but so far cant find the above.

Any help really appreciated.

Thanks…

[Tom]

I’m not aware of any specifically, but maybe someone else can chime in.

You can also join the Beaver Builder Facebook group and ask in there – lots of GP users 🙂

[Greg]

Jim,

Here is a link to a gentleman that has done several well documented video tutorials on both generatepress and Beaver builder. You may want to check out his YouTube Channel

[Simon]

Hi Jim,

I have been developing websites with GP, GPP and BB Lite.

I think the basic steps for you are to make sure you turn off Section because BB takes care of it.

Make sure every page should be defaulted to Full width so that you won’t have any problem editing them.

One thing you gotta keep in mind is that Posts, WooCommerce Item pages cannot really be edited with regular BB, but I know you can buy the BB Themer to fully edit them.

However, with Tom’s latest Page Header, you can assign a nicely designed header images and then just edit those posts regularly.

You can take a look at my latest client’s website for inspiration:
https://elysetera.com/

[Chris Burbridge]

This is not complete. It drives me crazy that they can’t just make a setting, considering the market demand for this one thing.

/*** Beaver Builder Adjustments ***/

.fl-builder.one-container .site-content {
padding: 0;
}

.fl-builder .container.grid-container {
width: 100%;
}

.fl-builder .grid-container {
max-width: 100%;
}

.fl-builder .grid-container .entry-header {
padding: 40px 40px 0 40px;
max-width: 1020px;
margin: 0 auto;
}

.entry-content, .entry-summary, .page-content {
margin: 0;
}

/*** End Beaver Builder Adjustments ***/

[Tom]

That’s what our Page Builder Container metabox options do: https://docs.generatepress.com/article/page-builder-container/

Then in GPP 1.7, you can create a Layout Element, and set those options site-wide (or whatever conditions you like): https://docs.generatepress.com/article/layout-element-overview/

[Chris Burbridge]

Oh, that’s cool, yes I see it!

In my ideal world, it would be a default that could be set in Customizer > Layout.

What really happens (I use Beaver Builder) is that all the BB-laid out pages need to become full-width, and the default pages should behave according to the normal rules. If you will notice the CSS I posted, it looks for a .fl-builder class (in the body tag), so that it only does that override on Beaver Builder-enabled pages.

In Cuztomizer > Layout, you could have a Page Builder section where you choose which page builder you were using from a drop down, and it could prepend the CSS with the right class. (Or, you could have it as a text field that would let someone paste the class in).

But this would be nice, because then it’s not one more thing I have to remember to do on each page.

Thanks!

[Tom]

The problem with that is what if you’re using a page builder and don’t want a full width layout? The way it is now, you have full control over the kind of layout you’re trying to achieve 🙂

[Chris Burbridge]

I see your reasoning. The way I think about the theme is as a foundational layer, like a blank canvas, and I rely on the builder to do as much as possible. In that sense, I want everything to be full width.

But you are a theme designer, so you are thinking of how the builder and the theme work *together* — and that is reasonable!

I guess what I would suggest is that you have the ability to set a *default* in Customizer > Layout for what you want it to be in general. (Again, maybe just for those pages that were done with a page builder). You could still have the meta box at the bottom of each page, but essentially it would be set to whatever the general rule was by default, and then you could still granularly set it for a specific thing for that page.

[Tom]

Interesting idea – thank you! 🙂

[William]

Aloha 🙂

How can I remove this CSS rule?

.fl-builder.one-container.no-sidebar .site-content {
padding: 0;
}

Iʻm pretty sure itʻs GP generated … but maybe Beaver Builder?

Itʻs overriding my Customizing ▸ Layout ▸ Container ▸ Content Padding settings.

Much thanks from Hawaii!

bill

[Leo]

Any chance you can open a new topic and link me to the page in question?

Thanks 🙂

[Author]

Posts