Молодогвардейцев 454015 Россия, Челябинская область, город Челябинск 89085842764
MindHalls logo

Создание и использование шорткодов в WordPress

Привет постоянным читателям и случайным посетителям! Сегодня поговорим про WordPress и чудеса его настройки.

Я выбрал WordPress для своего блога по большей части потому, что это самая распространенная CMS в мире. Утверждается, что вести блог с этой системой проще простого. Быстрый старт и никаких заморочек с настройками, открыл редактор и штампуй статьи, лишь бы было о чем писать. И я готов подтвердить — так оно и есть!

Но в один прекрасный день настал момент, когда мне перестало хватать свободы действий в управлении своим сайтом. И я полез в исходный код, изучил файловую структуру темы, почти полностью переписал все ее исходные файлы, полностью сменил внешний вид и внедрил микроразметку. О ней я обязательно в подробностях напишу, но позже, там жуткие заморочки. Сейчас речь пойдет о возможности расширения базового функционала WordPress без использования плагинов!

Что такое shortcode в WordPress

Это очень простой и удивительно эффективный способ внедрить дополнительный исходный код в сайт. PHP или JavaScript код можно добавлять в тело записи, в виджеты, в страницы, куда угодно.

Шорткод удобно представлять, как вызов функции. Его можно осуществить в любом месте HTML-документа, но самое главное преимущество заключается в возможности совершать вызовы напрямую в теле страницы или записи. Почему? Потому что содержимое каждой страницы создается динамически и отправляется на хранение в базу данных, и вы не сможете его отредактировать никаким способом, кроме встроенного в WordPress редактора. Который в свою очередь с большим удовольствием форматирует все кавычки и и спецсимволы, превращая скрипт в обычный текст.

Самым ярким примером использования шорткодов я могу назвать внедрение JavaScritа на страницы. Совсем недавно я описал несколько костылей способов, но совершенно позабыл о шорткодах! Кроме того, куча плагинов регистрируют свои шорткоды, которые генерируются в зависимости от настроек и вставляются в нужное место на сайте. Так чем мы хуже "плагиноделов"?

Создание и использование shortcode

Наверняка есть куча плагинов и для создания самих шорткодов, но наша с вами задача заключается в том, чтобы как можно больше плагинов заменить самостоятельным исходным кодом. Рассмотрю на примере JavaScriptaа. Недавно я опубликовал страницу с каталогом своей электронной библиотеки, и, чтобы упростить навигацию, добавил раскрывающиеся списки. Но реализация этого скрипта сейчас для нас не суть, нам главное понять, как сделать из него шорткод и вставить в страницу.

1. Пишем функцию

Открываем любым доступным способом файл functions.php, который находится в корне каталога с вашей темой, и добавляем туда свою функцию. Ее задача внедрить в код страницы скрипт. Можно действовать двумя способами.

Первый — это вывести текст скрипта с помощью echo, тогда он появится в самом начале тела страницы. Этот способ подходит в том случае, если расположение скрипта внутри страницы не играет роли.

Если же вам нужно поместить скрипт в определенное место(например вывести рекламный блок), то текст скрипта функция должна вернуть с помощью return.

Приведу пример функции, написанной вторым способом.

function getEbookLibraryScript() {
    return "
        <script type='text/javascript'>
        jQuery(function($) {
  
          $(document).ready(function() {
            $('#authors-list > li > ul').hide();
            $('#authors-list > li > h3').hide();
          });

          $('#authors-list > h2').click(function() {

            if ($(this).parent().find('h3').length) {
              $(this).parent().find('h3').slideToggle(200); 

              $(this).parent().find('li').find('ul').slideUp();

              return false;
            }

          });

          $('#authors-list > li > h3').click(function() {

            if ($(this).parent().find('ul').length) {
              $(this).parent().find('ul').slideToggle(200); 

              return false;
            }

          });
        });
        </script>
        ";
}

2. Создаем shortcode

У нас есть функция, теперь нужно познакомить ее с WordPress`ом. Для этого воспользуемся встроенной в WP функцией add_shortcode. Она принимается два параметра: название будущего шорткода и имя функции, которая должна исполняться. В нашем примере это будет выглядеть вот так.

add_shortcode(‘ebookLib’, ‘getEbookLibraryScript’);

Вызов следует поместить сразу после тела функции getEbookLibraryScript, чтобы потом не искать.

3. Вставляем shortcode в страницу

У нас есть скрипт в функции и зарегистрированный шорткод. Теперь мы вставим его в тело страницы таким образом.

[ebookLib]

WordPress при форматировании текста обнаружит квадратные скобочки и отправится на поиски нужной функции по имени шорткода. Поздравляю, цель достигнута!

Заключение

Мой WordPress потихоньку превращается в гибкий и податливый инструмент, ничем не уступающий любому другому фреймворку, и мне это очень нравится. В дальнейших планах у меня неторопливое избавление от многих плагинов. Дело не  в том, что я не доверяю сторонним наработкам, просто свое всегда роднее. Но это в планах, а на сегодня у меня все, спасибо за внимание!