+1-888-365-2779
Try Now
More in this section

Forums / Designing with Sitefinity / Skin sitefinity controls

Skin sitefinity controls

10 posts, 0 answered
  1. steeeeeeeeeee
    steeeeeeeeeee avatar
    8 posts
    Registered:
    15 Nov 2006
    01 Apr 2008
    Link to this post

    How do I go about skinning the appearance of the sitefinity controls?

    I have been unable to find any documentation that was any help. The brief example in the docs illustrates skinning a rad control, but how do i know how to reference the sitefinity controls? The controls I am looking at to skin are the search box and the tree view navigation.

    If anyone can provide example / explanation on this I would be very grateful!

    also does any body know why the properties have no effect? such as setting the width of the search box for example?

    This all seams much more complicated than it should be!

    Cheers!

    Ste
  2. Georgi
    Georgi avatar
    3583 posts
    Registered:
    28 Oct 2016
    03 Apr 2008
    Link to this post
    Hi Stephen,

    You can change the styles of both controls. For the searchBox, the template is located in \[YourProject]\Sitefinity\ControlTemplates\Search. For the TreeView navigation, we've provided some skins, they are located in  \[YourProject]\RadControls\TreeView\Skins.
    You can specify which skin you would like to use in TreeView control designer. I have attached a screenshot, showing that designer and the place where you specify the SkinID. You could later change the skin depending on your needs.
    Please note that the searchBox control also has a designer where you can set some styles options.

    I hope you find this information helpful.

    All the best,
    Georgi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. SelAromDotNet
    SelAromDotNet avatar
    912 posts
    Registered:
    18 Jul 2012
    20 Jun 2008
    Link to this post
    what about skinning the other controls like combobox that don't have a skin folder? these use embedded skins and try as I might I cannot get the css to work correctly, especially for the combobox. I tried adding a cssclass property and this works for the box itself, but the dropdown menu doesn't get rendered with this cssclass so it uses the default embedded skin

    is there a workaround to this?
  4. Georgi
    Georgi avatar
    3583 posts
    Registered:
    28 Oct 2016
    24 Jun 2008
    Link to this post
    Hello SelArom,

    I assume you are asking about the RadComboBox, is that correct?
    Please follow the instructions described in the RadComboBox skinning article, and Creating a Custom Skin tutorial.

    I hope the provided information is helpful.

    Greetings,
    Georgi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. steeeeeeeeeee
    steeeeeeeeeee avatar
    8 posts
    Registered:
    15 Nov 2006
    16 Sep 2008
    Link to this post
    Hi,

    I have just created a new page that has a second treeview control on it which I need to be styled differently to the first.

    I thought this should be a simple thing to do by creating a different skin for it and then setting it in sitefinity.

    However the skin of the first treeview object is over-riding the colours of the second control. They both use the images of there individual style correctly, its just the colours that dont.

    Is this a bug you are aware of? Do you know a way I can get round this?

    Regards

    Stephen. 
  6. Joe
    Joe avatar
    138 posts
    Registered:
    24 Sep 2012
    16 Sep 2008
    Link to this post
    Hi,

    Thanks for contacting us.

    This issue is not a bug. The skins for the Telerik controls, which does include the RadTreeView for ASP.NET AJAX, are compiled into Telerik.Web.UI, which is the assembly that controls the source code for RadControls for ASP.NET AJAX. You need to open the template that has the RadTreeView (~\Sitefinity\UserControls\Navigation\SiteTreeview.ascx) and create a custom skin as this article will show you.

    I hope that I have provided a solution for your technical issue. Feel free to contact us if you need further assistance.

    Kind regards,
    Joe
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  7. steeeeeeeeeee
    steeeeeeeeeee avatar
    8 posts
    Registered:
    15 Nov 2006
    18 Sep 2008
    Link to this post
    Hi,

    Sorry Im still a little unclear.

    So just to be clear, the appearance section of the SiteTreeview control properties has a skin property. In the past I have been able to use this to select which of the built in skins I want this control to use. 

    In addition to this I have been able to create new skins, by copying and modifying existing skins, then using the skin property to set the control to use this skin.

    This all works fine, and in this case with the SiteTreeview control it also works fine. I can set the skin to any of the skins I have in my '~/RadControls/TreeView/Skins' folder and it works.

    The problem occurs when I have two SiteTreeview controls on the same page that need to be set to different skins. 

    They both get the correct images used in their individual skins, but the colours from one skin are used on both.

    Im not sure how this all relates to being complied into Telerik.Web.UI. 

    So when I set a skins path and skin name in the appearance section of the control properties am I not using the actual css and images from that path? Are they coming from a complied version?

    If so that still doesn't explain how they can be both using different skins as instructed, but only using the colours for the links from one of the skins?

    Please can you explain how it works in basic terms for me :)

    Cheers

    Ste

  8. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    23 Sep 2008
    Link to this post
    Hello Stephen,

    The described behavior was reproduced only with the classic RadControls used by Sitefinity. In our upcoming release all classic RadControls will be replaced with the new ones (RadControls for ASP.NET AJAX). For the time being you could migrate the SiteTreeview control (~/Sitefinity/UserControls/Navigation/SiteTreeview.ascx) to use RadTreeView for ASP.NET AJAX.

    Please find the SiteTreeview.zip attachment prepared for your convenience. Let us know if this works at your end.

    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Check out Telerik Trainer, the state of the art learning tool for Telerik products.
  9. Ivaylo
    Ivaylo avatar
    2 posts
    Registered:
    01 Sep 2009
    02 Feb 2010
    Link to this post
    It appears in version 3.7 the \[YourProject]\RadControls\ folder is gone. Where are the skins stored now (for the RadMenu for example) ?

    Thanks,
    ID
  10. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    02 Feb 2010
    Link to this post
    Hi Ivaylo Durchev,

    The built-in skins are embedded into Telerik.Web.UI.dll. You can create a custom skin following this articles  Tutorial: Creating A Custom Skin and Controling appearance of RadControls for ASP.NET AJAX in Sitefinity

    Regards,
    Ivan Dimitrov
    the Telerik team

    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
    Follow the status of features or bugs in PITS and vote for them to affect their priority.
Register for webinar
10 posts, 0 answered