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

i'm having trouble with the telerik online style builder

3 Answers 29 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Kareem
Top achievements
Rank 1
Kareem asked on 06 Sep 2012, 03:05 PM
hi .. i'm a web designer and my company just bought telerik and we're using it in one of our applications ... i want to change the grid's css "and every thing else" to the look i designed .. i tried using your online style builder http://stylebuilder.telerik.com 

and choose one of the existing skins to create new one from it .. but when i open the options for editing the grid "fine-tune" i can see very few options to edit  -for example when i choose "Grid Wrapper" all the options i can see are background and box but still i can't edit/add every thing i want .. i can either put a background color or image .. but i want to use css3 background gradient also , box-shadow, border-radius ,etc... "not necessarily for the Grid Wrapper or the grid control alone but for every thing" and any other css3 attributes  .. how can i do that , i wanna have full control over the design/skin ... and "even" when i try to edit the background options provided for the "Grid Wrapper"  nothing happens "IE9 and Chrome" , nothing changes i wait and hit save and wait but it doesn't change even after saving


please help me get full control over the skin

3 Answers, 1 is accepted

Sort by
0
Ivan Zhekov
Telerik team
answered on 11 Sep 2012, 10:04 AM
Hi, Kareem.

The Visual Style Builder is a tool we provide for our customers to tweak the existing skins or create a new one based on existing.

The tool does not necessarily provide full skin customization, but rather facilitates the most common tasks in skin customization, such as changing font names, font sizes, colours, and other minor aspects of the skins.

Extensive skin customization is only done by hand.

We do provide guidance articles for skinning the grid in our documentation -- http://www.telerik.com/help/aspnet-ajax/grid-appearance-understanding-html-css.html. We also have similar topics for each control as well as topics describing the various class names used in the controls.

Regards,
Ivan Zhekov
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Kareem
Top achievements
Rank 1
answered on 11 Sep 2012, 10:18 AM
i see .. from what you told me then the style builder will be useless to me and I'll have to create a custom skin manually  .. but how can i do that using /editing telerik's own css classes? .. i mean can i take the files used for one of telerik's skins (css , images ,etc) and edit it / add to it manually to make it look the way i want? if yes then please provide me with the steps to do that right and to implement it into our app
0
Galin
Telerik team
answered on 14 Sep 2012, 08:34 AM
Hi,

All CSS and image files are located in ~Program Files\Telerik\RadControls for ASP.NET AJAX Q* 20**\Skins. You can see the base CSS files in this folder and the specific files are inside the inner folders.

For example if you need to make custom WebBlue based skin for RadGrid you need the following files:
  •   Grid.css    (base css file)
  •   WebBlue\Grid.WebBlue.css  (specific styles for WebBlue - colours, borders, backgrounds et.c.)
  •   WebBlue\Grid\ all image files here (without WebBlue.gif, which is used for thumbnail icon)

And, here is an example on how to override styles for RadGrid easily:
http://blogs.telerik.com/dimodimov/posts/08-06-17/how_to_override_styles_in_a_radcontrol_for_asp_net_ajax_embedded_skin.aspx

I hope this helps.

All the best,
Galin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Tags
Grid
Asked by
Kareem
Top achievements
Rank 1
Answers by
Ivan Zhekov
Telerik team
Kareem
Top achievements
Rank 1
Galin
Telerik team
Share this question
or