Создаем свой стиль для Colorbox

Сегодня мы поговорим о том, как можно добавить пользовательский стиль для модуля Colorbox. В одном из последних проектов мне потребовалось написать свой стиль и я сразу же подумал, что никаких проблем не будет, ведь у модуля есть страница настроек, на которой можно выбирать стили, а значит должно быть и API для добавления стилей. Я очень сильно ошибался, как оказалось, у модуля нет нормального API. Придется ухищрятся...

Для начала определимся, что стиль в общем случае состоит из двух файлов: CSS и JS. Последний в свою очередь может отсутствовать. Переходим к созданию стиля.

Шаг 1. Создаем в своем модуле директорию colorbox, внутри нее директорию styles. Внутри директории styles создаем директорию, которая будет иметь название стиля, в моем случае это style_example. Далее в этой директории создаем файлы стиля, в моем случае это colorbox_style.css и colorbox_style.js.

Шаг 2. Теперь необходимо, чтобы модуль Colorbox увидел наш стиль в форме настроек. Как я уже писал ранее, для добавления стилей нет никакого API, поэтому альтерим форму настроек:

/**
 * Implements hook_form_FORM_ID_alter().
 */
function example_form_colorbox_admin_settings_alter(&$form, &$form_state) {
  $path = drupal_get_path('module', 'example') . '/colorbox/styles/style_example';
  
  // Убираем из селекта вариант "None". Потом мы его вернем в самый конец, чтобы
  // форма имела эстетический вид.
  unset($form['colorbox_custom_settings']['colorbox_style']['#options']['none']);

  // Добавляем в селект свой стиль.
  $form['colorbox_custom_settings']['colorbox_style']['#options'][$path] = t('Style example');

  // Возвращаем в селект вариант "None".
  $form['colorbox_custom_settings']['colorbox_style']['#options']['none'] = t('None');
}

Шаг 3. Необходимо подключить файлы стиля, для этого имплементируем hook_colorbox_settings_alter():

/**
 * Implements hook_colorbox_settings_alter().
 */
function example_colorbox_settings_alter(&$settings, &$style) {
  if ($style == drupal_get_path('module', 'example') . '/colorbox/styles/style_example') {
    drupal_add_js($style . '/colorbox_style.js');
    drupal_add_css($style . '/colorbox_style.css');
    
    // Мы можем альтернуть настройки колорбокса.
    $settings['fixed'] = FALSE;
    $settings['reposition'] = FALSE;
  }
}
Drupal 7 JavaScript
Benya