Speck CMS - A simple content management system for ColdFusion

you are here: home > documentation > application configuration > ui customisation

• Getting Started
  • Speck Concepts
  • System Requirements
  • Installing
  • Upgrading
  • Hello Speck!
  • Articles
  • Caching
• Sample Application
  • Installing
  • Displaying Content
  • Managing Content
• Application Configuration
  • Settings
  • Keywords
  • Globalization
  • UI Customisation
• Building Applications
  • Application Initialisation
  • Creating Content Pages
  • Creating Content Types
  • Built-in Content Types
  • Built-in Property Types
  • Event Handlers
  • Context Sensitive Help
• Users and Security
  • Security Files
  • User Sessions
  • Access Control
  • Password Encryption
  • Reserved Roles
• Optimising Performance
  • Output Caching
  • Query Caching
  • Unnecessary Processing
  • Database Performance

User Interface Customisation

Styling using CSS

Speck uses three stylesheets, one for the admin windows, one for the toolbar and another for the embedded content admin links. The default stylesheets can be found in the speck/www/stylesheets/system directory. You can force Speck to use your own custom stylesheets by simply saving your own customised versions in the spekck/www/stylesheets/custom directory. We do this to add our own icons for the toolbar and the content admin links.

You can also use the class and style attributes of the cf_spProperty tag when creating your content types to specify styles to be used for each property when rendering the add/edit content form.

Layouts

Speck also allows you to define a layout for the admin interface. You can use a layout to wrap the output from the admin interface in your own html. The layout file is included using cfinclude and content generated by Speck is available in the variable speck.layout. You can output the value of this variable anywhere in your layout files, allowing the content generated by Speck when adding/editing content to be wrapped by your custom html. You can specify a layout using the layout application configuration setting.

Unlike Fusebox layouts, Speck layouts are included within the document body and your layout files should only include html tags that are intended for use within the document body. An example layout file can be found in /speck/www/admin/layouts/.