Creating a custom template for one specific page

[randomnameee]

Hello!

For my website, on the customization panel, I have my overall max width at 72%. And I would like to keep it that way.

However, for one specific page, I would like to be able to stretch that max-width to maybe 85, to 90%. I’m not sure what the best way to do that is.

Should I be creating a new template with a customized container? And if so, how do I do that. Because I also don’t want it to not have a container.

Or do I add an exception to the CSS that specifies that particular page and alters the width of that page? And if that’s the best way, what would the code be?

Let’s just use this page as the example:
http://www.desmondchan.org/the-all-american-athletes/

Thank you!

[ruenel]

Hi @randomnameee,

Thanks for posting in!

I can see that you have added this custom css:

.x-container.width {
    width: 65%;
}

If you want to increase in the mentioned page, then you can add this code as well:

.page-id-11924 .x-container.width {
    width: 85%;
}

I have use the body class page-id-11924 which has the ID of the page. To know how you can get the page ID, you can check this knowledge base article: https://theme.co/apex/forum/t/setup-how-to-locate-post-ids/59

Hope this helps.