About EnableEmbeddedSkins

[binbin]

Hi ,When i try to use rad for asp.net ajax,
I found it is difficult control the skin.

I know all resource it is embed to assembly.
What is i want , when EnableEmbeddedSkins is go to false , please get the resouce from Skins folder. (Like Old version read the resource from radcontrols ) so people can easy to change some items on that.

but no css for now.
and we need add the css file to head <link href=""...   >
by manual

May be ,I miss some point. 
do you have a good idea for this.

[Stuart Hemming]

Binbin,

I'm not totally sure I've got the point of your post, but let me comment on what I think you are suggesting.

I think you're saying that if I set EnableEmbeddedSkins=false you want the system to copy the relevant css files and add the necessary <link> tag to the page.

This is a bad idea for a number of reasons.

I, personally, don't advocate altering a 'standard' skin. I prefer to make a copy of the skin, rename it and alter that. I'm sure, however, that there are many who do it the other way. If you are one of those that keeps the 'standard' skin name and modifies it, aren't you in danger of losing your changes if the system is allowed to just copy the 'standard' files over the top?

If you do use a non-standard name for your skin, how can the system add the <link> tag automatically, unless, of course, we go back to each component having it's own SkinsDir property.

FWIW, I have a little static method that I use on pages that have telerik controls. I call this method to ensure that the relevant .CSS files are linked in to the page.

My method reads something like this ...

    static public void RegisterCss(HtmlHead Header, String SkinName, string ControlName) {
      HtmlLink link = new HtmlLink();
      link.Href = String.Format("~/Styles/Skins/{0}/{1}.{0}.css", SkinName, ControlName);
      link.Attributes.Add("type", "text/css");
      link.Attributes.Add("rel", "stylesheet");
      Header.Controls.Add(link);
    }

So, on a page containing, say, a grid and a panelbar I'll have in my initialization method something like ...

PageHelper.RegisterCss(Page.Header, options.Skin, "PanelBar");
PageHelper.RegisterCss(Page.Header, options.Skin, "Grid");

Obviously, if your controls are included at design-time rather than added dynamically, your case may be different. Similarly, if your page can only ever use a single skin.

Still, I hope these idle musing help a little.

--
Stuart

[binbin]

Thank you for your help.

let us remember the old version.

/* RadMenu Plain skin */

.RadMenu_Default2006
{
    background: #ececec url('img/MenuItemBackground.gif') repeat-x;
    border-top: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    border-bottom: solid 1px #bbbbbb;
    border-left: solid 1px #bbbbbb;
}

if we want add backgroudcolor .we can easy add the color item on 
RadControls\Menu\Skins\styles.css

.RadMenu_Default2006
{
    background: #ececec url('img/MenuItemBackground.gif') repeat-x;
    border-top: solid 1px #e5e5e5;
    border-right: solid 1px #e5e5e5;
    border-bottom: solid 1px #bbbbbb;
    border-left: solid 1px #bbbbbb;
color:red;
}

so every menu will get the new skin.

but now, we want change some style on css. what happen. nothing.
we must add the css link by ourself.

<link href="../Skins/Web20/PanelBar.Web20.css" rel="styleSheet" type="text/css" />
    <link href="../Skins/Web20/Menu.Web20.css" rel="styleSheet" type="text/css" />
    <link href="../Skins/Web20/Grid.Web20.css" rel="styleSheet" type="text/css" />
    <link href="../Skins/Web20/TabStrip.Web20.css" rel="styleSheet" type="text/css" />

I add these css on master page.

Do you get.

[Stuart Hemming]

I understand your point perfectly, and you are right about what you need to do, however, in your example, assuming you only wanted to change the background colour of the menu, you'd only need to include a link to the modified CSS file for the menu, not all of the controls.

I can't imagine, using the existing skin mechanism, that there could be another way of doing it.

In my opinion, this method of managing skins is better than the rather disjointed way it was done before. Granted, there is a little more work to do, especially if you do it all manually, but as I suggested in my previous post, you can eaily set things up so that the process is, at least, semi-automated.

--
Stuart

[-DJ-]

Hi guys,

I don't get it Stuart. Why is it better that we have to manually add css links rather than having it done automatically for us like it was back in the days?

Isn't it smarter, as well as less work if the css references to our custom skins would be added automatically just like it's done with embedded skins?

Then, if you have embeddedskins set to false, and you actually stated a name of a skin that doesn't exist in the app_themes folder, you would simply get an error.

Personally I find this new skin setup the single most annoying change from previous versions.

Regards,
-DJ-

[Dimo]

Hi all,

@ binbin

If you only want to change one or two things in an embedded skin, you don't have to set EnableEmbeddedSkins to false and register skins manually. You can just override some of the skin styles. Please refer to the following blog post:

How to Override RadControls' Embedded Skins

@ - DJ -

The idea behind the new skinning mechanism is to give more freedom to the developers in case they do not use embedded skins. In this case they can control not only the location of the custom skins, but can also combine numerous CSS files (for example all controls' skins) into a single file, thus reducing the number of HTTP requests. So EnableEmbeddedSkins="False" means now "don't do anything automatically and let me handle things myself".

On the other hand, if a person does not want a custom skin, we have made deploying RadControls easier than before, because there is no "RadControls" folder with skins at all.


Kind regards,
Dimo
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[-DJ-]

Hey Dimo,

I can't and won't argue against speed. But still I doubt many are actually joining all the css files into one, can't see myself doing it until a project is 100% final at least.

I think that introducing a property like "autowireupcustomskins" or something like that would have made sense for some.

As we grow used to the new approach it's not that much hassle, but it really felt awkward at first.

Regards,
-DJ-

[Dimo]

Hello -DJ-,

We have something like "autowireupcustomskins", however it works for CSS files, which are embedded resources. This is the RadStyleSheetManager.

http://www.telerik.com/help/aspnet-ajax/radstylesheetmanager.html

As for the automatic registering of CSS files and skins - you can use an ASP.NET theme to achieve the same result.


All the best,
Dimo
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[-DJ-]

Hi Dimo,

Thanks for the heads up on the RadStyleSheetManager. I had no idea such a thing existed.

It looks like a great approach to me, and I will surely experiment with it.

Regards,
-DJ-