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

Forums / Designing & Styling / CSS Load order

CSS Load order

2 posts, 0 answered
  1. Nathan
    Nathan avatar
    2 posts
    Registered:
    08 Jul 2014
    08 Jul 2014
    Link to this post

    I have several different css files my template needs to load. I have created a cssLoadOrder.xml, and its in my themes Global folder. However, when I'm previewing the template, it loads the stylesheets in a different order.

    My XML

    <?xml version="1.0" encoding="utf-8" ?>
    <cssFiles>
        <file>reset.css</file>
        <file>jquery-ui.css</file>
        <file>jquery-ui.theme.css</file>
        <file>layerslider.css</file>
        <file>slick.css</file>
        <file>animate.css</file>
        <file>style.css</file>
    </cssFiles>

    What the preview HTML outputs

    <link href="/Telerik.Web.UI.WebResource.axd?compress=0&amp;_TSM_CombinedScripts_=%3b%3bTelerik.Sitefinity.Resources%2c+Version%3d7.0.5100.0%2c+Culture%3dneutral%2c+PublicKeyToken%3dnull%3aen%3a30c67b5a-b8cd-4dd5-8715-843d20404812%3a7a90d6a%3a83fa35c7" type="text/css" rel="stylesheet" /><link href="/Sitefinity/Public/ResponsiveDesign/layout_transformations.css?unique_key=cd1d387e-a970-430f-bdb5-d395f85ed4a5" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/style.css?v=635404301239353694" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/animate.css?v=635404269873538325" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/jquery-ui.css?v=635404269848110162" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/jquery-ui.theme.css?v=635404269850762179" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/layerslider.css?v=635404269853414196" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/reset.css?v=635404269855286208" type="text/css" rel="stylesheet" /><link href="/Sitefinity/WebsiteTemplates/FritoLay/App_Themes/FritoLay/global/slick.css?v=635404269857626223" type="text/css" rel="stylesheet" /></head>

    They are mostly alphabetical, however style.css is first. I did not use Thunder, or any SDK to create this theme as I am working on OSX. However, I went through admin->settings->advanced->frontend themes and registered my theme, and I can apply it to templates. Is there something I need todo for SiteFinity to reload the cssloadorder? Does SiteFinity cache it or anything?

    Also, I have an external CSS file I need to load - can I tell cssLoadOrder.xml to load remote css files?

  2. Nikola Zagorchev
    Nikola Zagorchev avatar
    424 posts
    Registered:
    24 Nov 2016
    11 Jul 2014
    Link to this post
    Hello Nathan,

    We have answered you in the support ticket. However, I share the ticket reply to the community.
    Regarding the css order xml, it should be verified that the themes are located correctly in the project root, they should be in
    ~/App_Data/Sitefinity/WebsiteTemplates/YourTemplate/App_Themes
    and the .xml order file should be in the following location:
    ~/App_Data/Sitefinity/WebsiteTemplates/YourTemplate/App_Themes/MyTheme/Global/cssLoadOrder.xml and containing all files order. In order an external css to be loaded by the loadOrder it should be in the same folder - the Global folder of the Website theme.

    Regards,
    Nikola Zagorchev
    Telerik
     
    Do you want to have your say in the Sitefinity development roadmap? Do you want to know when a feature you requested is added or when a bug fixed? Explore the Telerik Sitefinity CMS Ideas&Feedback Portal and vote to affect the priority of the items
     
2 posts, 0 answered