Archived topic
Not full width with Beaver Builder in blog pages
12 replies · Started by Fernando Díaz Gascón on February 10, 2016
Hello,
If you remember, I asked weeks ago about an issue: When using Beaver Builder, the page goes to full width.
https://generatepress.com/forums/topic/content-title-moved-when-beaver-builder-is-used/#post-166007
I can get by with this issue on pages, because I use the title using Beaver builder.
The thing is that I am with a web where I need to use Beaver Builder in some posts. And in those posts, the problem is shown not only with titles but also with the comments, the sidebar, the link to other posts... they are glued to the edge of the screen.
Is there a way that "only in blog posts" the contain not to be full widht? (this is the only solution I find)
Thanks in advance
Any chance you can link me to a post so I can see the issue?
Basically, you're wanting the content area to be full width, but nothing else?
That would be the best solution!
This is how it looks in a category page: http://maipacific.com.mialias.net/descubriendo/paquetes/ (everything is glued to the left).
This is how it looks in a single post: http://maipacific.com.mialias.net/paquete-generico/ (you can look the comments, the share social, and the title glued to the left.
TO ENTER IN THE WEB:
http://maipacific.com.mialias.net/
usuario: maipac482
pass: 34OnUnwQ
Thanks in advance!
Are you using the full width builder anywhere?
If not, add this CSS:
.fl-builder .container.grid-container {
max-width: 1950px;
}
Yes, I want to use full width on pages. Even I would like to use full widht on posts. With that CSS is not possible :(
The best solution would be the content area to be full width, but nothing else (not titles, comments, etc.). Is it possible?
Not really, because those things you mentioned are within the same container which needs to the width to be set.
I guess I'm not fully understanding the kind of layout you're going for. You want the post title and comments to be contained, but the content in between to be full width? Any examples of this anywhere?
Then, that is not the solution. I dont know the solution, but I know the problem. I try to clarify the problem and Im sure you will give me light on this issue. The problem is:
- I use Beaver Builder on Generate Press (and I like both tools a lot). When I use Beaver Builder, I want to create pages and posts with full-width elements.
- When I use Beaver Builder on posts in Generate Press, I find that something goes wrong. What? Several things goes glued to the left (I dont know if this is the best expresion to identify this, sorry for my english). This behaviour is strange and ugly. I would like to have some margin. I clarify this with examples:
(To access to the web:
usuario: maipac482
pass: 34OnUnwQ)
Example of a post using Beaver Builder with the things glued to the left of the screen rounded in red:
http://maipacific.com.mialias.net/wp-content/uploads/2016/02/single-post-bb-gp.png
Even worse, example of category page with posts using Beaver Builder (left side) vs. archive page with posts not using Beaver Builder (right side): http://maipacific.com.mialias.net/wp-content/uploads/2016/02/archive-page-bb-gp-comparison.png
In the last example, you can see that the archive page of posts using Beaver Builder, every content is glued to the left and in the other, there is a margin. The correct behaviour would be to have margin in both cases.
You can see also the examples in the real web:
-archive page with posts using BB: http://maipacific.com.mialias.net/descubriendo/tours/
-archive page with posts not using BB: http://maipacific.com.mialias.net/descubriendo/guias/
-single post using BB: http://maipacific.com.mialias.net/descubriendo/paquetes/
-single post not using BB: http://maipacific.com.mialias.net/guia-2-fiji/
I hope you have now a clearer vision of the whole problem. If not, ask me please.
Summing, in Beaver Builder I can decide what is full-width and what is not. But other elements out of scope of Beaver Builder: title, comments, search widget in sidebar, social network sharing... are glued to the screen sides, what looks wrong. And in archive pages, everything is glued to the left if there is any post edited with Beaver Builder.
I can try to talk with Beaver Builder team if you thing something can be in their hands. I like a lot Beaver Builder and Generate Press, I wish they could work perfect together!!!
Thanks a lot.
Hmm yea, this is a tough one.
I think it's a bug in Beaver Builder that they add the .fl-builder class to the element in the archive/blog if one of the posts has BB enabled.
This CSS should help:
.fl-builder .entry-header,
.fl-builder .synved-social-container,
.fl-builder footer.entry-meta,
.fl-builder .comments-area,
.fl-builder.archive .container.grid-container,
.fl-builder.blog.container.grid-container {
max-width: 1980px;
margin-left: auto;
margin-right: auto;
padding-left: 40px;
padding-right: 40px;
}
Let me know if that does it or not :)
It works!!! You are great!
Im going to tell Beaver Builder support about this issue. Maybe it is something they can improve.
I was worried about this issue and now it looks great. Thanks a lot.
Excellent, glad it worked.
It's tough for them as well, but I do think adding their class on the blog/archive might be a bug :)
Fernando, did you tell BB about this issue, and if so, what did they say?
Tom,
Don't you think GeneratePress should progromatically switch off some of its functioniality which can't be used when Beaver Builder is activated?
I am thinking specifically of the "sections" capability which both tools provide. And since you can't use Beaver Builder in a GeneratePress section, only a Beaver Builder section, what's the point of having both?
There may be more mutually exclusive issues but this was the first one I spotted.
And I don't know if its different when you're not using Bevaer Builder Lite, so maybe that's the reason. It works differently somehow with Beaver Builder Pro?
I'm not sure I understand what you mean? Sections is only turned on if you turn it on. If you're using Beaver Builder, just keep Sections turned off.
