Creating Layouts

The first, and probably most important, thing to understand about layouts in Speck is that they aren't the same as layouts in fusebox. Speck layouts wrap the content generated by a template, but don't include anything outside the body tag - the cf_spPage tag takes care of generating the doctype, html and body tags, and fills the html head according to the configuration settings for the application.

Creating a basic layout is really, really simple. You just create a CFML template that outputs the variable speck.layout somewhere. You can also use the cf_spMenu and cf_spBreadcrumbs tags to render a menu and breacrumbs based on the current location/keyword.

The cf_spBreadcrumbs tag is fairly self-explanatory, it generates a list of breadcrumb style links showing the path to the current location/keyword, with each breadcrumb separated by > (you can change the separator and do some other funky things, have a look at the source of the tag, the options are cfparamed at the top).

The cf_spMenu tag requires some further explanation. It generates series of links that together form a navigation menu (no prizes for guessing that bit), but by default this only goes one level deep and only shows links to top level sections of the site. You can tell it how many levels to go down using the levels attribute (default 1) and tell it where to start using the parent attribute. The parent attribute should match an application keyword. For example, if, like the speckcms.org site, you had three levels of navigation and displayed these using a horizontal menu (to show the top level) and a separate vertical menu, you'd need two separate cf_spMenu calls, like this...

<cf_spMenu selectedClass="active">


<cf_spMenu
parent="#listFirst(request.speck.page.keyword,".")#"
levels="2"
selectedClass="active">

Again, like the cf_spBreadcrumbs tag, the cf_spMenu tag has lots of other options, but while we're still working on the documentation for the portal framework, you'll have to check out the source to find out what they are (they're cfparamed at the start of the file).