Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
I am the chief technical officer at InVision App, Inc - a prototyping and collaboration platform for designers, built by designers. I also rock out in JavaScript and ColdFusion 24x7.
Meanwhile on Twitter
Loading latest tweet...
Ben Nadel at the New York ColdFusion User Group (May. 2009) with:

CFInclude Templates Are Parsed Regardless Of File Type

By Ben Nadel on
Tags: ColdFusion

This is in response to James who said that ColdFusion CFInclude tags will only parse files if they have appropriate extensions (such as .cfm). This is to demonstrate that that is incorrect. CFInclude will parse any file looking for ColdFusion tags. James argued that a CSS file would throw errors when it encountered HEX color values starting with # signs. What he is confused about is that # are only evaluated inside ColdFusion tags or CFOutput tags.

To demonstrate this (and my point about using the Include() method of the page context), I am setting up a simple page and an included CSS file. The CSS file has ColdFusion code on it that will randomly change the background image of the body tag.

Here is the css file:

  • <!--- Create array of background images. --->
  • <cfset arrImages = ListToArray(
  • "http://static.flickr.com/87/234968608_4ea0e7acd4.jpg?v=0
  • http://static.flickr.com/89/234088556_33aef45615.jpg?v=0
  • http://static.flickr.com/71/204064957_cb9ae3892a.jpg?v=0
  • http://static.flickr.com/66/203414399_365e7f3c0f.jpg?v=0
  • http://static.flickr.com/27/44228284_659a202c75.jpg?v=0
  • http://static.flickr.com/78/222477508_683586fe13.jpg?v=0
  • http://static.flickr.com/61/234025928_14b1e2451e.jpg?v=0
  • http://static.flickr.com/61/225523900_c3de2ad93d.jpg?v=0",
  • " #Chr( 13 )##Chr( 10 )#"
  • ) />
  •  
  • #body {
  • background-image: url(
  • "<cfset WriteOutput( arrImages[ RandRange( 1, 8 ) ] ) />"
  • ) ;
  • font: 12px verdana ;
  • margin: 30px 30px 30px 30px ;
  • }
  •  
  • #text {
  • background-color: #666666 ;
  • border: 2px solid #AAAAAA ;
  • color: #F0F0F0 ;
  • padding: 10px 10px 10px 10px ;
  • }

As you can see, we create an array of images. Then, in the body tag, we execute the CFSet tag and the WriteOutput() method to dynamically set the body background image. And, just to exhaust the error-producing possibilities, I have used ID selectors (#) and colors to demonstrate that # signs will NOT throw errors.

Then, I have two main files. One uses the CFInclude tag to demonstrate the parsing of the CSS file and one that uses the GetPageContext().Include() method to demonstrate that it will not parse the CSS file:

  • <html>
  • <head>
  • <title>CFInclude Parsing Test</title>
  • <style type="text/css">
  • <!--- Include the CSS file via CFInclude. --->
  • <cfinclude template="styles.css" />
  • </style>
  • </head>
  • <body id="body">
  •  
  • <div id="text">
  • <h1>
  • This check to see if a CSS file will be parsed if included
  • via the CFInclude ColdFusion Tag.
  • </h1>
  •  
  • <p>
  • If the CSS file IS parsed, the body should have a
  • randomized background image on page refresh.
  • </p>
  • </div>
  •  
  • </body>
  • </html>

The one that uses the page context differs ONLY in the include statement:

  • <!--- Include the CSS file via page context. --->
  • <cfset GetPageContext().Include( "styles.css" ) />

To see these at work, check out the two demos:

Using CFInclude Tag

http://www.bennadel.com/resources/demo/1/index.cfm

Using GetPageContext().Include()

http://www.bennadel.com/resources/demo/1/index2.cfm

On the second demo, view the page source to see that the Include() method actually includes the ColdFusion tag without executing it.



Reader Comments

Good post - simple, clean and to the point! Also, I thought I'd let you know that code samples are coming through as PRE tags, at least in Bloglines.

One compliant -- the choice of images for the sample is a tad bit NSFW.

Reply to this Comment

Demain,

Thanks for the comment and for the confirmation of PRE tags in Blog lines.

As for the images. I agree. I write a lot of this stuff early in the morning and my judgement is not that great. I will tone it back significantly. My appologies.

Reply to this Comment

Oh, don't get me wrong - I personaly don't have a problem seeing beautiful women - it just might be a bit hard to explain if the wrong person walked by my cube while I was, ummm, testing your sample code. ;-)

Reply to this Comment

I'll be honest... you're not the first person to mention it ;) I want to have fun, but at the same time, I don't want to exclude anyone, cause ColdFusion rocks hardcore and no one should be uncomfortable in any learning environment. As a solution, I will stick to ladies ('cause it's just fun) but no "questionable" photos. Just good, clean fun.

Reply to this Comment

Just gotta say Ben that I found your site a few days ago and am addicted to the way you code and the context in which you explain it all. Certainly makes learning much easier ;)

Reply to this Comment

David,

I really appreciate that :D All I want to do it learn and share the knowledge. I couldn't be happier that you are into the way I code and explain things. Please let me know if you ever want me to whip up an example for something or help out with a problem that needs to be solved.

Thanks again!

Reply to this Comment

Is there a coldfusion tag to import html content from external site.

similar to jstl tag <c:import url="${param.url}"/>

I am getting an error on <cfset pc = GetPageContext()>. Does this mean I am using an old version of coldfusion.

Thanks

Reply to this Comment

Su,

I don't know of any way to import from a remote server, but it might be possible somehow.

If GetPageContext() is breaking then you might be using a pre-MX version of ColdFusion. It was introduced in MX 6 I believe.

Reply to this Comment

Hi Ben,

I have the same doubt that su,
Is there any way to import external html into our coldfusion application, like a header or footer?

Thanks in advance.

Best Regards.

Reply to this Comment

Post A Comment

You — Get Out Of My Dreams, Get Into My Comments
Live in the Now
Oops!
Comment Etiquette: Please do not post spam. Please keep the comments on-topic. Please do not post unrelated questions or large chunks of code. And, above all, please be nice to each other - we're trying to have a good conversation here.