2010

Using cfcontent to serve up Coldfusion generated CSS documents

Posted By : Shaun McCran
Related Categories: Coldfusion, CSS

The article deals with using cfcontent to serve up dynamic data driven CSS. I'll use Coldfusion to embed variables in a cfm file, then use cfcontent to have the browser serve the content as a CSS file.

Whilst building the latest version of a framework I wrote a routine using cfsavecontent to generate a CSS document that had embedded Coldfusion variables in it. This was an effective way to generate dynamic CSS although it has left me in a position where the CSS is fully visible in the source code.

To get around this I changed the code to this:

view plain print about

1<cfcontent type="text/css; charset=ISO-8859-1">
2<cfset variables.imglocation = "##00ffff">
3
4<cfoutput>
5/* CSS Document */
6
7* {margin:0px; padding:0px; border: 0px;}
8
9select,input,textarea{border-width: 1px; border-style: solid; border-color: grey;}
10
11.borderless{border: 0px;}
12
13a {color: 000;}
14
15body{font-family:Arial, Helvetica, sans-serif; font-size:12px;
16background-image:url(#variables.imglocation#/images/bgrd.jpg); background-repeat:repeat-x; background-color: ##ffffff;}
17</cfoutput>

The CSS is generated and the variables are embedded. Then the page is then processed by CF, but since the cfcontent sets the page to be served with a text/css mime-type the browsers recognizes the page as css. This means you can call the stylesheet just like normal.

view plain print about

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

Comments (17) |

Send |

del.icio.us |

Digg It! |

Linking Blogs |

Answer Questions

TweetBacks

Comments (Comment Moderation is enabled. Your comment will not appear until approved.)

[Add Comment] [Subscribe to Comments]

This is a great way to integrate dynamic CSS / JS and ColdFusion. I've written a CFC module called ScriptWriter that uses this same method and, if you want, let's you take it a few steps further by minifying the content in the <cfsavecontent> and even writing it to an external file.

http://scriptwriter.riaforge.org/

# Posted By Matt Gersting | 11/05/2010 19:05

Hi Matt,
Thanks for the comments, and for the link. I'll go check it out, it may well prove that I end out using that.

I was going to look at actually writing a css file with coldfusion variables in it, but hadn't got that far yet.

# Posted By Shaun McCran | 11/05/2010 22:29

what is cfcontent?

# Posted By crusher | 14/05/2010 08:13

Cfcontent is a tag that allows you to set (or reset) the MIME type for the current page. IE force the browser into thinking the page is something it isn't. In this case a style (CSS) sheet.

http://help.adobe.com/en_US/ColdFusion/9.0/CFMLRef...

# Posted By Shaun McCran | 14/05/2010 10:01

# Posted By roof repair | 14/10/2015 06:22

but since the cfcontent sets the page to be served with a text/css mime-type the browsers recognizes the page as css. This means you can call the stylesheet just like normal.

# Posted By Employment Attorneys | 18/10/2015 00:13

served with a text/css mime-type the browsers recognizes the page as css. This means you can call the stylesheet just like normal.

# Posted By Build My List 2.0 Jimmy Kim | 03/11/2015 05:26

I was helping a friend setup a custom tag path on his server demonstrated this. He couldn't remember where the web root was to point ColdFusion server at his custom tags directory.

# Posted By click here for more info | 13/12/2015 21:52

I'm able to bookmark your site and show the kids check out up here generally. I m fairly positive there likely to be informed a great deal of new stuff here than anyone.

# Posted By Experienced Adverse Side Effects from Xarelto? You | 19/12/2015 02:10

I m fairly positive there likely to be informed a great deal of new stuff here than anyone.

# Posted By dedicated server | 19/12/2015 03:29

Great Post This is also a very good post which I really enjoyed reading. It is not everyday that I have the possibility to see something like this..Thank You!

# Posted By Dental Assistant | 21/12/2015 02:18

Firstly create a CurrencyFormatter object, and specify the currency symbol, and any other formatting parameters that you require.

# Posted By term papers for sale | 26/12/2015 02:11

Good to become visiting your weblog again, it has been months for me. Nicely this article that i've been waited for so long.

# Posted By this link | 28/12/2015 01:43

Your site and show the kids check out up here generally. I m fairly positive there likely to be informed a great deal of new stuff here than anyone.

# Posted By this link | 29/12/2015 00:25

Good to become visiting your weblog again, it has been months for me. Nicely this article that i've been waited for so long.

# Posted By supreme garcinia cambogia reviews | 05/01/2016 23:59

it has been months for me. Nicely this article that i've been waited for so long.

# Posted By packers and movers pune to hyderabad | 13/01/2016 23:05

I have feel that this blog is really have all those quality that qualify a blog to be a one.I wanted to leave a little comment to support you and wish you a good continuation.

# Posted By DUI Lawyer | 19/01/2016 23:54

[Add Comment]

Shaun Mccran

Using cfcontent to serve up Coldfusion generated CSS documents