More in this section

Forums / General Discussions / Link a CSS file to Template

Link a CSS file to Template

9 posts, 2 answered
  1. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    28 Feb 2011
    Link to this post
    Hi,

    I am trying to link a CSS file to one of the default templates like I could in 3.7 but can't seem
    to manage. Is it possible?

    Many thanks,
    Andrei
  2. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    28 Feb 2011
    Link to this post
    I can see though that I can attach a link to the CSS file in the page properties.
    Not the place where I want it I must say, but its ok if nothing else.

    So I added the link: <link href="~/App_Master/Default.css" rel="stylesheet" type="text/css" />
    to the place where the CSS file is and still does not work. My Button does not get styled.

    ???

    Many thanks,
    Andrei
  3. Steve
    Steve avatar
    3037 posts
    Registered:
    03 Dec 2008
    28 Feb 2011
    Link to this post
    Try using the CssLinker control in the toolbox (or map it into the masterpage markup directly) so you cal use relative URLS.

    What I've been doing is putting a ContentPlaceholder at the bottom of the masterpage where I can plop in the JS\CSS controls when needed.
    Answered
  4. Andrei
    Andrei avatar
    553 posts
    Registered:
    27 Nov 2008
    01 Mar 2011
    Link to this post
    Thanks Steve,

    I have built my own MasterPage now and directly linked it in the header.
    I thought the option to link a CSS file to a given Template should be available.
    It was in 3.7 otherwise, all the default templates provided are useless for me.

    I don't really want to go down the Themes route so looks like I need to use just
    self-built templates.

    Thanks anyway, all works now.
    Andrei
  5. Boyan Barnev
    Boyan Barnev avatar
    1429 posts
    Registered:
    30 Oct 2017
    04 Mar 2011
    Link to this post
    Hi Andrei,

    Thank you for contacting Telerik Support.

    You can go to ~/Sitefinity/Design/PageTemplates and open the existing template you wish to add CSS to. Drag a Scripts and Styles >> CSS widget and there you can specify the location of your .css file, or paste the code inside the widget. I've attached a sample screenshot for your convenience.


    Regards,
    Boyan Barnev
    the Telerik team
    Answered
  6. John
    John avatar
    22 posts
    Registered:
    14 Jan 2011
    09 Sep 2011
    Link to this post
    Hi,

    I'm using SF 4.2.

    Any suggestions to this ?

    I need to link a CSS stored in the theme's folder in a build-in template directly ? 
    The file is in App_Data/Sitefinity/WebsiteTemplates/Master/App_Themes/MYTHEME/STYLES.CSS.
    The App_Data is forbidden to browse, so the file is unavailable to use it in a page. 
    SF doesn't resolve the address like a ResourceLinks control used in code behind do it.

    I don't want to use the theme's GLOBAL folder because it loads the css file in all pages. I need it just in one template.
    I don't want to use just another theme with a GLOBAL folder just for ONE css file.

    Is just this possible ?

    Thanks,

    John.
  7. Steve
    Steve avatar
    3037 posts
    Registered:
    03 Dec 2008
    09 Sep 2011
    Link to this post
    Hey John. It rewrites App_Data to this format:
    /Sitefinity/WebsiteTemplates/<THEMENAME>

    So try:
    /Sitefinity/WebsiteTemplates/MYTHEME/STYLES.CSS
  8. John
    John avatar
    22 posts
    Registered:
    14 Jan 2011
    09 Sep 2011
    Link to this post
    Thanks Steve, that works in IIS with the project as root. ie: http://localhost:6464/Sitefinity....

    But when I use the SF Manager Web Server it doesn't work because it generates a url like this:
    http://localhost:89887/ProjectName/Sitefinity....

    Any ideas to make this works too ?

    Thanks again,

    John.
  9. Steve
    Steve avatar
    3037 posts
    Registered:
    03 Dec 2008
    09 Sep 2011
    Link to this post
    Use the CSS Widget somewhere on your template (this is what I do)

    Then plop that code in there as something like this ~/Sitefinity/WebsiteTemplates/MYTHEME/STYLES.CSS

    **Edit** incidentally if you setup your dev site on IIS as local.site.com then deploy to www.local.com you'll have a TON less headaches (and IIS7 is way faster than casini)
9 posts, 2 answered