What is the process for adjusting ASP.NET App_Themes according to the chosen Skin in RadSkinManager?

Is there a recommended way to dynamically change the ASP.NET App_Themes based on the selected skin in RadSkinManager?

In my masterpage, I have a RadSkinManager dropdownlist that lets users choose their preferred skin from Telerik Rad Controls. I would like the ability to automatically switch my App_Theme directory so that all other CSS and .skin files associated with my asp.net application change along with the selected RadSkin.

What is considered the best practice for achieving this functionality?

Answer №1

To save the theme selected by users and apply it to the Page.StyleSheetTheme property, you will need to utilize .NET profiles. Creating a UI Theme property and setting either the page's StyleSheetTheme or Theme is recommended. The theme can be controlled through your base page.

Refer to http://msdn.microsoft.com/en-us/library/2y3fs9xs.aspx for guidance on creating profile properties.

Sample profile property:

<profile>
  <properties>
    <group name="UI">
      <add name="Theme" type="System.String" defaultValue="DefaultThemeName" />
    </group>
  </properties>
</profile>

To access the property:

ProfileCommon profile = new ProfileCommon().GetProfile(HttpContext.Current.User.Identity.Name);
Page.StyleSheetTheme = profile.UI.Theme;

Finally, consider using a RadSkinManager dropdown list to allow users to set their preferred theme in their profile settings.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The anchor button with a background color is dysfunctional on Internet Explorer 8

The challenge I am facing involves styling the background color of a hyperlink button. This styling works perfectly on Chrome, IE9, Firefox, and other browsers except for IE8. Further investigation revealed that IE8 does not support CSS properties such as ...

Utilizing the Material Design card div element, however the elements inside the card are not properly aligned in the center

I'm attempting to include the align="center" attribute to this Material Design Lite card: <main class="mdl-layout__content" align="center"> <div class="mdl-cell mdl-card mdl-shadow--4dp portfolio-card"> <div class="mdl-card__title"&g ...

Middle align an absolutely positioned block within a table cell vertically

Here is the code I am working with: td { border: 1px solid #cecece; position: relative; padding: 80px 20px; } .hint { background: yellow; position: absolute; top: 0; bottom: 0; left: 100px; } <table style="width:800px"> <tr> ...

Troubles with Bootstrap's column functionality causing issues

Trying to create a menu using Bootstrap, but experiencing issues with the 'col' class not working correctly. Here is the sample HTML code provided: <div class="logo col"> <a href="index.html"><img src="C ...

Tips for applying CSS styles to the active page link

Check out the code below: Is there a way to assign a specific class to the current page link so that the mouse cursor will display as default rather than changing to a hand icon? I'm looking for a solution where I can apply a class to the active lis ...

issue with the display of tables in web browsers

I'm working on code to display seat availability on a stage. The issue is that when the page loads, it displays the default stage based on category color. However, when I select a specific group from the dropdown menu, it takes too long to load the co ...

How can I align the selected option to the left in a CSS/jQuery selectbox?

I've been struggling to get the selected option aligned left like the other dropdown options. Even though I've added 'text-align:left;' in every CSS option, it's not working. I suspect that the JavaScript code is affecting the al ...

Creating adaptable horizontal grids is straightforward with these steps

Is it possible to create a 3 horizontal responsive grid using only CSS and HTML, without relying on any framework? I've attempted it but am struggling to come up with a solution. ...

What is the best way to include a final tag on its own line?

I'm trying to add a new line for "Payment Remaining", but it doesn't go to the next line as expected. I need the final text to be on a separate line, Payment Remaining #authorization-wizard-start-work .btn-group label.active { color: #009 ...

Issue with margin-top in combination with clear:both does not function as expected

<div style="float: left;">Left</div> <div style="float: right;">Right</div> <div style="clear: both; margin-top: 200px;">Main Data</div> What is causing the margin-top property to not work as expected for 'Main Dat ...

Assistance needed in restructuring code to eliminate white space between Divs

I am looking to combine two divs in the header section of my website. Both divs should have a black background with no white space between them. Can anyone provide advice on this? Additionally, I would appreciate any recommendations on how to structure my ...

Eliminating Redundant Styles in Specific CSS Files with Gulp, When They Already Exist in a Shared CSS File

Is there a way to eliminate redundant styles in individual css files that are already defined in a common.css file? common.css contains the following styles. .nav { background-color: red; } home.css includes the following styles. .nav { backgroun ...

adjusting the font size based on the size of the screen

Hi everyone, I've encountered an issue with adjusting font sizes based on screen size. My framework is Bootstrap 3 and I'm using LESS. Here is the initial part of my LESS code: @font-size-base: 16px; @font-size-large: ceil((@fo ...

What are the reasons that execCommand does not function correctly when attempting to justify text?

Why isn't justify with execCommand working properly? Take a look at the code below: $('#JustifyLeft').click(function(){ document.execCommand("JustifyLeft", false, ""); }); <script src="https://ajax.googleapis.com/ajax/libs/jquery/2 ...

Can an animation be created that transforms an SVG line into a flawless circle?

Is there a way to create an animation that starts with an SVG line and gradually widens from the center to form a perfect circle? I've been researching this, but haven't found a solution that meets my needs. It could be because of the keywords I ...

What is the best way to add a scrollbar above a table?

My table is wide and doesn't fully fit on normal monitors. Is there a way to add a scroll bar above the table or the container div? Check out the scroll bar used in the users table of Discourse here. HTML <div id="table_div"> < ...

The material icons CDN does not seem to be functioning properly in Next.js

After adding a CDN to the head section of my Next.js project, I encountered an issue where it was not working as expected. import Head from "next/head"; <Head> <link href="https://fonts.googleapis.com/icon?family=Material+Ico ...

How to create a see-through background using three.js

I am new to working with three.js and recently came across a codepen that caught my attention. However, I am facing difficulties while trying to change the background color. After exploring various questions related to this issue, I attempted to add { alp ...

Generating an interactive Datepicker using Jquery

How can I design a dynamic date picker similar to the image provided below? https://i.sstatic.net/euoNI.png I have attempted to create one, but I am looking for a more interactive date picker. Is there a way to achieve the design shown in the image? The ...

Building a website using Bootstrap: A step-by-step guide

Wondering how I can incorporate all the cool Bootstrap components into a webpage. Is there a tool that offers live preview? Back in the day (web 1.0), Dreamweaver was my go-to for creating HTML and basic CSS, but what are some current tools where I can si ...