Classes in body tag

Jeff Klunder asked on June 2, 2017 08:23

Hi,

Is it possible to add the document name as a body class or id in Kentico 10? After some googling, I found some code, but not sure how to add it.

Image Text

Correct Answer

Dawid Jachnik answered on June 2, 2017 09:46

From your screenshot I can read that you want different additional body class for each document name. In the place you added the code is wrong implementation, there work k# so in your case would be

id="page-{%CurrentDocument.DocumentName%}"
0 votesVote for this answer Unmark Correct answer

Recent Answers


Dawid Jachnik answered on June 2, 2017 09:04

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> 
1 votesVote for this answer Mark as a Correct answer

Jeff Klunder answered on June 2, 2017 09:17

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.

0 votesVote for this answer Mark as a Correct answer

Dawid Jachnik answered on June 2, 2017 09:37

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.

0 votesVote for this answer Mark as a Correct answer

Jeff Klunder answered on June 2, 2017 09:41

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?

0 votesVote for this answer Mark as a Correct answer

Jeff Klunder answered on June 2, 2017 09:49

Cool, that did the trick.

0 votesVote for this answer Mark as a Correct answer

Dawid Jachnik answered on June 2, 2017 10:02

Finally ;)

0 votesVote for this answer Mark as a Correct answer

Brenden Kehren answered on June 2, 2017 14:41 (last edited on June 2, 2017 14:41)

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.

0 votesVote for this answer Mark as a Correct answer

Jeff Klunder answered on June 2, 2017 14:44

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..

0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.