This is a migrated thread and some comments may be shown as answers.

Custom StyleSheets for Telerik controls

6 Answers 269 Views
Visual Style Builder
This is a migrated thread and some comments may be shown as answers.
Manoj Bhatty
Top achievements
Rank 1
Manoj Bhatty asked on 09 Jul 2009, 08:59 PM
Hi All,

We have front end designers on our team who would prefer to create and maintain stylesheets for styling the controls as opposed to using Visual Style Builder. When I look at the css classes in firebug, they all seem to be coming from WebResources etc.

I suppose we can just apply CssClass attributes to different elements to override it? But what would be the recommended way of doing it?

Ideally we want to change as little as possible in the aspx page itself and control the styling from our own CSS files as much as possible. Any suggestions and best practices?

Thank You,
Manoj

6 Answers, 1 is accepted

Sort by
0
Manoj Bhatty
Top achievements
Rank 1
answered on 14 Jul 2009, 02:54 PM
Hello All,

Anything on this? Any comments from the Telerik Admins will be much appreciated.

We are trying to help our web designers to evaluate the css-configurability of the Telerik suite.

Manoj
0
Alex Gyoshev
Telerik team
answered on 14 Jul 2009, 03:08 PM
Hi Manoj,

The Style Builder is an extension to simplify the skinning process. If you want to write the styles all by yourself, please refer to the following blog post and help topics.

I'd love to hear the feedback on the StyleBuilder from your front-end developers - to be exact, what functionality do they think is missing?

Regards,
Alex
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Manoj Bhatty
Top achievements
Rank 1
answered on 14 Jul 2009, 03:20 PM
Hi Alex,

Thanks for the links, I'm going through them now.

About the front end designers, they have very strong PHP and non-dotnet web development background so it's just that they are comfortable with their custom css files approach to web design. They pretty much prefer to use dreamweaver etc and are not comfortable with visual studio, that doesn't help either. But I'll go through StyleBuilder as well and see the possibility of training them in visual studio.

Manoj
0
Alex Gyoshev
Telerik team
answered on 14 Jul 2009, 03:32 PM
Hi Manoj,

The style builder is built in a way that it does not require .NET knowledge - primarily for designers and front-end developers - and is an online tool, so it doesn't require Visual Studio. (the requirements are only Firefox 3.5 or Internet Explorer 7/8 and Silverlight 2). Therefore, they can safely change the styling of the controls (without learning all control-specific styles) and fine-tune what they want in the exported CSS files (the style builder exports plain CSS + images, after all).

Sincerely yours,
Alex
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Manoj Bhatty
Top achievements
Rank 1
answered on 14 Jul 2009, 04:59 PM
Thank you Alex, I went through StyleBuilder and it seems it the front end designers should be able to use it for all modifications.

I also played around with creating and implementing custom skins and it all worked out wonderfully.

Now I've one last question - From your links, I see that I can set EnableEmbeddedSkins to false and then register and modify my own skins. What I couldn't figure out was EnableEmbeddedBaseStylesheet property. Taking TreeView for example, the CSS is TreeView.MyNewSkin (skin named MyNewSkin). Are there any other CSS files that I'll need to register if EnableEmbeddedBaseStylesheet is False?

Thanks,
Manoj
0
Alex Gyoshev
Telerik team
answered on 15 Jul 2009, 08:08 AM
Hi Manoj,

The base stylesheet holds only skin-agnostic CSS - e.g. layout and positioning properties. To use a custom skin, you should set only these two:
  • the Skin property (to the name of your newly created skin)
  • the EnableEmbeddedSkins property to "false" (so that the skin is loaded from the external CSS that you should manually link in the page)
This way, the base stylesheet will be loaded from the assembly; in most scenarios, it does not need tweaking - it is meant to work with all skins.
Best wishes,
Alex
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
Tags
Visual Style Builder
Asked by
Manoj Bhatty
Top achievements
Rank 1
Answers by
Manoj Bhatty
Top achievements
Rank 1
Alex Gyoshev
Telerik team
Share this question
or