How to change CSS stylesheet per document alias path or document´s culture.
This article describes how to change CSS stylesheet per document alias path or document´s culture, so every page or its culture version can have a different stylesheet applied.
You will need to define stylesheet file for every CSS definition and then use
Head HTML code web part (in General section) to generate link to requested stylesheet, according to e.g. to alias path of current page. You will need to use our API to get current´s document alias path and, according to its value, use appropriate stylesheet file.
This can be done in code-behind in file:
~/CMSWebParts/General/headhtml.ascx.cs, in
OnPreRender method (
modifying code of default web parts). Please see example bellow:
protected override void OnPreRender(EventArgs e)
{
base.OnPreRender(e);
if (this.StopProcessing)
{
// Do nothing
}
else
{
string css1 = "<link type=\"text/css\" rel=\"stylesheet\" href=\"/KenticoCMS40C/CMSPages/GetCSS.aspx?stylesheetname=StyleSheet1\"/>";
string css2 = "<link type=\"text/css\" rel=\"stylesheet\" href=\"/KenticoCMS40C/CMSPages/GetCSS.aspx?stylesheetname=StyleSheet2\"/>";
string css3 = "<link type=\"text/css\" rel=\"stylesheet\" href=\"/KenticoCMS40C/CMSPages/GetCSS.aspx?stylesheetname=StyleSheet3\"/>";
if (CMS.CMSHelper.CMSContext.CurrentPageInfo.NodeAliasPath == "someName")
{
this.Page.Header.Controls.Add(new LiteralControl(css1));
}
else if (CMS.CMSHelper.CMSContext.CurrentPageInfo.NodeAliasPath == "someName2")
{
this.Page.Header.Controls.Add(new LiteralControl(css2));
}
else if (CMS.CMSHelper.CMSContext.CurrentPageInfo.NodeAliasPath == "someName3")
{
this.Page.Header.Controls.Add(new LiteralControl(css3));
}
else
{
this.Page.Header.Controls.Add(new LiteralControl(this.HTMLCode));
}
}
}
Condition if-then can be changed to anything else, e.g. culture version of a current document.
See also: CSS Style SheetsApplies to: Kentico CMS 4.x