- This topic has 9 replies, 3 voices, and was last updated 10 years, 5 months ago by
Tom.
-
AuthorPosts
-
January 9, 2016 at 11:34 am #164593
Philip
I am having problems with a number of my websites that are using the Beaver Builder plugin with the Generatepress Theme Plugin. The H1 Page Title on all pages is not aligned with the content box. It is aligned furthest left for some reason.
This problem occurred a few weeks ago and does need to seem to have been resolved with any updates so not sure if it is a Generatepress or Beaver Builder conflict?
All the pages that I am not using the Beaver Builder plugin on have the H1 page title within the content area (correctly aligned).
Hope you can help with this problem as I love this combination.
Thank you and keep up the good work.
January 9, 2016 at 11:47 am #164602Tom
Lead DeveloperLead DeveloperHi there,
Can you link me to a page where this is happening?
Thanks! 🙂
January 9, 2016 at 11:49 am #164603Philip
Hi Tom
Yes you can find the problem on the homepage at http://www.aquilapartnership.org.uk
I also have a number of other websites with the same consistent problem.
If you need admin access then please let me know.
-
This reply was modified 10 years, 7 months ago by
Philip.
January 9, 2016 at 11:53 am #164607Tom
Lead DeveloperLead DeveloperCan you give this CSS a try?:
.fl-builder .entry-header { max-width: 1100px; margin-left: auto; margin-right: auto; }Adding CSS: https://generatepress.com/knowledgebase/adding-css/
January 9, 2016 at 12:07 pm #164613Philip
Hi Tom
Thanks for your fast reply.
This resolves the alignment of the page title but the content area box is still the max width of the screen size.
I have tried a similar solution to yours on a different website but with the following code:
.inside-article {
max-width: 1030px;
margin: 0 auto;
}This resolves the issue but why is this workaround required?
It seemed to happen when either Beaver or Generatepress was updated at some point as I have been using both together for over a year.
Thanks for your help so far 🙂
January 9, 2016 at 11:40 pm #164667Tom
Lead DeveloperLead DeveloperHi there,
This happens because Beaver Builder lets you choose whether to have a fixed or fluid layout.
If GP doesn’t set the width of the page to 100% when BB is activated, the fluid layouts won’t work.
Kind of a tough situation, but the majority of people use page builders to build full width layouts, so the method I took kind of caters to that.
Let me know if you need more info 🙂
February 14, 2016 at 10:24 pm #172779Catherine Pelonero
Hi Tom,
I’m having the exact same problem with Beaver Builder – the page title is aligned furthest left instead of over the content box and the content area box is the max width of the screen instead of aligned like it should be. I installed and activated your simple CSS plugin and I tried pasting in this code to fix the page title alignment:
.fl-builder .entry-header {
max-width: 1100px;
margin-left: auto;
margin-right: auto;
}It didn’t work for me, but perhaps I didn’t paste in the right place (again!)
To let you know exactly what I’m trying to do, this page on my site is exactly how I want the pages to look: http://www.catherinepelonero.net/formal-bio/
This is how the page looks that I made with Beaver Builder: http://www.catherinepelonero.net/representation/
Like the person who started this thread, I also love the combination of GeneratePress and Beaver Builder so I’m really hoping there’s a way to resolve this. Please let me know the best way to fix, and if there’s a global fix or whether I need to insert or alter something on any pages created with Beaver Builder.
Thanks for all you do!
February 14, 2016 at 10:42 pm #172784Tom
Lead DeveloperLead DeveloperHi there,
Do you have any full width beaver builder pages?
The issue here is most people using page builders to build full width layouts, but BB doesn’t give us theme developers any hints whether full width is enabled or not.
So by default, we make the container full width when BB is enabled on the page, and then leave it up to the user to choose full width or contained.
However, in situations like this, you’re using BB for one little part of your content without your contained content area.
So to make your area contained again, you would do this:
.fl-builder .container.grid-container { max-width: 1200px; }However, that will do it site-wide, so if you have any full width layouts, it will contain them.
To make the container contained only on this one page, you would grab the page ID (275 in this case), and do this:
.page-id-275.fl-builder .container.grid-container { max-width: 1200px; }Let me know if you need more info 🙂
February 14, 2016 at 11:04 pm #172785Catherine Pelonero
Yes! That did it! You are a genius, Tom, thank you!
And I wanted the change to be site-wide so that fix was perfect.
February 14, 2016 at 11:14 pm #172787Tom
Lead DeveloperLead DeveloperYou’re welcome 🙂
-
This reply was modified 10 years, 7 months ago by
-
AuthorPosts
- You must be logged in to reply to this topic.