applying different styles on current page button?

Question

I am doing a web site in asp.net (making user controls) and use them in sitefinity pages. My navigation bar button(s) is also a user control which is placed in a template.

Requriement is on current page button for that page should have different styles (color & bgcolor).

I am not getting how to implement this requirement. Guidance request please.

Edit: I am not getting how to apply class on selected page. How to know in user control which page is current page. As both are separate user controls being used in a sitefinity page.

Thanks

you can use themes and skins in asp.net – Mogli Mar 26 '13 at 06:02 — Mogli, Mar 26 '13 at 06:02

score 2 · Answer 1 · answered Apr 02 '13 at 14:35

2

Do you have a specific requirement around using a custom control for your navigation? If you use the Navigation control that comes with Sitefinity (it's in the widget dock) - it will automatically add a CSS class ("rtSelected") to the selected page

answered Apr 02 '13 at 14:35

Avisra

740
5
14

score 1 · Answer 2 · edited May 23 '17 at 12:15

Using themes, you can easily customize your server controls with the pre-defined looks bundled with the .NET Framework or can make your own themes according to the look and feel of your website. try this link

http://www.codeproject.com/Articles/11886/Themes-and-Skins-in-ASP-NET-2-0

EDIT #1

try this link

How to make user controls know about css classes in ASP.NET

and

Apply CSS to single instance of Custom user Control in ASP:NET

score 0 · Answer 3 · answered Mar 26 '13 at 06:05

If you can, you can get ready made themes by using telerik controls.

You can write css code for it as you want and then give link to that css as follows>>

 <MyUserControls:MyMenuButton ID="SalesDocumentsMyMenuButton"
                    RootMenuItemText="Sales Documents"
                    RootMenuImage="~/images/common/sales_document.gif"
                    UseSeperator="true"
                    CssClass="css/myButtonMenu.css"
                    runat="server" />

You can also write css for codebehind for particular control as>>

<div class='<%= CssClass %>' >
    <div id="contentPlaceholder" runat="server" class="contentPlaceholderStyle">
    </div>
</div>

[CssClassProperty]
public string CssClass
{
    get { return (string)(ViewState["CssClass"] ?? ""); }
    set { ViewState["CssClass"] = value; }
}

you can identify current page by HttpContext.Current.Request.Url property or this.Page property — Freelancer, Mar 26 '13 at 06:21

शेखर · Answer 4 · 2013-03-26T06:15:38.397

You can create different themes and use it according to your condition.
Themes will contain different css files.
Create css-classes with same name but with different color or background-color
And use that theme according to your condition

Example

protected void BasePage_PreInit(object sender, EventArgs e)
{
   this.Page.Theme = themeName;
 }

Here is a tutorial
http://www.aspdotnet-suresh.com/2011/10/how-to-change-page-theme-dynamically-in.html
http://www.codeproject.com/Articles/18300/How-to-change-page-theme-in-asp-net-2-0-dynamicall
http://aspalliance.com/959_Themes_and_Master_Pages_in_ASPNET_20__A_Perfect_Combination.4

applying different styles on current page button?

4 Answers4