[Resolved] Content Width

[Andrew]

Hi, I’m having an issue replicating the full-width page view in Gutenberg. In other words, despite following instructions to get it to appear as the realistic full-width view of live page, it has margins on all sides and is shrunk down.

Ideas?

Thanks!

[Leo]

Hi there,

Is there a specific page or section we should be looking at?

ps. please refrain from commenting on someone else’ topic to mention your topic. We will answer everything within 12-24 hours as explained here:
https://generatepress.com/what-support-includes/

Thanks!

[Andrew]

Hi Leo, sorry! I did see your support parameters but misread them and thought those were your hours of operation, not response times. Oops. So I didn’t understand why my post was getting passed up for someone else’s. Get it now. Also didn’t see reply til late because I thought I’d receive email notification. Anyways… back to the issue:

It’s happening on all pages in the Gutenberg editor. When I click edit page, no matter what I toggle, it’s shrunk down with a lot of white space around all edges, and not full-width as explained was possible. Don’t know how to fix.

Thanks for your help!

Andrew

[Andrew]

Link to screenshot: https://ibb.co/BnVJsZs

[Elvin]

Hi Andrew,

It seems to be coming from a plugin. there’s a kt-block-editor styling that is applying a max-width:750px to the block editor view.

Can you try disabling ALL plugins and see if it goes away?

I think it’s one of the Kadence plugins but I can’t exactly pinpoint which one. Disable all plugins and enable one by one to make sure. 😀

[Andrew]

Thank you Elvin! Yes, that worked like a charm. I had (stupidly) convinced myself it wasn’t one of those plugins because they weren’t doing that until I installed GPress. My bad. Lesson learned. So I’ve changed those settings and it works fine now. I wanted to play around a little before I asked my follow-up, which is:

Many themes nowadays have the option to insert ready-made templates or sections right from the editor. This makes design/customization a breeze. It seems the only way to install some of your templates is to overwrite the whole site or install ALL pages of a template at once. I like to mix and match sections and pages from various sources.

Any plans to integrate this option in future? Also, with WP 5.8 around the corner, is it possible to import a particular page and then save that entire page as a template to use on another site etc. with import/export as with reusable blocks?

Thanks again!!

[David]

Hi there,

the GB Pro plugin comes with a tonne of pre-made importable templates:

https://generateblocks.com/pro/

And we’re looking into a possible ‘Asset Library’ for GPP – which will allow you to add parts from a site… which would cover the 5.8 templates.

[Andrew]

Oh, I thought the GP Premium purchase of Generate Press theme included GBlocks pro, but I take it it does not. One strong suggestion for future development: integrate the two somehow. Because people want to import full sites but also add individual template sections like you have in GB Pro. In fact, I’m not sure why you don’t offer one master plan with theme, premium features, and blocks pro? Other themes seem to be on this.

Finally, it would be awesome if you had a visual header and footer builder like Kadence does. Maybe coming down the road with newer WordPress releases and FSE?? The only thing holding you back at this point, really. Because designers now want to visually build entire site from header to footer with templates etc. Yes, we’ve gotten greedy, but the ease of swapping in your ready-made designs is just too irresistible.

Thoughts on the above wishes?

Thanks!!

[David]

We may introduce a ‘bundled’ option in the future for GPP and GBP.

We’ll be looking at the best method for importing template parts as opposed to whole sites.

Aside of the Header you can build and replace all theme elements with GPP and GB (Free) using the Block Element.
Once WP core has sorted out a stable Navigation block ( or we choose to create our own – not sure on this ) you will be able to create Headers as well ( although some users have done this without it ).

Looking at the competitions approach, adding a proprietary ‘builder’ in the Theme just doesn’t feel right when the Block editor is the future. And personal opinion, i really don’t like the amount of HTML their systems generate even for the most basic of headers, looks like something out of a Pagebuilder play book 🙂

[Andrew]

Hi David, I purchased the Blocks pro to give it a spin and knew I’d be back here if I had any additional questions. Thanks for previous. Yes, I think it’d be a cool idea to bundle the packages (GPP and GBP) and throw in a lifetime deal option. Food for thought.

So, the issue I’m having regards white space/margins between blocks in Gutenberg editor. It was also happening on live site but I added this css and it’s been resolved : .entry-content>[class*=”wp-block-“]:not(:last-child) {
margin-bottom: 0;
}

Any idea though how to fix this issue in gutenberg editor? I’ve searched your forums (found above css and advice) but not on backend. Why is this the default? Why do I have to add css to remove unwanted white space/margins when the blocks should just automatically stack on after the other, and if we want margins we can add them?

Thanks!!

[Andrew]

Sending follow up

[David]

The space between blocks in the editor and on the front end are not necessarily related:

In the editor WP Core adds this kinda CSS:

.wp-block {
    margin-top: 28px;
    margin-bottom: 28px;
}

Which applies to ALL blocks that do not have specific CSS. I believe one of the main reasons they added it was to combat the poor UI when selecting blocks that had no padding. Early days of Gutenberg that was a nightmare.

In your site you’re using the Reusable Block, which has its own wp-block container which is attracting the above CSS. But that spacing should NOT be displayed on the front end.

You can load your own styles in the editor to overcome that if you wish.
Tom, provides one of the methods here to enqueue your own editor styles:

https://generatepress.com/forums/topic/adding-local-fonts-broke-the-fonts-of-the-post-editor/#post-1599929

Or theres the function provided here, that will load the Additional CSS styles in the Customizer in the Editor.

https://generatepress.com/forums/topic/how-to-render-custom-gradient-presets-in-the-editor-without-a-child-theme/#post-1890378

In regard to adding CSS to add spacing, we did that to mirror the editor experience, and that was applied to all blocks that didn’t have its own specific CSS rules, such as the Group Block. Had there been no space around those kinds of blocks we would have been inundated with more requests for CSS to add it, as opposed to the very few requests we have had to remove it.

But when using GenerateBlocks – you should not have any of that theme spacing being added.

[Andrew]

Ok, thanks David. Appreciate the help!

Best

[David]

You’re welcome

[Andrew]

Hi David, an extraordinarily annoying thing is happening to me now with generateblocks. I am trying and trying to simply set an image background to cover, full image and 100 vh, which should contain the whole image and not cut any off at the bottom or top. Yet it is doing just that. I need it to include full image to the bottom for symmetry purposes in design. Any ideas? I can accomplish such with other pro blocks, not yours.

Thanks!!

[Author]

Posts