Шорткоды — мощный инструмент WordPress, позволяющий добавлять на страницы и записи динамический контент без необходимости писать сложный код каждый раз. В этой статье мы подробно разберем, как создать свой собственный шорткод, какие есть полезные примеры и как сделать его максимально гибким и удобным для использования.
Что такое шорткод и зачем он нужен в WordPress
Шорткод — это специальный тег в квадратных скобках, например [wpsystem_hello], который заменяется на определенный контент при отображении страницы. Это позволяет добавлять функциональность, например, выводить галерею, форму или динамические данные без редактирования темы или плагинов.
Пользовательские шорткоды особенно полезны, когда нужно многократно использовать один и тот же функционал на сайте или передавать параметры для динамического вывода.
Как создать базовый шорткод в WordPress
Чтобы создать шорткод, достаточно добавить в файл functions.php вашей темы или в отдельный плагин функцию с регистрацией. Рассмотрим пример простого шорткода, который выводит приветствие.
function wpsystem_hello_shortcode() {
return '<p>Привет, это шорткод от wpsystem.ru!</p>';
}
add_shortcode('wpsystem_hello', 'wpsystem_hello_shortcode');Теперь, если в записи добавить [wpsystem_hello], WordPress заменит этот тег на <p>Привет, это шорткод от wpsystem.ru!</p>.
Как добавить параметры в шорткод
Часто нужно, чтобы шорткод принимал параметры, например имя пользователя или цвет текста. Для этого функция шорткода принимает аргумент с атрибутами.
function wpsystem_greeting_shortcode($atts) {
$atts = shortcode_atts(
array(
'name' => 'Гость',
'color' => 'black',
), $atts, 'wpsystem_greeting'
);
return '<p style="color:' . esc_attr($atts['color']) . '">Привет, ' . esc_html($atts['name']) . '!</p>';
}
add_shortcode('wpsystem_greeting', 'wpsystem_greeting_shortcode');Пример использования: [wpsystem_greeting name="Андрей" color="blue"]. Выведет синим цветом текст «Привет, Андрей!».
Практические примеры пользовательских шорткодов
Вывод списка последних записей с настраиваемым количеством
Создадим шорткод для вывода последних N записей блога с заголовками и ссылками. Это удобно, если хочется добавить блок с новостями в любом месте контента.
function wpsystem_latest_posts_shortcode($atts) {
$atts = shortcode_atts(array('count' => 5), $atts, 'wpsystem_latest_posts');
$query = new WP_Query(array(
'posts_per_page' => intval($atts['count']),
'post_status' => 'publish'
));
if (!$query->have_posts()) {
return '<p>Записей не найдено.</p>';
}
$output = '<ul>';
while ($query->have_posts()) {
$query->the_post();
$output .= '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
}
wp_reset_postdata();
$output .= '</ul>';
return $output;
}
add_shortcode('wpsystem_latest_posts', 'wpsystem_latest_posts_shortcode');Используйте так: [wpsystem_latest_posts count="3"], чтобы вывести 3 последних записи.
Создание шорткода с формой обратной связи
Иногда нужно быстро вставить простую форму обратной связи. Ниже пример базового шорткода с формой отправки на email администратора.
function wpsystem_contact_form_shortcode() {
if ('POST' === $_SERVER['REQUEST_METHOD'] && !empty($_POST['wpsystem_contact_nonce']) && wp_verify_nonce($_POST['wpsystem_contact_nonce'], 'wpsystem_contact_form')) {
$name = sanitize_text_field($_POST['name']);
$email = sanitize_email($_POST['email']);
$message = sanitize_textarea_field($_POST['message']);
if ($name && $email && $message) {
wp_mail(get_option('admin_email'), 'Новое сообщение с сайта', "Имя: $name\nEmail: $email\nСообщение: $message");
return '<p>Спасибо за ваше сообщение!</p>';
} else {
return '<p style="color:red;">Пожалуйста, заполните все поля.</p>' . wpsystem_get_contact_form_html();
}
}
return wpsystem_get_contact_form_html();
}
function wpsystem_get_contact_form_html() {
ob_start();
?>
<form method="post">
<p><label>Имя:</label><br>
<input type="text" name="name" required></p>
<p><label>Email:</label><br>
<input type="email" name="email" required></p>
<p><label>Сообщение:</label><br>
<textarea name="message" required></textarea></p>
<input type="hidden" name="wpsystem_contact_nonce" value="<?php echo wp_create_nonce('wpsystem_contact_form'); ?>">
<p><input type="submit" value="Отправить"></p>
</form>
<?php
return ob_get_clean();
}
add_shortcode('wpsystem_contact_form', 'wpsystem_contact_form_shortcode');Этот шорткод [wpsystem_contact_form] вставляет простую форму, которая отправляет письмо на email администратора сайта. Код учитывает защиту от CSRF с помощью wp_nonce.
Рекомендации по безопасности и оптимизации шорткодов
При создании шорткодов важно помнить о безопасности. Все входящие данные нужно обязательно очищать и валидировать. Используйте функции WordPress: sanitize_text_field, esc_html, esc_attr и другие для предотвращения XSS и других уязвимостей.
Также следите за производительностью. Если шорткод выполняет запросы к базе или внешним сервисам, кешируйте результаты с помощью Transients API или других методов.
Для удобства пользователей добавляйте описание и параметры в документацию, чтобы легко использовать шорткод без изучения кода.
Полезные плагины для работы с шорткодами
Хотя собственные шорткоды дают максимальную гибкость, иногда удобнее использовать готовые решения. Вот несколько популярных плагинов для расширенного управления шорткодами:
- Shortcodes Ultimate — набор из 50+ готовых шорткодов с визуальным редактором.
- WP Shortcode by MyThemeShop — простой плагин с полезными базовыми шорткодами.
- Custom Content Shortcode — позволяет создавать условный вывод контента с помощью шорткодов.
Эти плагины помогут быстро расширить функциональность сайта без написания кода.
Заключение: создавайте шорткоды под свои задачи
Создание собственных шорткодов — это отличный способ добавить уникальные функции в WordPress без изменения темы или сложных плагинов. Следуйте описанным рекомендациям, используйте проверенные методы безопасности и экспериментируйте с параметрами, чтобы получить максимально полезный и удобный инструмент для вашего сайта.