Что такое шорткоды в WordPress и зачем они нужны
Шорткоды — это мощный инструмент WordPress, позволяющий вставлять динамический контент в записи, страницы или виджеты с помощью простой текстовой метки в квадратных скобках, например, [gallery]. Они значительно упрощают работу с функционалом сайта, позволяя не писать сложный код прямо в содержимом и давая возможность легко переиспользовать элементы.
Например, с помощью шорткодов можно выводить формы, галереи, кнопки и даже сложные блоки с логикой, не перегружая редактор. Это особенно важно для бизнес-сайтов, где нужно быстро внедрять новые функции без глубокого погружения в код.
В этой статье мы разберём, как создавать собственные шорткоды, зарегистрировать их в WordPress, а также как передавать параметры и использовать их в коде, чтобы расширить возможности своего сайта на wpbusiness.ru.
Регистрация собственного шорткода: базовый пример
Для создания шорткода в WordPress нужно написать функцию, которая возвращает HTML-код, и зарегистрировать её через хук add_shortcode. Рассмотрим простой пример — шорткод, выводящий приветственное сообщение.
function wpbusiness_hello_shortcode() {
return '<p>Привет, посетитель wpbusiness.ru!</p>';
}
add_shortcode('wpbusiness_hello', 'wpbusiness_hello_shortcode');Теперь в любой записи или странице достаточно написать [wpbusiness_hello], и вместо этого появится текст приветствия. Это базовый пример, который легко модифицировать под любые задачи.
Использование атрибутов в шорткодах: динамические данные
Часто требуется, чтобы шорткод принимал параметры — например, имя пользователя, цвет текста или количество элементов. В WordPress функция шорткода принимает два аргумента: массив атрибутов и содержимое между тегами шорткода.
Рассмотрим пример шорткода, который выводит приветствие с именем пользователя и меняет цвет текста:
function wpbusiness_greet_shortcode($atts) {
$atts = shortcode_atts(
array(
'name' => 'гость',
'color' => 'black'
), $atts, 'wpbusiness_greet'
);
return '<p style="color:' . esc_attr($atts['color']) . ';">Привет, ' . esc_html($atts['name']) . '!</p>';
}
add_shortcode('wpbusiness_greet', 'wpbusiness_greet_shortcode');Вызов [wpbusiness_greet name="Алексей" color="blue"] выведет текст «Привет, Алексей!» с синим цветом.
Безопасность и экранирование данных
Обратите внимание, что в примере мы используем функции esc_attr и esc_html для защиты вывода от XSS-атак. Это обязательная практика при работе с пользовательскими данными и атрибутами.
Шорткоды с вложенным содержимым: использование контента между тегами
Шорткоды могут быть парными — иметь открывающий и закрывающий тег, между которыми находится контент. Это полезно, если нужно обернуть или стилизовать текст, который вводит пользователь.
Вот пример шорткода, который выводит цитату с дополнительными стилями:
function wpbusiness_quote_shortcode($atts, $content = null) {
return '<blockquote style="border-left: 4px solid #ccc; padding-left: 10px; color: #555;">' . do_shortcode($content) . '</blockquote>';
}
add_shortcode('wpbusiness_quote', 'wpbusiness_quote_shortcode');Использование:
[wpbusiness_quote]Это пример цитаты, которую можно вставить через шорткод.[/wpbusiness_quote]
В итоге текст будет обёрнут в стилизованный блок цитаты.
Практические применения шорткодов для бизнес-сайта на WordPress
На сайте wpbusiness.ru шорткоды помогут автоматизировать и упростить вывод часто используемых элементов:
- Вставка контактных форм с разметкой и стилями.
- Вывод актуальной информации о скидках и акциях.
- Динамическое отображение отзывов клиентов.
- Генерация кнопок с уникальными ссылками под каждую кампанию.
Рассмотрим пример шорткода для вывода кнопки с кастомными параметрами:
function wpbusiness_button_shortcode($atts) {
$atts = shortcode_atts(
array(
'url' => '#',
'text' => 'Нажми меня',
'color' => '#0073aa'
), $atts, 'wpbusiness_button'
);
return '<a href="' . esc_url($atts['url']) . '" style="display:inline-block; background-color:' . esc_attr($atts['color']) . '; color:#fff; padding:10px 20px; text-decoration:none; border-radius:4px;">' . esc_html($atts['text']) . '</a>';
}
add_shortcode('wpbusiness_button', 'wpbusiness_button_shortcode');Это позволит маркетологам быстро вставлять кнопки с нужным текстом, цветом и ссылкой, не прибегая к помощи разработчиков.
Расширение функционала: вызов шорткодов из PHP-кода темы или плагина
Иногда нужно вывести шорткод не в содержимом записи, а прямо из PHP. Для этого используется функция do_shortcode:
echo do_shortcode('[wpbusiness_button url="https://wpbusiness.ru" text="Посетить сайт" color="#e74c3c"]');Это удобно для динамического формирования страниц и гибкой настройки вывода.
Советы по оптимизации и отладке шорткодов
При разработке шорткодов важно придерживаться нескольких правил:
- Используйте префиксы (например,
wpbusiness_) для функций, чтобы избежать конфликтов с другими плагинами. - Обязательно экранируйте пользовательские данные с помощью функций
esc_html,esc_attr,esc_url. - Тестируйте шорткоды с разными параметрами и на разных страницах.
- Документируйте параметры и поведение шорткода для удобства поддержки.
Для отладки можно временно выводить отладочные данные через error_log или использовать плагины типа Query Monitor, чтобы отслеживать ошибки.
Использование популярных плагинов для расширения возможностей шорткодов
Если не хочется писать шорткоды с нуля, можно использовать плагины, которые упрощают их создание и управление:
- Shortcodes Ultimate — набор готовых шорткодов для различных целей с визуальным редактором.
- WP Shortcode by MyThemeShop — простой и лёгкий плагин с базовыми элементами.
- Custom Content Shortcode — позволяет создавать собственные шорткоды с PHP-кодом.
Однако, для бизнес-сайта лучше иметь собственные решения или кастомизировать их под конкретные задачи, чтобы избежать избыточности и конфликтов.