Creating a Cosmo Theme

Cosmo

<div cosmo="body"></div>

Values:

• header
• subheader
• body
• custom (must be unique across all areas)

The cosmo directive is the main content area. Add it in the main body and any other areas you want text.

Menu

<ul menu="primary"></ul>

Values:

• custom (must be unique across all areas)

This creates a menu in the location you put it.

Block

<div blog="sidebar"></div>

Values:

• header
• footer
• sidebar1
• sidebar2
• sidebar3
• block1
• block2
• block3
• block4
• block5
• block6
• block7
• block8
• block9
• block10

Blocks are sections that are shared across multiple pages. For example, a bio section giving the author's information that will appear on all blog pages. Value must be one of those listed above.

ng-include

<div ng-include="themes/my-theme/partials/headers.html"></div>

Use ng-include to include html files that are shared between different files, like headers and footers. The div will be replaced with the html file in the value. The path should be from the home page.

Image

<img image="primary">

Create images that can be edited by the user.

Background Image

<div bgimage="featured"></div>

Creates a background image.

Preview image

Create a small, 320px, screenshot to be shown in the administrator area. Simply name it preview.jpg and make sure it is in the base folder of the theme.