Classes in body tag

Hello, is it possible to set in from ascx page template or in custom web part code:

 <script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        CMS.DocumentEngine.DocumentContext.CurrentBodyClass += " your-body-class";
    }
</script> 

Hi Dawid,

I found that option yesterday and using that I do get an extra class in the body tag. Only thing is I have to manually do this every time there is a new page made. Therefore I was wondering if it could be achieved by a more dynamic way. In other words, when the user creates a new page, the body class (or id) automatically is added.

Yes, you can do that.

I have my custom web part called Additional Body Class, it checks that in the current document the field AdditionalBodyClass is not empty, if not it adds this class to body tag with the same code as above. Of course you need to add to every used page type additional field, but I think it is more friendly and flexible to editor experience.

Hmz, I don't think that makes a difference then. Like you said, this should be manually added every time a page is made. Can you tell me what the input field in my screenshot is meant for? All I type in there is added 1-on-1 in the source code, so I guess asp codes or stuff like that are not things I should add in there?

Cool, that did the trick.

Finally ;)

For this you might not want to use the DocumentName because it will have spaces in it, look at NodeAlias instead because that will have the spaces replaced with dashes.

Lastly, you could use the first suggestion Dawid suggests and add a field to your page types for the user to select a class OR have a default one. Then place that code in the master page template layout and you'll be set. I use this method all the time and it won't break when someone decides to change the name of the page.

Hi Brenden,

Thanks for the info; NodeAlias sounds a bit safer indeed. I don't want the user to select a class what so ever, but a default class could be an option. I'll check it out..

Hi, There is another approach even easier - no code change whatsoever required - pure CSS. You notice on each Kentico page there is a form tag, following the body tag, with an action attribute and value = relative path eg. <form method='post' action='/AU/About/Company/Something/' />

This can be used to target styles with:

form[action='/AU/About/Company/Something/'] div h2 { /*yourstyles here*/ }

Hope that can be of use.

cheers