[Resolved] GenerateBlocks Not Showing Full Screen

[Samuel]

I’m trying to set a container to be full width using Generate Blocks. I selected “Set Full Width Content” but the container is not showing full width. Instead, it is contained within the normal content area and aligned to the left.

Unfortunately this is a test site I’m building on a local machine so I don’t have a link. I am trying to figure out what settings to look at?

Here is a screenshot showing the container set to full width in the builder: https://www.dropbox.com/s/u9huhm7me9u7nci/Screen%20Shot%202020-06-27%20at%209.44.27%20PM.png?dl=0

Here is a screenshot showing what happens when the page loads. you can see the container is not full width and is aligned to the left.

I am using GP with a child theme if that makes any difference. I know this is hard to troubleshoot without the site but I have been staring at this for an hour and cannot figure out what setting to look at.

[David]

Hi there,

whats it look like on the front end – can you share a screenshot ?

[Samuel]

Ah sorry, forgot to post that. Here you go: https://www.dropbox.com/s/qfz9uyve4pg29m1/Screen%20Shot%202020-06-27%20at%209.43.07%20PM.png?dl=0

[David]

Check to see if you have any Layout > Elements in Appearance > Elements that are setting a Content Width:

https://docs.generatepress.com/article/layout-element-overview/

If not check in Customizer > Additional CSS to see if anywhere some is setting a max-width

[Samuel]

I have a layout element that is set for Front Page and Pages. In this case, it’s the front page I’m trying to fix. Under content it is set to “Full width (no padding).”

However, this is being set in the page:

  body .grid-container {
        max-width: 950px;
    }

    .wp-block-group__inner-container {
        max-width: 950px;
        margin-left: auto;
        margin-right: auto;
    }

It is being set in the generate-style-inline-css.

[Leo]

This block of CSS shouldn’t be in there by default.

.wp-block-group__inner-container {
        max-width: 950px;
        margin-left: auto;
        margin-right: auto;
    }

Any chance you can setup a staging site and link us to the page in question so we can see the issue? It would be alot easier than guessing.

[Samuel]

Ok I was able to get a test site up.

Here is the issue on the front page where it is not full width. This has to be something obvious that I am missing: http://oneking2016.flywheelsites.com/

Also on this page the content area is set to 950px but the actual content is limited to just over 500px. I cannot figure out what is going on: http://oneking2016.flywheelsites.com/lesson/lesson-one

[Leo]

Have you modified the theme files in any ways?

The page you linked is supposed to be a static page but I’m seeing a couple of elements that shouldn’t be there:
https://www.screencast.com/t/0c4GFtkcwOMU

[Samuel]

There shouldn’t be anything modified affecting that page. I added a few things to function.php that are not being loaded on this page and created a page template for a custom post type which is also not affecting this page. That was done in a child theme.

I’m sure there is something obvious here but I’m missing it. I can give you an admin login if you want to take a look. In the html you highlighted that post number is the post number of this page.

[Leo]

I added a few things to function.php that are not being loaded on this page and created a page template for a custom post type which is also not affecting this page. That was done in a child theme.

Can you temporarily undo all those changes so we can get a cleaner start?

Also activate the parent theme if you are using a child theme.

In the html you highlighted that post number is the post number of this page.

I understand. But generate-columns-container definitely should not be there.

[Samuel]

Ok I do not understand this at all.

I changed the theme to GeneratePress to eliminate the child theme. This time the page rendered correctly and the generate-columns-container was not here.

So I switched back to the child theme to see what the problem was. And now the page renders correctly and the generate-columns-container is not here.

It does not make sense, but at least it is working now.

This page is being rendered by a modified template (in the child theme): http://oneking2016.flywheelsites.com/lesson/lesson-one

Any idea why the main content will not fill the full content width of 950px and instead only fills a little over 500px?

[Leo]

I’m not sure unfortunately.

The site container looks correct at 950px so the issue is with the content I believe:
https://www.screencast.com/t/3ZVDflhK

You will need to go through your child theme, maybe disabling each modification and see if you can determine the problem.

[Author]

Posts