More in this section

RadMenu Skins

7 posts, 0 answered
  1. Jason
    Jason avatar
    31 posts
    Registered:
    07 Nov 2007
    20 Nov 2007
    Link to this post
    Greetings,

    I am currently using Sitefinity version 3.1 for development.  While I find the controls and their skins amazing out of the box, our designer would like to modify these to fit our sites look and feel.

    Try as I might, however, I cannot seem to grasp how these are working, let me explain my steps:

    First I attempted to modify the existing css file under ~/RadControls/Menu/Skins/Default2006/style.css but nothing changed from an appereance perspective.  I made more drastic changes (changed every color reference to Lime) still nothing changed.

    I then copied the entire directory to a new location and named it after the theme our site will use.  I figured if I reference this Skin Ill get the same look, no dice.  Based on the appearence it would seem that Sitefinity is not seeing the theme.

    Based on what I have read, it would appear other modifications need to be made to make the theme available, but the paths that are referenced do not line up with what I have.

    I could use some direction there, thanks in advance,

    Jason
  2. Nikolay
    Nikolay avatar
    21 posts
    Registered:
    24 Feb 2016
    20 Nov 2007
    Link to this post
    Hi Jason,
    Most probably, you have not set Skin and SkinsPath properties anywhere. In this case, the applied skin looks like the Default skin but it is hard coded and not editable through the css files. In order to avoid this, please consider the 3 cases below.

    1. If the menu control is added through the Page Manager in Sitefinity (i.e. you dragged and dropped a RadMenu from the toolbox in edit page mode), you need to set the Skin property to "Default" in your case.
    This is how to do this:
    1. Click Edit in the menu control header.
    2. Expand the Appearance section.
    3. Find the Skin property and set it to Default .
    4. Please also check the SkinsPath property, it should point to ~/RadControls/Menu/Skins .
    5. Click I'm done.

    2. If the menu control is added to your master page, then you need to set the Skin and SkinsPath properties manually, for example:

    <radM:RadMenu ID="RadMenu1" DataSourceID="SiteMapDataSource1" runat="server" Skin="Default" SkinsPath="~/RadControls/Menu/Skins" > </radM:RadMenu>

    3. If you have created your own theme in the App_Themes folder, copy the ~/RadControls/Menu/Skins/Default folder there (or any other skin folder you want) and add a RadMenu.skin file to the App_Themes/YourTheme folder.
    Then, in the RadMenu.skin file, set the Skin and SkinsPath properties like this:

    <radM:RadMenu
    runat="server" SkinsPath="~/App_Themes/YourTheme" Skin="Default"
    >
    </radM:RadMenu>


    Greetings,
    Nikolay
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. Jason
    Jason avatar
    31 posts
    Registered:
    07 Nov 2007
    20 Nov 2007
    Link to this post
    Greetings Nikolay,

    Thank you very much for your response, I was able to learn a bit more about how Sitefinity works internally.  However, I am not sure if my problem was addressed, let me clarify my situation.

    I do understand how to skin the individual controls.  However, we are not using a Theme, so to speak for the pages (though this may make things easier in the end), what I am trying to do is this:

    I have the SiteMenu user control placed on the page and I change the Skin to whatever I like, right now Default2006 is the most appealing.  However, I would like to create my OWN skin for this one control, once I see how that is done, I imagine it would be fairly easy to extend this for other similiar needs.

    This was my aim with simply copying the Default2006 folder and renaming it.  I left the SkinsPath the same in the control (in the case i am working with it will be harded coded into a parent template) and changed the Skin value to 'CompanyName'

    Is there something I am missing with your previous response?

    Thanks,

    Jason
  4. Nikolay
    Nikolay avatar
    21 posts
    Registered:
    24 Feb 2016
    21 Nov 2007
    Link to this post
    Hi Jason,

    Sorry, I have missed one point. When you copy the skin folder and rename it, you need to open the CSS file and change all class selectors from this type (for example): .RadMenu_Default2006 to this type .RadMenu_YourSkinName (you can use a global find&replace).

    You need these changes because when you set the Skin property for a control, the control changes the class names of its elements, adding the name of the skin as a suffix.
    I think this will help you.

    Sincerely yours,
    Nikolay
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. Jason
    Jason avatar
    31 posts
    Registered:
    07 Nov 2007
    26 Nov 2007
    Link to this post
    Greetings Nikolay,
    Thank you very much for your previous reply, unfortunetly I am still having trouble.  I think that up to this point I have not been clear, or what I am trying to do is simply not possible, let me explain the steps I have taken since reading your replies.

    1) Underneath the directory ~/RadControls/Menu/Skins I copied the Default2006 subdirectory.  I pasted this copy in ~/RadControls/Menu/Skins and gave it the name Website.  Within this directory I opened the styles.css file and did a global replace of Default2006 with Website

    2) I then opened up the Sitefinity Page Manager and added an instance of the SiteMenu control I set its Skins property to Website and double checked the skins path which is: ~/RadControls/Menu/Skins

    After clicking Im Done the page refreshes and I see the SIteMenu control that has no styles.  Basically its just standard text with no styles applied, which leads me to believe that it cant find the styles it needs.  I believe I am missing something.

    We do not want to create a Theme, just a skin for the menu control, is this possible without create a theme.

    Thanks in advance,

    Jason
  6. Pepi
    Pepi avatar
    981 posts
    Registered:
    31 Jan 2017
    26 Nov 2007
    Link to this post
    Hello Jason,

    You could create just a Skin and it is not necessary to create a Theme. You need only to copy Default2006 folder and rename the copy to Website. After that replace "Default2006" string in styles.css with "Website" and set RadMenu Skin property to Website. If this doesn't help, please send us your custom skin to test it locally.

    Thanks for your cooperation in advance.

    Best wishes,
    Pepi
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  7. Nikolay
    Nikolay avatar
    21 posts
    Registered:
    24 Feb 2016
    27 Nov 2007
    Link to this post
    Hi Jason,

    I think I found your problem.
    The RadControls folder is hidden by default. Make it visible and, I think, your skin will be applied.

    Best wishes,
    Nikolay
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Register for webinar
7 posts, 0 answered