Пишем произвольный jQuery скрипт

Давайте создадим в корне нашей папки js новый файл custom-jquery.js и выполним его подключение к теме в файле header.php следующим образом:

...
wp_enqueue_script('custom-jquery', get_bloginfo('stylesheet_
directory') . '/js/custom-jquery.js', array('jquery'), '20100510' );
...

Указанная строка должна стоять ниже объявления плагина Colorbox.

Теперь самое время прибегнуть к услугам jQuery. Добавим в наш файл custom-jquery.js следующие правила:

jQuery(function(){
  jQuery(".entry-content a:has(img)").colorbox({height:"98%"});
});//end docReady

Приведенные выше правила позволяют нам применять плагин Colorbox только для ссылок, расположенных в записях. Каждая из таких ссылок должна содержать в себе тег img. Никакие другие ссылки не будут активировать ColorBox.

Теперь, для того чтобы заставить страницу регистрации запускать Colorbox, нам понадобится прибегнуть к небольшому трюку. Несмотря на то, что я добавил класс .registration, я не хочу использовать его для запуска Colorbox. Единственная ссылка, которая должна инициировать модальное окно — это ссылка Register, расположенная в записях рубрики Events. К ней мы и привяжем вызов Colorbox. Я добавил к своему файлу cb-registration.js следующий скрипт, который разместил внутри функции, отвечающей за готовность документа, после функции выбора изображений colorbox:

...
jQuery("a[href*='register']")
  .colorbox({iframe:true, width:"500px", height: "600px"});
...

Если ссылка содержит строку «register» в атрибуте href, для ее отображения будет вызвано модальное окно Colorbox, представленное в режиме iframe.

Также я установил высоту и ширину окна формы регистрации.

Теперь Colorbox будут запускать только регистрационные ссылки и ссылки на изображения, расположенные в записях.