Style Guide: API

To change the list of items displayed by Style Guide, third-party modules
can implement following hooks, located in styleguide.api.php:

• hook_styleguide()
• hook_styleguide_alter()
• hook_styleguide_theme_info_alter()

hook_styleguide()

hook_styleguide() allows you to define an array of items to render for theme testing. Each item is rendered as an element on the style guide page and should be keyed with a unique identifier. This value will be used to create a named anchor link on the Style Guide page, organized by 'group' which may be set in the value array. Valid keys in the value array are attributes, content, group, tag, title, theme, and variables. NOTE: the attributes key can only be used if the tag key has a value, and content may be a render array.

hook_styleguide() example

/**
 * Implements hook_styleguide().
 *
 * Display a standard link and a word with emphasis. Theme an image.
 */
function mymodule_styleguide() {
  $items = array(
    'a' => array(
      'group' => 'mymodule', // Default group is 'Common'
      'title' => 'Link',
      'content' => l(styleguide_word(3), 'node'),
    ),
    'em' => array(
      'title' => 'Emphasis',
      'tag' => 'em',
      'attributes' => array(
        'data-type' => 'emphasis example',
        'id' => 'test',
        'role' => 'presentation',
      ),
      'content' => styleguide_word(3),
    ),
    'image' => array(
      'title' => 'Image',
      'theme' => 'image',
'variables' => array('path' => 'path/to/image.jpg', 'alt' => t('My image'), 'title' => t('My image')),
    ),
  );
  return $items;
}

hook_styleguide_alter()

hook_styleguide_alter() can be used to change the behavior of or remove existing preview elements.

hook_styleguide_alter() example

/**
 * Implements hook_styleguide_alter().
 */
function mymodule_styleguide_alter(&$items) {
  // Add a class to the text test.
  $items['text']['content'] = '<div class="mytestclass">' . $items['text']['content'] . '</div>';
  // Remove the table item.
  unset($items['table']);
}

hook_styleguide_theme_info_alter()

hook_styleguide_theme_info_alter() can be used to alter display information about a theme for Style Guide. Currently, only the 'description' element of the $theme_info array is used by Style Guide.

hook_styleguide_theme_info_alter() example

/**
 * Implements hook_styleguide_theme_info_alter().
 *
 * Alter display information about a theme for Style Guide.
 */
function mymodule_styleguide_theme_info_alter(&$theme_info, $theme) {
  if ($theme == 'mytheme') {
    $theme_info['description'] = 'A basic theme for development.';
  }
}