Directory Structure of a Mura Theme
When you first install Mura, a sample theme is provided for you. As of Mura 7.0, the MuraBootstrap3 theme is the sample provided, primarily for theme developers to use and/or reference for their own projects. As mentioned earlier, when updating a Mura site, Mura will ignore this directory. This means that you're free to modify the default theme that comes with Mura as much as you want. It also means that anytime the default theme itself is updated by the Mura team, you will not see those changes or updates.
Mura scans for specific directories and files by naming convention, and those are identified in the listing below with an asterisk (*) within the Required column. As you'll see below, the "templates" directory is the only one that's truly required.
| Directory or File | Required | Description |
|---|---|---|
| ../{ThemeName}/assets/ | No | Typically, various front-end framework and library files, are stored here. For example, "bootstrap" and "font-awesome" directories can be found in the MuraBootstrap3 theme. |
| ../{ThemeName}/content_types/ | No* | This directory, and its purpose is beyond the scope of this guide. Please visit the Mura Developer Guide for details. |
| ../{ThemeName}/css/ | No* | Mura checks this directory for a "editor" directory. If found, it then scans for a "editor.css" file. If the editor.css file is located, its styles will be included with CKEditor's styles for any HTML Editor type regions when editing content via Mura's user interface. |
| ../{ThemeName}/display_objects/ | No* | This directory, and its purpose is beyond the scope of this guide. Please visit the Mura Developer Guide for details. |
| ../{ThemeName}/images/ | No | Theme-specific images are typically stored here. |
| ../{ThemeName}/js/ | No* | Mura checks this directory for an "editor" directory. If found, Mura then scans for some additional directories and files for customizing the web editor. Additional information can be found under the Customizing the Web Editor section. In addition, this directory is used for storing theme-specific JavaScript files. |
| ../{ThemeName}/resourceBundles/ | No* | As discuss in The "resourceBundles" Directory section, Mura offers a way to internationalize both the user interface, as well as parts of your theme. More information resource bundles, including how to customize and create your own key-value pairs, is covered in the Mura Developer Guide. |
| ../{ThemeName}/templates/ | Yes | This is the only "required" directory. This is where you create and manage your theme-specific layout templates. See Theme Layout Templates for more information. |
| ../{ThemeName}/.gitignore | No | The Mura Team uses Git for distributed version control, and this is the site .gitignore file used to specify intentionally untracked files. |
| ../{ThemeName}/config.xml.cfm | No* | This file contains some theme-specific configuration settings. Visit The Mura Developer Guide to learn more. |
| ../{ThemeName}/contentRenderer.cfc | No* | This is the theme-specific contentRenderer.cfc. You can add any theme-specific methods here. Visit The Mura Developer Guide to learn more. |
| ../{ThemeName}/eventHandler.cfc | No* | This is the theme-specific eventHandler.cfc. You can add any theme-specific event handlers/listeners here. Visit The Mura Developer Guide to learn more. |
| ../{ThemeName}/README.md | No | General information about the theme itself is stored in this file. It is not used by Mura. |
We'll cover Layout Templates shortly. For now, just remember that you can always reference this documentation, as well as the default theme, for a general overview on the directory structure of a theme.
Note: The primary focus of this guide is to help theme developers integrate their existing designs into Mura. The Mura Developer Guide will cover many of the more complex scenarios when it comes to building dynamic display areas, as well as extending the functionality of Mura.