These are the basic building blocks of a Skin. If you are already familiar with this, you might want to see some quick examples.

Machine Name

Each skin begins with the prefix skinr in your .info file. This allows Drupal and Skinr to easily identify and access information about your skins. It will not show up in the UI or in any markup.

skinr[skin_system_name]

Title

Every skin has one title. This title will appear in the UI as the form element label, so it should be descriptive of what the Skin is/does.

skinr[skin_system_name][title] = Example

Description

Descriptions are optional, but recommended. They will show in the UI just as regular form item descriptions do. They may contain HTML.

skinr[skin_system_name][description] = This should be a description of my Skin.

Type

There are 3 different options for displaying your Skinr styles in the UI. These types correspond to Drupal's form API widgets. They were created to allow you to better present your skins in the UI and to allow fine-grained control over the options you provide.

  1. checkboxes (default) – Can be used for singular or multiple options. Do not use "checkbox" as it will not work. Also note: Skinr applies checkboxes by default, so it's not necessary to specify if that's what you want to use.

    skinr[skin_system_name][type] = checkboxes
  2. select – Good for presenting many options when only one can be selected. Note: multiple selects are not supported; checkboxes should be used instead.

    skinr[skin_system_name][type] = select
  3. radios – Can be used for single options.

    skinr[skin_system_name][type] = radios

Options

After deciding upon a widget type, you'll need to define your options. You'll always need to have at least one option. Each option is keyed, and consists of both a label and a class. The label will appear in the UI and the class is the CSS class(es) you want to use. See CSS for more information.

Singular

skinr[skin_system_name][options][1][label] = Foo
skinr[skin_system_name][options][1][class] = foo-class

Multiple

Note: Skinr will include a <none> option automatically for skins that have multiple options so the skin can be unselected by the user.

skinr[skin_system_name][options][1][label] = Foo
skinr[skin_system_name][options][1][class] = foo-class
skinr[skin_system_name][options][2][label] = Bar
skinr[skin_system_name][options][2][class] = bar-class

Adding files

More information on adding files can be found here, but a brief overview of the syntax is below.

skinr[skin_system_name][options][1][stylesheets][all][] = foo.css
skinr[skin_system_name][options][1][scripts][] = foo.js

Groups

Groups allow you to place skins inside a fieldset. This is useful when trying to present a bunch of related Skins. You may also choose to show the fieldset as collapsed by default.

Defining a group

skinr[options][groups][skin_group_name][title] = Example Group
skinr[options][groups][skin_group_name][description] = Set font-family and size options.
skinr[options][groups][skin_group_name][collapsible] = 1 // Defaults to 1. Options are 1 or 0.
skinr[options][groups][skin_group_name][collapsed] = 0 //  // Defaults to 0. Options are 1 or 0.

Associating a skin with a group

skinr[skin_name][title] = Example Skin
skinr[skin_name][description] = This should be a description of my Skin.
skinr[skin_name][group] = skin_group_name
...