Skin Property Reference

Each skin definition consists of properties that define its form element and settings that are needed to make it work, such as the class(es) Skinr should apply, which files it should load, whether or not it should be disabled by default and which theme hook(s) it was designed to work with, and so on.

Depending on your directory and file structure, you'll use one of the following hooks to implement your skin(s):

  • hook_skinr_skin_info()
  • hook_skinr_skin_plugin_info()

Below is a full listing of the available properties. See an example.

Properties

title required

The title of the skin, which translates to the form label on the settings form.

<?php 'title' => t('Text color') ?>

options required

An array containing one or more options (also arrays) for the skinr administrator to choose from when applying skins. Each option can be a machine name describing the option, or a numeric key and should include the following properties:

title required
Becomes the option label in the settings form.
class required
An array containing one or more classes the skin. This is the class you'll write your CSS to target.
attached
CSS and JavaScript files to attach per option. See the attached property for a syntax example.
<?php
'options' => array(
 
'option_1' => array(
   
'title' => t('Style 1'),
   
'class' => array('style-1'),
  ),
 
'option_2' => array(
   
'title' => t('Style 2'),
   
'class' => array('style-2', 'clearfix'),
  ),
),
?>
description

The form element description, which is displayed on the skinr settings form. The description is useful for providing instructions or notes to users applying the settings.

<?php 'description' => t('Select a style to apply to this element.') ?>

type

The type of form element to use when displaying the options to the user in the settings form. The following options are acceptable values:

checkboxes default
Useful when single or multiple options can be selected. Does not need to be set manually, as Skinr will apply this type by default.
select
Useful when a single option can be chosen, but many exist.
radios
Useful when a single option can be chosen and only a few options exist.

<?php 'type' => 'select' ?>

group

Groups are there to help keep your skins organized and reduce clutter in the Skinr settings form. They are displays as vertical tabs. Skinr provides 4 groups by default. If the group property is not set, the skin will appear in Skinr’s default group labeled “general.” You can place your skin in any of the following groups, and you may also create your own group(s).

general default
Styles for content such as lists, buttons, margins, padding, etc.
box
Presentational styles for the container.
typography
Fonts, styles, sizes and other typography related skins.
layout
Grid, layout and other structural related skins.

<?php 'group' => 'box' ?>

attached

A array containing information about CSS and JavaScript files the skin requires. The attached property is supported at the top level, as well as for each individual option. Each optional entry is an array keyed by type:

css
Maps to the functionality of drupal_add_css() with one exception: paths are automatically assumed relative to the plug-in directory, unless external.
js
Maps to the functionality of drupal_add_js() with one exception: paths are automatically assumed as relative to the plug-in directory, unless external.
<?php
'attached' => array(
 
'css' => array(
   
'http://fonts.googleapis.com/css?family=Arimo', array('group' => CSS_THEME),
   
'styles.css',
  ),
 
'js' => array(
   
'jquery.equalHeights.min.js',
   
'eq.js',
    ),
  ),
?>
theme hooks

An array containing certain allowed hooks, which allow you to limit where the skin can be used. This is helpful when your skin only applies to a certain type of content. For example, if you write a skin that applies to a menu block, setting the theme hook to “block__menu” will cause your skin to only appear in the settings form when editing a menu block. Some of the possible options (per type) include:

  • html
  • region, region__REGIONNAME
  • block, block__MODULE
  • node, node__NODETYPE
  • comment_wrapper, comment__wrapper_NODETYPE
  • views_view, views_view__STYLENAME, views_view__DISPLAYNAME, views_view__VIEWNAME
  • panels_display, panels_region, panels_pane

<?php 'theme hooks' = array('block', 'node') ?>

weight

Sets the weight of the skin inside the group. The weight should not be set on each individual skin. Instead, it should be used sparingly where positioning a skin at the very top or bottom is desired.

<?php 'weight' => '10' ?>

default_status

Skins are disabled by default to keep UI unwanted clutter to a minimum. In some cases, like contrib themes, it makes sense to enable skins which are required to make the theme work properly by default. Setting this property to 1 will cause it to be enabled by default for all installed themes.

<?php 'default status' => '1' ?>

status
This property exists to allow themes to set the default status for a particular theme. When you are registering a skin for your base theme, you likely do not know which sub themes are going to use your base theme. By setting the global default status to 0 and enabling the skin for your base theme itself, the skin's status will be automatically inherited to all sub themes of your base theme.
<?php
   
'status' => array(
     
'bartik' => 0,
     
'garland' => 0,
     
'mybasetheme' => 1,
    ),
?>