[Support request] Child Theme Layout

[Sebastián]

Hi im using a child theme and the parent theme is GeneratePress.

I would like a different layout for some pages and posts. Is there a way to do that?

For example in a previous request you guys gave me this code:

}
.single .grid-container {
    max-width: 900px;

Because i wanted a different layout for the single post pages. And it worked.

Now i would like a different layout for the pages im going to add with the child theme.

I don’t know if its something possible to do.

Thanks!

[Leo]

Hi there,

You could just try adding:

.grid-container {
    max-width: 900px;
}

to the simple CSS meta box on the pages you want to change the container width.

If you don’t have a specific logic (like single posts) on what pages you want to be different then that’s kind of the only way except using page ID which is essentially the same thing.

[Sebastián]

Great but it didn’t worked for me.

When I put:

.grid-container {
max-width: 900px;
}

on the simple css metabox on a specific post or page it doesn’t modify anything.

Instead when i edit the code in the customizer – additional css:

.single .grid-container {
max-width: 900px;
}

it modifies, but it modifies everything single page and i don’t want to do that.

Hope i made myself clear.
Thanks!

[Leo]

Can you link me to a page that wasn’t working?

The code is likely being overwritten.

[Sebastián]

For example this page:

https://www.mmarketingonline.com/course/build-a-learning-management-system-with-lifterlms/

I put:

.grid-container {
max-width: 1400px;
}

on the simple css metabox but the additional css is interfering. The additional css is:

.single .grid-container {
max-width: 900px;
}

but i can’t delete it because is the layout i want in almost every one of the single post pages.

Except https://www.mmarketingonline.com/course/build-a-learning-management-system-with-lifterlms/ and others pages because i want to create courses online with a different layout from the blog pages.

Hope i made myself clear.

Thanks

[Leo]

ahh yeah try this instead:

.grid-container {
    max-width: 1400px !important;
}

[Sebastián]

Yeeeeeeeeees!

Thank you so much!

[Leo]

No problem!

[Sebastián]

Is there any code to do the same thing but with the background color of the page?

I want to stablish a different colour for some of my lesson pages.

Thanks

[Leo]

Of the body?

If so try:

body {
    background-color: #000000;
}

[Author]

Posts