Use Case: Create New Skin -

Actor: Site Designer

Goal: Create a new skin that defines a new look and feel for the site

You can change not only the look and feel of your CMF site with skins, but also its behavior.

The CMF ships with a number of standard skins and layers. You can build your own skins from scratch or you can customize the default skins.

New skins are created by combining either new or existing layers into a new skin. To recap:

1. Skins are defined by a collection of Layers
2. Layers are collections of presentation and behavior objects.
3. Layers are ordered: objects defined in earlier layers override objects defined in later layers.
4. You can customize a skin by defining a new layer early in the layer ordering which overrides objects in later layers.
5. Zope helps you do this by providing facilities to create customizable copies of objects defined in other layers in the Custom layer.

The layers that come with the CMF define different types of objects.

Images

Site images.

content

Views, editing forms, and icons for default content types.

control

Scripts to control site and content behavior.

custom

An empty layer for customization.

generic

Default site presentation and behavior.

no_css

An example customization layer.

nouvelle

An example customization layer.

topic

Presentation and behavior for Topic objects.

zpt_topic

Presentation for Topic objects using Page Templates. This layer is a work in progress, which no skins currently use.

To create a new skin, go to the portal_skins tool and click on the Contents view. This view will show you all of the layers that are available to you. Suppose you wanted to create a new skin that is customized toward visitors to your site who speak French. To do this, you need to define a new french layer, and then use that layer inside a new French skin.

To create a new French skin:

1. Create a new layer by selecting Folder from the add list in the portal_skins tool. Give the new folder the id french. This folder is a new layer.
2. Click the Properties view of the portal_skins tool.
3. Above the Add button, type in the name for the new skin, French. In the box next to that name, type in the layers in this new skin. In this case, you want your new french layer to come first, so type in french, custom, topic, content, generic, control, Images.
4. Click Add.
5. You've added a new skin. Now you can customize that skin by following the procedures in Change Skin Look and Feel