yet another coldfusion blog

Components are, I suspect, a greatly unappreciated and under-utilized resource in Mura.  For those new to Mura, components are essentially content blocks that exist outside of normal site navigation, and are manually inserted into a web page via the Site Manager as content objects.

I use components for a great many things when developing Mura websites, and I'd like to share them with you.  The greatest thing about them is that they allow you to manage content that doesn't have a specific home in the navigation tree, which can get over-crowded with non-navigation content very quickly.  By intelligently separating out the content that isn't part of the normal navigation structure, the information will be easier to manage and less confusing to less experienced content managers.

As an aside, I should mention that I have been pushing for a slightly more organized structure to components.  I myself often enable categorization for components (I'll get to that in a bit), which also lets me control them via components quite easily.

As a bonus, I'll reveal a hidden little gem that I sent to Matt (lead architect of Mura) a while back that he was kind enough to integrate.

Custom Menus

While I like to keep multiple menus to a minimum on a web page for usability reasons, I find it handy to manage them via components and the dspNestedav() function.  For global single-level menus, I do the following:

1. create a portal (doesn't matter where) and uncheck "display in navigation"
2. jot down the contentID for the portal (found under the "Advanced" tab)
   
3. add "links" to the portal, one for each menu item
4. create a new component called Menu: Footer or similar
5. insert the following code into the component:

You can then place this component via content objects into your page.  This also works well when you want to have fixed navigation elements on a particular sub-page.

Feature Boxes

Feature boxes are another item that components are well suited to.  Testimonials, "Tip of the Day", front page features and so-on are best managed via components.  I use a consistent naming format to add some organization to them, like FeatureBox: What We Do, or Testimonial: Bob's Gopher Museum.  You can then add and remove them easily via the content objects page.

To help automate some of this functionality, it is possible for the less-faint-of-heart to enable categorization for components.  You can do this by un-commenting the code in /admin/view/vArchitecture/dsp_form.cfm (around line 290 in the current release):

This will enable the categorization tab for components.  While Mura doesn't have any native functionality to take advantage of this (hence the commented-out code), it is a very simple matter to create a component that can sort through them (I have a rough version of this; if you are interested in looking at it fire me a message and I'll send it over).

Scripts and Tracking Codes

I hate hard-coding anything into a page, and that includes putting [mura][/mura] tags into regular content pages.  It can also be a real bear trying to figure out where a piece of code is running from if you are scattering these types of calls throughout regular content.  Instead, put a couple of the "renderer.dspObjects(#)" tags into your header or footer, and use components to hold and organize these calls.  In this way you can quickly update, disable or modify a script that you have running on multiple pages throughout your website.

The Hidden Gem: Component Templates

This hidden gem is something that I use a lot in developing client sites, and is something that Matt was nice enough to insert into the codebase a while back.  To enable component templates:

1. create a "components" directory in the "templates" directory of your active theme, such as /[siteid]/includes/themes/merced/templates/components.  If you are not using a theme, make sure this directory exists at /[siteid]/includes/templates/components
2. if you do not have it, download this file and unzip the contents into the directory (a single file called ExampleTemplate.cfm)

Login to Mura and create a new component; you will find a "Templates" drop-down with ExampleTemplate as an option.  Templates for components are a great way to organize layouts for feature boxes, integrate scripts for rotating content, and even integrate custom code (though I'd not recommend that approach myself).  These are a real boon when designing for clients, since you can build sophisticated feature boxes and not have to worry about them deleting a crucial div tag!

Components are a great organizational tool, and will help keep clear some clutter from your navigation tree.  At Clever Technology we have a couple of plugins in the works that should add a lot of extended functionality to components and the way they can be used.  I'll blog about them more when we're closer to launching them.