January 8, 2005

Including CF in a CSS page.

Sometimes, it is just beneficial to include cf code within a css file.

In order to do this first save the CSS file with a .cfm extension, for example style.cfm.

Next, at the top of the css file, add the following cfcontent tage

<cfcontent type="text/css; charset=ISO-8859-1">

The page is then processed by CF, but since the cfcontent sets the page to be served with a text/css mime-type resulting in browsers recognizing the page as css.

Finally, to include the file within your cfm page as follows

<link rel="stylesheet" href="style.cfm" type="text/css" />

A side note is to remember to escape the pound signs within the css page when necessary.

Posted by Elyse at January 8, 2005 8:31 AM | TrackBack
Comments

To beat Paul Hastings to it, Unicode is your friend. :)

Posted by: Robby at January 8, 2005 9:55 AM

I have included many php codes straight into css without doing any file extension change. I am not sure of the CF cases but I think CSS will just throw out what it have in its belly to the browser. For instance if you link to a php instead of an image source and if the php code have function to rotate through an image directory, it will just do what that PHP does "display the images".

Posted by: Brajeshwar at January 8, 2005 10:15 AM

That's cool and all, but you should really set some headers (with CFHEADER) as well so you don't lose the benfit of caching your CSS. Setting an expires datetime seems to be enough usually. dynamically setting it ahead a day or so is usually enough, unless you know your CSS will not change again and then longer is fine.

Posted by: Doug Gibson at January 8, 2005 1:19 PM

Thanks for the tip! As someone who builds many variations of CMS tools, I'm always looking for ways to optimize things, and this might be very helpful!

cheers.

Posted by: Nolan at January 8, 2005 1:50 PM

not wanting to sound obtuse or anything, but I can't think of a situation to warrent it...

can I bug you with a "f'instance" ? just to illistrate why?

thanx
barry.b

Posted by: barry.b at January 9, 2005 5:48 PM

Hi Barry,

How about a different background picture, or color scheme passed on time of year, different receiving pages, or something else.

HTH,
Anticlue

Posted by: Elyse at January 11, 2005 6:48 AM