# External CSS files

**URL:** <https://www.ruby-forum.com/t/external-css-files/64317>\
**Category:** Radiant CMS\
**Created:** [June 24, 2006, 5:18am UTC](https://www.ruby-forum.com/t/external-css-files/64317 "2006-06-24T05:18:34Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 5:18am UTC](https://www.ruby-forum.com/t/external-css-files/64317/1 "2006-06-24T05:18:34Z")

</div>

I fell in love with Radiant’s simplicity the other day. Now I am seeing  
if I can migrate a couple sites over to Radiant, but I’m not sure how to  
create .css files within the system. Did I something dreadfully  
obviously, or do I have to upload the css file separately?

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 5:23am UTC](https://www.ruby-forum.com/t/external-css-files/64317/2 "2006-06-24T05:23:24Z")

</div>

I think most people are dumping their css into a snippet and referencing  
it  
as needed. One benefit of doing this as a snippet is that you can make  
use  
of radiant tags to dynamically create styles as needed.

-K

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 5:39am UTC](https://www.ruby-forum.com/t/external-css-files/64317/3 "2006-06-24T05:39:20Z")

</div>

Although, the demo site appears to have stuck the css files in public  
and  
simply references them from the layout.

-K

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 6:17am UTC](https://www.ruby-forum.com/t/external-css-files/64317/4 "2006-06-24T06:17:06Z")

</div>

Ha! spoke too soon, had to change my charset to UTF-8. Thank you much  
for the help!

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 6:09am UTC](https://www.ruby-forum.com/t/external-css-files/64317/5 "2006-06-24T06:09:11Z")

</div>

(Reread my original post and I really need to start proofreading.)

Ah ha! so I figured out how they did it in the demo, now if only I  
could duplicate it. I changed the slug to styles.css, though it’s still  
not working, but I’m partway there!

I have the odd feeling that my problem now has something to do with how  
windows deals with line breaks, because my css file now comes out as a  
great jumble: [http://radtest.enguindesign.com/styles.css](http://radtest.enguindesign.com/styles.css)

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 6:18am UTC](https://www.ruby-forum.com/t/external-css-files/64317/6 "2006-06-24T06:18:29Z")

</div>

I’m keeping the .css file in the “public” directory, referencing it  
from an “header” snippet, and adjusting it as needed inside the layout  
file

\*\*\* “header” snippet

 @import "/stylesheets/style.css"; 

(The “\<r:snippet name=“gmaps” /\>” tag includes, for example, a snippet  
with additional javascript code, which has to be put within the html

 tags to handle a google map in the page.)

\*\*\* Layout file

[…]  
\<r:snippet name=“header” /\>  
\<r:unless\_url matches="/en/where"\>  
  
  
#primary .itemtext img {  
margin: 0 5px;  
padding: 4px;  
border: 1px solid #ccc;  
max-width: 100%;  
}  
  
\</r:unless\_url\>  
[…]

Hope this helps.

–M

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 2:25pm UTC](https://www.ruby-forum.com/t/external-css-files/64317/7 "2006-06-24T14:25:40Z")

</div>

Bernard Yu wrote:

> Ha! spoke too soon, had to change my charset to UTF-8. Thank you much  
> for the help!

Be sure to create a layout for stylesheets and set it’s content-type to  
“text/css”.

–  
John L.  
[http://wiseheartdesign.com](http://wiseheartdesign.com)

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 11:04pm UTC](https://www.ruby-forum.com/t/external-css-files/64317/8 "2006-06-24T23:04:58Z")

</div>

Kyle H. wrote:

> By doing that does it treat the stylesheet as an external resource and not  
> embed the contents of the stylesheet in the rendered source? Like it  
> does if  
> you simply link to an external stylesheet? Just curious.

I’m not quite sure what you mean. I was referring to the content type on  
the layout.

–  
John L.  
[http://wiseheartdesign.com](http://wiseheartdesign.com)

---

<div class="post-metadata">

**Author:** ![thebestsophist](https://www.ruby-forum.com/letter_avatar_proxy/v4/letter/t/91b2a8/32.png) [@thebestsophist](https://www.ruby-forum.com/u/thebestsophist)\
**Post date:** [June 24, 2006, 3:42pm UTC](https://www.ruby-forum.com/t/external-css-files/64317/9 "2006-06-24T15:42:57Z")

</div>

By doing that does it treat the stylesheet as an external resource and  
not  
embed the contents of the stylesheet in the rendered source? Like it  
does if  
you simply link to an external stylesheet? Just curious.

Thanks.

-K