Как создать уникальный функционал для вывода данных в WordPress с помощью шорткодов

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

Что такое шорткоды и зачем создавать собственные?

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

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

Основные шаги создания шорткода в WordPress

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

function wp_puzzle_simple_shortcode() {
    return '<strong>Привет от WP Puzzle!</strong>';
}
add_shortcode('wp_puzzle_greeting', 'wp_puzzle_simple_shortcode');

Теперь в редакторе можно вставить [wp_puzzle_greeting], и на сайте появится жирный текст «Привет от WP Puzzle!».

Обратите внимание на префикс wp_puzzle_ в названии функции — это хорошая практика для избежания конфликтов с другими плагинами и темами.

Вывод динамических данных с параметрами шорткода

Чтобы сделать шорткод более гибким, в функцию можно передавать параметры. Например, создадим шорткод, который выводит количество последних постов определенной категории:

function wp_puzzle_latest_posts_shortcode($atts) {
    $atts = shortcode_atts(
        array(
            'category' => '',
            'count' => 5,
        ), $atts, 'wp_puzzle_latest_posts'
    );

    $args = array(
        'posts_per_page' => intval($atts['count']),
        'category_name' => sanitize_text_field($atts['category']),
        'post_status' => 'publish',
    );

    $query = new WP_Query($args);
    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('wp_puzzle_latest_posts', 'wp_puzzle_latest_posts_shortcode');

Использование: [wp_puzzle_latest_posts category="novosti" count="3"] выведет 3 последних поста из категории «новости».

Обработка ошибок и безопасность

Важно использовать функции sanitize_text_field() и intval() для очистки входящих данных, чтобы защитить сайт от потенциальных уязвимостей.

Интеграция с плагинами WPShop для расширения возможностей

Если вы используете плагины из набора WPShop, можно создавать шорткоды, которые взаимодействуют с их функционалом. Например, плагин WPRemark позволяет собирать и выводить отзывы. Создадим шорткод для вывода последних отзывов:

function wp_puzzle_show_latest_reviews($atts) {
    $atts = shortcode_atts(array('count' => 5), $atts, 'wp_puzzle_latest_reviews');

    // Предположим, WPRemark хранит отзывы как кастомный тип 'wpremark_review'
    $args = array(
        'post_type' => 'wpremark_review',
        'posts_per_page' => intval($atts['count']),
        'post_status' => 'publish',
    );

    $query = new WP_Query($args);
    if (!$query->have_posts()) {
        return '<p>Отзывы не найдены.</p>';
    }

    $output = '<div class="wp_puzzle_reviews">';
    while ($query->have_posts()) {
        $query->the_post();
        $rating = get_post_meta(get_the_ID(), 'wpremark_rating', true);
        $output .= '<div class="review">';
        $output .= '<h4>' . get_the_title() . '</h4>';
        $output .= '<div class="rating">Рейтинг: ' . esc_html($rating) . '/5</div>';
        $output .= '<p>' . get_the_content() . '</p>';
        $output .= '</div>';
    }
    wp_reset_postdata();
    $output .= '</div>';

    return $output;
}
add_shortcode('wp_puzzle_latest_reviews', 'wp_puzzle_show_latest_reviews');

Вставьте [wp_puzzle_latest_reviews count="3"] в нужное место, и на сайте появятся 3 последних отзыва с рейтингом.

Создание интерактивных шорткодов с AJAX

Иногда нужно, чтобы шорткод не просто выводил данные при загрузке страницы, а динамически обновлялся без перезагрузки. Для этого подходит AJAX в WordPress.

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

Шаг 1. Функция шорткода с кнопкой и контейнером

function wp_puzzle_random_quote_shortcode() {
    wp_enqueue_script('wp_puzzle_ajax_script', get_template_directory_uri() . '/js/wp_puzzle_ajax.js', array('jquery'), null, true);
    wp_localize_script('wp_puzzle_ajax_script', 'wpPuzzleAjax', array(
        'ajax_url' => admin_url('admin-ajax.php'),
        'nonce' => wp_create_nonce('wp_puzzle_nonce')
    ));

    $output = '<div id="wp_puzzle_quote">Загрузка цитаты...</div>';
    $output .= '<button id="wp_puzzle_refresh">Показать другую цитату</button>';
    return $output;
}
add_shortcode('wp_puzzle_random_quote', 'wp_puzzle_random_quote_shortcode');

Шаг 2. Обработка AJAX запроса в PHP

function wp_puzzle_get_random_quote() {
    check_ajax_referer('wp_puzzle_nonce', 'nonce');

    $quotes = array(
        'Сила в правде.',
        'Не откладывай на завтра то, что можно сделать сегодня.',
        'Лучший способ предсказать будущее — создать его.',
        'Учись, чтобы жить, а не живи, чтобы учиться.'
    );

    $quote = $quotes[array_rand($quotes)];
    wp_send_json_success($quote);
}
add_action('wp_ajax_wp_puzzle_get_quote', 'wp_puzzle_get_random_quote');
add_action('wp_ajax_nopriv_wp_puzzle_get_quote', 'wp_puzzle_get_random_quote');

Шаг 3. JS скрипт для обновления цитаты

jQuery(document).ready(function($) {
    function wp_puzzle_load_quote() {
        $.post(wpPuzzleAjax.ajax_url, {
            action: 'wp_puzzle_get_quote',
            nonce: wpPuzzleAjax.nonce
        }, function(response) {
            if(response.success) {
                $('#wp_puzzle_quote').text(response.data);
            } else {
                $('#wp_puzzle_quote').text('Ошибка загрузки цитаты');
            }
        });
    }

    wp_puzzle_load_quote();

    $('#wp_puzzle_refresh').click(function() {
        wp_puzzle_load_quote();
    });
});

Рекомендации по организации кода и безопасности

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

Обязательно проверяйте и фильтруйте все входящие данные, используйте nonce для AJAX-запросов, чтобы защитить сайт от CSRF атак.

Заключение

Создание уникальных шорткодов в WordPress — отличный способ расширить функционал сайта и упростить работу редакторов. В статье мы рассмотрели базовые и продвинутые примеры, включая параметры, интеграцию с плагинами WPShop и динамический вывод с помощью AJAX.

Если хотите ознакомиться с полезными плагинами для расширения функционала, рекомендуем посетить каталог плагинов WPShop.