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

Forums / Designing with Sitefinity / Simple CSS Overrides?

Simple CSS Overrides?

5 posts, 0 answered
  1. D
    D avatar
    9 posts
    Registered:
    05 Jun 2009
    05 Jun 2009
    Link to this post
    Crew,

    My situation is thus : I'm using Sitefinity 3.6. I have two master pages, one for the 'splash' (or primary front page), and one for all the subpages. The navigation between these pages is a SiteMenu (dragged from Navigation > Site Menu into a ContentPlaceHolder in both master pages).

    It's set with the "Sunset" theme. (Which I have come to learn, I -think-, is the one hard-coded into the Sitefinity DLLs?)

    Now, what I'd like to do is make one or two simple adjustments to the theme, preferrably with an external CSS file, such as making the UL background color transparent, and removing its border. I can, using something like Firebug or IE Developer Toolbar, test it out and see exactly which classes need to be changed to what for the desired appearance.

    I've read about a dozen threads here from various people attempting to stylize the various rad controls, and can make about zero sense out of any of them, except that this seems to be a pretty common confusion and hardly as easy as it ought to be.

    So, questions:
    1 - Is it even possible to just have an external CSS file with a few "changes", or do I have to go through the process of building an entire Skin, applying the skin to the page that utilizes the master page, and going from there? Obviously, I can see how applying the Blue skin that's there by default adjusts my menu, but it also breaks a lot of the CSS I've built in other places. Is there a simple way to parse down one of these existing templates to only adjust my menu (at which point I can try to manually copy-paste the Sunset theme values on top of the Blue ones, tweak as necessary, etc?) or are these also immutable? It seems like no matter how many files I knock out of App_Themes/Blue with right sidebar (or White fluid, or Levels, etc.) that it changes numerous things about my page, from font sizes to spacing. I -only- want to change the appearance of the radmenu!

    2 - How would I go about disabling the "enableembeddedskins" setting you talk about in all the other threads, in Sitefinity 3.6? This sounds like it's the only way to do what I want to, sadly. I click "Edit" on the SiteMenu object, but there is no EnableEmbeddedSkins setting in any of the four subsections here (Navigation, Appearance, Behavior, Misc). Is this not something that can be done within the CMS admin panel? If not, I'm currently using VS 2005 and opening my web page through that, so where in this morass of folders would I go about creating my "custom" theme for the radmenu?

    Really, I'm just at a loss as to how I could tweak the SiteMenu's appearance without breaking the rest of the page visually, and after a week of metaphorically beating my head against the brick wall of experimentation, I figured I'd come asking for help.

    Wearily but appreciatively,
    -D

    Note: I'm having a similar problem with the NewsView, in that I can't figure out how to apply CSS to do simple things like shrink the size of the titles, remove the excess spacing between the title, date, and summary, etc.. but I'll save that for another time. Let's just worry about the SiteMenu skin thing for now. XD

  2. D
    D avatar
    9 posts
    Registered:
    05 Jun 2009
    08 Jun 2009
    Link to this post
    For now, I've got a partial workaround.. using !important on an earlier CSS file. It's still declared before WebResources, so I haven't figured out how to prevent that unwanted evil, but at least I've got a thread of control over my stylesheet at present.

    Would still love any input from the community, positive, negative, or otherwise. :)
  3. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    10 Jun 2009
    Link to this post
    Hi D,

    Thank you for contacting Telerik Support.

    In my understanding first you want to know how to change the skin of the RadMenu only, without going through the process of building a whole new theme for your site. We have a tutorial on how to create custom skins for your RadMenu. Please look at creating a custom RadMenu skin. In the case of working with Sitefinity you will have to do the following:

    1. Open your project in Visual Studio;
    2. Open App_Themes folder;
    3. Open the theme folder in which you want to modify the appearance of RadMenu (e.g. Orange with left sidebar);
    4. Open RadMenu.skin file.

    From there you can follow the steps described in the "Create A Custom Skin" tutorial.

    You can also modify the RadMenu.skin file to set the use of embedded skins to false.

    EnableEmbeddedSkins="false" 

    If you are going to use one of the embedded skins, set the property above to "true". However you can have several skins and themes. You can add different skin of the menu for each theme.

    As for editing the styles of News View control there are several ways to go about it.

    1. If you want to edit the styles of a particular instance of the News View control you have to choose the Edit option of that control, click Advanced, choose Appearance, and work around with the property fields. You can also input the name of your CSS class in the CssClass field. If you choose to do this will add a div class with the name you specify. However as I said above this will affect only that particular News View Item.
    2. If you want the changes to affect all pages containing a News View item using a particular theme. This can be done through modifying the .css file of that theme. As I can see from your last post you have already done that.
    3. The third way is to map the control use an external template. This can be also done for a single control when editing the ItemListTemplatePath or SingleItemTemplatePath fields, of the Appearance section, to point to your external template. It can be done for all instances of one control in your web site. For more information on how to do that, please read mapping views to use external templates.
            If you choose this approach you need to use CssFileLink control and set the path to your css file.
    I hope this information helps. Please let me know if I can assist you any further with this service request. Thank you in advance

    All the best,
    Rado
    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.
  4. nogatek
    nogatek avatar
    35 posts
    Registered:
    23 Apr 2008
    17 Jun 2009
    Link to this post
    Hi,

    I've implemented a custom skin (overriding the css) for a radmenu and tabstrip control and they render as expected.

    However, sitefinity is still generating styles for both controls via 2 x WebResource.axd responses.

    I've tried setting various properties on the controls themselves, by both overriding the controls and setting them in cms, but still can't eliminated the .axd responses!

    For example, the following has no effect (the control still renders correctly though):

        EnableEmbeddedSkins="false"
        EnableTheming="false"
        Skin="RadMenu"
        SkinID=""
        SkinsPath=""
        CssClass=""

    I'm using sitefinity version 3.6 with the older RadMenu.Net2.dll.

    I'm not ready to stop using these versions of the rad controls just yet, but would really like to know how to turn off the embedded css (and scripts too if possible - this is easy with the newer versions).

    Regards,
    Mark
  5. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    17 Jun 2009
    Link to this post
    Hello nogatek,

    There are base styles that cannot be removed. They are valid for all skins, but you can override them using !important rules.

    Regards,
    Ivan Dimitrov
    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.
Register for webinar
5 posts, 0 answered