Как создать собственный шорткод в WordPress

Шорткоды — это мощный инструмент WordPress, позволяющий вставлять сложный функционал в записи и страницы без необходимости писать HTML или PHP напрямую. В этой статье мы подробно разберём, как создавать собственные шорткоды, которые решат конкретные задачи на вашем сайте. Рассмотрим примеры кода и советы по их использованию.

Что такое шорткод в WordPress и зачем он нужен

Шорткод — это специальный тег в квадратных скобках, например [gallery], который WordPress распознаёт и заменяет определённым содержимым. С помощью шорткодов можно вставлять фото-галереи, формы, кнопки, кастомные блоки и многое другое.

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

Пример простого шорткода, который выводит текущую дату:

function wpinc_show_date() {
    return date('d.m.Y');
}
add_shortcode('wpinc_date', 'wpinc_show_date');

Теперь в любом месте сайта можно вставить [wpinc_date], и появится текущая дата.

Создание более сложных шорткодов с параметрами

Шорткоды могут принимать параметры, что позволяет менять их поведение. Рассмотрим пример шорткода для вывода кнопки с настраиваемым текстом и ссылкой.

function wpinc_button_shortcode($atts) {
    $atts = shortcode_atts(
        array(
            'text' => 'Нажми меня',
            'url' => '#',
            'color' => 'blue'
        ),
        $atts,
        'wpinc_button'
    );

    return '<a href="' . esc_url($atts['url']) . '" class="wpinc-button wpinc-button-' . esc_attr($atts['color']) . '">' . esc_html($atts['text']) . '</a>';
}
add_shortcode('wpinc_button', 'wpinc_button_shortcode');

Использование:

[wpinc_button text="Купить" url="https://example.com" color="red"]

Результат — красивая кнопка с заданным текстом, ссылкой и цветом. Для стилей добавьте в CSS:

.wpinc-button { padding: 10px 20px; color: #fff; text-decoration: none; border-radius: 4px; }
.wpinc-button-blue { background-color: #0073aa; }
.wpinc-button-red { background-color: #d63638; }

Интеграция шорткодов с внешними плагинами и API

Шорткоды можно использовать для вывода данных из плагинов или внешних сервисов. Например, подключим вывод последних постов с помощью WP_Query.

function wpinc_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(array('count' => 5), $atts, 'wpinc_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 class="wpinc-latest-posts">';
    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('wpinc_latest_posts', 'wpinc_latest_posts_shortcode');

Вызов: [wpinc_latest_posts count="3"] — покажет 3 новых поста.

Советы по безопасности и оптимизации шорткодов

При создании шорткодов важно фильтровать и экранировать входящие данные, чтобы избежать XSS-уязвимостей. Используйте функции esc_html(), esc_url() и другие.

Также не стоит выполнять тяжёлые запросы или сетевые операции внутри шорткодов без кэширования, чтобы не замедлять сайт.

Для кэширования можно использовать Transients API: сохранять результат вывода шорткода и обновлять его через заданный интервал.

Расширение функционала: шорткоды с вложенным содержимым

Иногда нужно, чтобы шорткод обрабатывал содержимое между открывающим и закрывающим тегом. Для этого в функции регистрации шорткода укажите третий параметр — содержимое.

function wpinc_highlight_shortcode($atts, $content = null) {
    if ($content === null) {
        return '';
    }
    return '<span style="background-color: yellow;">' . esc_html($content) . '</span>';
}
add_shortcode('wpinc_highlight', 'wpinc_highlight_shortcode');

Использование:

[wpinc_highlight]Выделенный текст[/wpinc_highlight]

Результат — текст с жёлтым фоном.

Полезные плагины для работы с шорткодами

Для удобства создания и управления шорткодами можно использовать плагины:

• Shortcodes Ultimate — набор готовых шорткодов и визуальный редактор для их вставки.
• WP Shortcode by MyThemeShop — лёгкий плагин с базовым набором шорткодов.
• Custom Shortcodes — позволяет создавать и редактировать собственные шорткоды без правки кода.

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

Итоговые рекомендации по созданию шорткодов на WordPress

Создавая собственные шорткоды на WordPress, придерживайтесь следующих правил:

• Используйте префиксы в названиях функций и шорткодов (например, wpinc_), чтобы избежать конфликтов.
• Всегда фильтруйте и экранируйте входящие параметры и вывод.
• Пишите компактный и понятный код, разделяйте логику и отображение.
• Тестируйте шорткоды в разных местах сайта и с разными параметрами.
• Документируйте ваши шорткоды, чтобы другие разработчики могли быстро понять их назначение.

Таким образом, шорткоды — это универсальный и удобный способ расширить функциональность сайта на WordPress под конкретные задачи. Создавайте свои шорткоды с умом, и ваш сайт станет гибче и интереснее для пользователей.