Tweaking BlogCFC: Theme Management

Preview of the Theme Management section in the BlogCFC Administrator.One of the really nice things about Wordpress is that it has a very easy to use admin for managing your blog's theme. Working with the design in BlogCFC is a pain: the design is integrated into the actual code for the blog. Further, the code for designs is strewn through a number of different folders (includes/, images/, tags/, includes/pods/, etc.), which makes it hard to fully update a design. I've made the necessary changes to make BlogCFC handle custom theming as easily as Wordpress: click more to see the details.

This modified copy of the client folder was based on BlogCFC version 5.9.2 running on ColdFusion 8.0.1. If you are using a different version of BlogCFC or ColdFusion, there might be some compatibility issues.

First of all, you will need to add a line to your blog.ini.cfm page in order to use the new theme support.

...
theme=Default
...

The second step is to download the new client folder from the link below, and install it. I'd love to be able to offer you a line-by-line description of the changes, but I simply had to change too much in order to pull the layout parts into their new locations. Please note that this version of the client does NOT include the other changes to BlogCFC that I've listed in my Tweaking BlogCFC series.

Now all you will need to do is log into your BlogCFC Administrator in order to manage your themes. The download comes with two themes: Default, which is the standard BlogCFC design, and Green Grunge, a new design I threw together.

Installing New Themes

Preview of the Green Grunge theme.

New themes can be installed from zip files containing the theme, or they can be uploaded your your themes/ directory. Using a zip is probably the best method, as the Theme Manager will automatically verify that the theme contains the necessary files.

Creating New Themes

Creating new themes is easy: just copy the Default theme and modify it as you see fit. The name of your theme is based on the directory in which you place your theme. Underscores are replaced with spaces, so the folder test_theme/ is a theme named "test theme".

  • test_theme.zip
    • test_theme/
      • comment.cfm - layout for a single comment
      • comments.cfm - layout for multiple comments (uses comment.cfm)
      • footer.cfm - footer
      • header.cfm - header
      • index.cfm - main layout (uses post.cfm)
      • podfooter.cfm - footer for pods
      • podheader.cfm - header for pods
      • post.cfm - layout for a single post (unexpanded)
      • preview.jpg - an image previewing the layout for the admin
      • sidebar.cfm - layout for the sidebar
      • single.cfm - layout for viewing a single post (expanded, uses post.cfm, comments.cfm, trackbacks.cfm)
      • trackbacks.cfm - layout for track backs

Bugs

Consider this version 0.1 for theming. If you find any bugs with this system, or you're missing something really vital to theming, please contact me and let me know what you found.

 

Comments

Russell's Gravatar I have not dealt with themes before but I would like to change the layout of my blogcfc blog. I tried to overwrite my blog files with your files but received this error: Default isn't registered as a valid blog.

My blog was registered under the directory name. I added the theme=Default to my blog.ini.cfm and it was still working. Then I overwrote my files with yours and got this erorr: Default isn't registered as a valid blog. The Default directory is contained inside my dir that is registered.
Jon Hartmann's Gravatar @russell

Did you change your blog name in the application.cfc file after over writing? The application.cfc file uses the standard "Default" blog, just like a clean install of BlogCFC.
Scott's Gravatar Thanks a ton. I thought for sure I would be knee deep in the code
trying to make the themes work. This will greatly help.

thanks again.
Jon Hartmann's Gravatar @srobin Glad you like it. Your post reminds me that I need to update this for the newest version of BlogCFC
cfguy's Gravatar I'm getting the following error even though I'm confident I followed your directions exactly:

"theme is not a valid property"

It obviously stems from line 42 in the Application.cfm page. Any thoughts on why this is happening?
Jon Hartmann's Gravatar @cfguy: I'm guessing that the 'theme' value in your blog.ini.cfm is missing, or that you've not reinitialized the application since before you added it in there. If you did add it in, trying going to your index.cfm page and putting ?reinit=1 in the url and see if that straightens things up.

If not, check back and I'll see if I can figure out whats going on.
Michael's Gravatar Do you know if your theming extension will work with the most recent BlogCFC release? Thanks!
Jon Hartmann's Gravatar @Michael: I've not tested it with that version, no. Mine is based on 5.9.2, and the current version is 5.9.8, so its possible they are compatible, but without some testing I can't be sure. My code replaces several key layouts and .cfm files in order to make the templates work, so if there were changes to these files since I created them, there might be problems. I'd hope though that they would be compatible, since the updates have been minor point releases.

I'd be curious to find out, but wont have time to check it myself for a while.
Michael's Gravatar Thanks Jon.
If I get a chance I might give it a try with the latest version of BlogCFC. If I do then I'll let you know if I have any luck.
J Harvey's Gravatar Hi John,
I've installed BlogCFC 5.9.8, and installed your BlogCFC theme Files - Unfortunately it seems the Two Aren't all that compatible as I've recieved alot of varying errors, so I will be just reverting it back to 5.9.8 vanilla.

Just wanted to let you know. :)
Jon Hartmann's Gravatar Thanks J, I appreciate you letting me know. There is the official answer then: this stuff is not compatible with future versions of BlogCFC
Jon Hartmann, July 2011

I'm Jon Hartmann and I'm a Javascript fanatic, UX/UI evangelist and former ColdFusion master. I blog about mysterious error messages, user interface design questions, and all things baffling and irksome about programming for the web.

Learn more about me.

Post a job. Find one. authenticjobs.com

Interested in becoming a sponsor? Contact me.