В предыдущих статьях мы провели небольшую подготовительную работу, направленную на создание фундамента для нашего проекта. Теперь пришло время объединить все прошлые наработки, загрузить плагин ColorBox и подготовить несколько jQuery скриптов.
Подключение плагина ColorBox
Создадим в директории с нашей темой папку js, внутри которой будет находиться подпапка colorbox. Она понадобится нам для размещения стилевых таблиц CSS и изображений, относящихся к плагину Colorbox. Такой подход позволит нам упорядочить и облегчить процесс дальнейшей работы.
Разархивируем плагин ColorBox и поместим его minified-версию в папку js/colorbox. Все стилевые таблицы и изображения мы возьмем из папки example1 плагина Colorbox и поместим их в папку colorbox. Затем нам понадобится выполнить подключение стилевой таблицы colorbox.css. Откроем файл header.php и добавим к нему следующий код (добавлять необходимо после объявления основной стилевой таблицы):
... <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" /> <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/js/colorbox/colorbox.css" type="text/css" media="screen" /> ...
Затем над функцией wp_head мы выполним подключение jQuery и Colorbox. Делается это с помощью уже известных нам методов:
... wp_enqueue_script( 'jquery' ); wp_enqueue_script('colorbox', get_bloginfo('stylesheet_directory') . '/js/colorbox/jquery.colorbox-min.js', array('jquery'), '20100516' ); ...