Mark Handy
Mark Handy

Reputation: 1256

Kentico NodeName as a body class?

I'm trying to identify the home page, and then sub-pages on nodes. Ideally as a class on the Body so i can make style changes based on which section the user is in.

I have two .master pages, Global and Site. The body tag is in Global, and Site is a child master.

As this is an English/French site, I'm hoping using the Node Name would be the easiest approach for me.

Upvotes: 0

Views: 458

Answers (6)

merrais
merrais

Reputation: 401

In the body section in the Master page you can start with

<script runat="server">
 protected void Page_Load(object sender, EventArgs e)
 {
   if(CurrentDocument.DocumentName== "Site")   
     CMS.DocumentEngine.DocumentContext.CurrentBodyClass += "body-site";
   else
     CMS.DocumentEngine.DocumentContext.CurrentBodyClass += "body-global";
 }
</script>

Upvotes: 0

Chetan Sharma
Chetan Sharma

Reputation: 1442

If your home page and internal pages are of different Page Type then you can benefit from the macro below. We use something like this to give Page type specific id on the body tag and is usually helpful

<body class="{% CurrentDocument.NodeClass.ClassName.ToString() #%}">

However, it can be tweaked to suit your needs.

Upvotes: 3

probrandono
probrandono

Reputation: 528

The simplest approach, if you are willing to add either a data attribute or an id attribute to the body tag, is to add something like this to the master page, in the text box of the body tag:

id="{%nodealias%}"

Since the node alias will typically be unique unless you have multiple pages, at different paths, with the same name, ID should work fine. I prefer to use "nodealias" as opposed to the friendly name because it ensures there will not be any special characters, and will replace white space etc with a dash "-". The above macro will add the node alias as an id attribute to the body tag. Here's a screenshot:

Body tag with node alias macro

Alternative approach explained here: https://devnet.kentico.com/forums/f49/t43559/body-class which involves setting the body class using a combination of macros and code behind, or via a custom web part. Basically you can modify it using CMS.CMSHelper.CMSContext.CurrentBodyClass (this was written in 2014 so the syntax will be slightly different)

-Edit: Adding to some of the other answers, if you'd rather add a stylesheet on a template or page level, you can do so. To add a stylesheet reference on every instance of a template, edit the template header properties:

Editing template header

If you want to include the stylesheet on any particular page, this can be accomplished by editing the General tab on the page level, but this will remove the main stylesheet you are using (depending on how you are including it in the page):

Editing page level stylesheet

Upvotes: 0

Roman Hutnyk
Roman Hutnyk

Reputation: 1549

I'd recommend you to implement one generic stylesheet, shared across all the pages, and a couple of section specific stylesheets.

Upvotes: 2

Mark Handy
Mark Handy

Reputation: 1256

Here's what i've come up in the .cs of my global .Master. So far it seem to be giving me enough to work with. From here i can use js and css to target what i need.

string aliasPath = CMS.DocumentEngine.DocumentContext.OriginalAliasPath.ToLower().TrimStart('/');

if (aliasPath == "")
{
    this.BodyClass += " home";
}
else
{
    this.BodyClass += " " + aliasPath.Replace("/","_");
}

Upvotes: 0

Rui
Rui

Reputation: 494

I'm not 100% clear about what you are describing, but you could use NodeLevel direct as / is NodeLevel = 0, and everything else will be Level 1+

Upvotes: 0

Related Questions