The brand.properties file contains a list of names and values that you can use to specify colors, image names, fonts, spacing, and other design elements for your brand. (Zen automatically inserts these values into the HTML, CSS, JavaScript, and elsewhere, saving you about 95% of the hassle.)

The properties are grouped into sections and are named according to their functions. Here's an excerpt from the Halloween brand:

Halloween brand.properties file excerpt
###########################################################################
# GENERAL
###########################################################################

#
# Brand name
#
zenBrandName=halloween

#
# Color palette
#
zenPrimaryColor=#FDB83A
zenSecondaryColor=#9F3400
zenTertiaryColor=#222B2B
zenLightColor=#CFCFCF
zenMediumColor=#FDB83A
zenDarkColor=#000000

#
# Body padding
#
zenBodyPadding=20px


As you can see, most of the properties are simply familiar CSS values.

When changing a properties file, here are a few things to keep in mind:

  • The left of the equal sign is the property name. The right side is the value.
  • Don't change property names.
  • The equal sign (=) is required.

Brand Properties Sections

A brand.properties file is divided into sections. Each section addresses a different aspect area of styling (and in one case, functionality) of your brand. The section is marked with its name and two rows of hash marks.

The brand sections are:

Section

Addresses

GENERAL

System-wide color palette, fonts, padding, and borders

HEADER

The toolbar, menu, and logo area

MAIN CONTENT AREA

General appearance of the page, columns, sections, wiki content, comments, blogs, etc.

FOOTER

The "Powered by" footer at the bottom of every page

SPECIALTY

Function settings and editor appearance

CUSTOM CSS and JAVASCRIPT

Seldom needed, Zen can include your own CSS and JavaScript

NEW in ZEN 4.0

New properties available in Zen 4.0

Click on a section above for a detailed look at its properties. Note that the properties will be presented in the same order as they appear in the brand.properties section.