A reader sent me a question earlier in the week about adding a custom toolbar to ColdFusion 8's implementation of fckEditor. Just in case you haven't seen this before, fckEditor is a richtext editor that allows people to do basic HTML editor within a web form. My personal opinion is that these things are more trouble than they are worth. 9 times out of 10 the client isn't happy with the result. No big surprise really. HTML is a skill. It's like a client asking for medical equipment so they can do 'quick edits' on their body with hiring a surgeon. Ok, maybe not quite that complex, but really, I just don't like em. (I did like the KTML editor, but unfortunately it was killed off. I wish Adobe had just open sourced it.)
Sorry for the sidetrack there. So - the tips. It just so happened that the reader had an issue getting his new toolbar to work. He had properly edited the fckconfig.js file, but every time he tried to use the editor he got an error. Imagine this CFML:
<cfform name="form01">
<cftextarea richtext=true name="text01" toolbar="blacksmokemonster" />
<cfinput type="submit" value="Enter" name="submit01"/>
</cfform>
As long as blacksmokemonster is defined in the config file, it should work, right? When I first tested, I got this instead:
Turns out the issue is just caching. Now you may think - why would caching be involved? I bet that - like me - you have browser setup to not cache anything, right? Well even with that, there are cases where the browser still seems to cache. In my inspection of the 'flow' involved in loading the editor, it appears as if JavaScript is used to load HTML that includes code then to load the config JavaScript file. In all those requests it seems like the config file gets cached. I cleared my cache using the Web Developer toolbar and the problem went away. What's odd is that after the initial cache clear, I was able to edit my toolbar multiple times and see it reflected without clearing my cache.
Ok, the second tip. The fckconfig.js file is within the ColdFusion CFIDE folder. You may know that cfform has a scriptsrc attribute which lets you point to another folder to load JavaScript files. You would probably want to work on a copy of the fckconfig.js file instead of messing with the files that ship with ColdFusion. This would be especially important if you plan on using a shared host. What I didn't remember though, and I have Scott Stroz to thank for reminding me, is that the cftextarea tag has a basepath attribute. It works the same as scriptsrc, but let's you specify a folder just for fckEditor stuff.
Archived Comments
If I remember correctly, its also case sensitive. So if you have a toolbar named BlackSmokeMonster and you specify blacksmokemonster then it won't work.
Excellent point. It's easy, especially for folks who are brand new to JS, to forget this.
It would be nice if basepath let you specify a different Rich Text Editor instead of fckEditor... Great info Ray.
regarding users who get upset with editors like FCK when they don't do EXACTLY what the user wants - I have a couple of approaches I use with clients:
1) Before any development work starts, I demo a site already running the editor and show the client that while it LOOKS like an MS Word style interface, it doesn't BEHAVE the same way - and give a quick rundown of how it still sits on top of the HTML language which wasn't intended to even allow that sort of stuff in the first place and that frankly they should be thankful they can create bold text by simply selecting it and hitting ctrl+B!
(This is usually the point I show the sourcecode of a page)
2) I'd say roughly 90% of the clients I've had since the old days of soEditor have fairly specific desires when it comes to layouts they're trying to achieve in their pages. For these people, I ask them for a Word doc with the layout they're trying to achieve, then we recreate it as a template (which FCKEditor [and AFAIK most others] supports from a dropdown in the toolbar)
The above generally sorts the main layout problems people have with these. beyond that, the only other issue I have is with FCK's @!*$^ filebrowser. But the CFFM option from www.opensourcecf.com is a great replacement anyway - and much easier to hack user security checks into.
I think that a RTE is one of the central element of any CMS today. We cannot expect users to know HTML to simply post an update on their website (I know, I develop a CMS).
Client side tags should not belong to ColdFusion, and I wish Adobe concentrate their efforts on server side functionalities. I never used the cfform, cftextarea etc... in many years of CF development.
Why would I have to wait for the next update of CF to implement a new revision of the RTE that Adobe has decided I should use? Loading fck or tinyMce on a web page is not rocket science.
Finally, bundling CF with client side technologies makes web developers less aware of "what happens on the client side" which is a disservice to the web development community in general.
@Jean: Why do you have to wait for Adobe to implement a new RTE? That makes no sense. _If_ you want the easy to use RTE, if you want something super simple, than you can use this. If you don't like it, you can use any other RTE you want. I applaud Adobe for making these client side things easy for folks. Sure, they have their drawbacks, but really, if you feel like they don't do what you want, you probably aren't the audience for them.
Users of cftextarea probably do not want to update the javascript code in their /cfide. They will therefore not benefit from the latest versions of the RTE before Adobe ships an update.
If I want an easy to use RTE, I load the tinyMCE javascript, add a class to any textarea and voila. Not rocket science, and not longer than using cfform, cftextarea etc... Certainly safer too, as it does not require the /cfide folder to be publicly available.
You are right, I have the choice to not use those tags. I still think that Adobe CF should not worry about them and would prefer more improvements on the server side. Railo and BD seem to have an edge on that side.
You can also modify fckconfig.js to allow file uploads, as long as you've patched CF8. Granted, this can be dangerous, but in a controlled intranet setting, letting users upload photos is pretty reasonable. You'll have to use a custom toolbar for the upload bits to show up for the user.
I have to agree with you Master Jedi. If you don't like Fck there are lots of others out there and it is awesome that Adobe is including it for us.
Fck is more power than my users need at the moment. That is why I use a different RTE. Lots of good ones out there.
The other way to fix this strange behavior is the append a random parameter string to your url in the browser..
EG
http://yourdomain/youpage.cfm?rand=6
Works for me
A bit off-topic, but it is CFTEXTAREA related. I have trouble coming up with a javascript that would insert text at the cursor position of a rich-text cftextarea (Eg a value of a select box). This is not a problem with plain text text-areas but it gets trickier in the rich-text versions. I have found a straightforward script that will do what I want for the TinyMCE editor, but I would rather use the built-in coldfusion functionality if possible. I can't figure a solution for the CFTextarea case. Any ideas?
About the best I can recommend is getting the object (the RTE object) via ColdFusion.RichText.getEditorObject, and looking through it's interface to see what you can do. Technically this is the FCKEditor so you should be able to check their docs too.
After upgrading to CF 10 my page using a custom toolbar gave the "doesn't exist" message. After troubleshooting this for 30 minutes I discovered that CF 10 updated the IIS virtual directory location for CFIDE from my web root (d:\inetpub\wwwroot\) to its install location c:\coldfusion10\cfusion\wwwroot\CFIDE. I believe this is new, don't remember CF 9 changing this. Anyway, needed to update the fckconfig.js file in the new location.
Hi Ray. Can you recommend a Rich text editor that works well in COldfusion that will allow me to pass a variable as the content? Thanks
Unfortunately, I haven't used a RTE in ages. Or at least not used one that I remember. Back when I used Wordpress, their RTE was pretty good. Not sure if you can use that by itself w/ CF though.
I know. I hadn't used one in a while either. I am using the updated CKeditor and it works fine. Thanks