wpnotes.ru wordpress WP Notes

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

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

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

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

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

Преимущества использования собственных шорткодов:

  • Упрощение работы с контентом для редакторов сайта.
  • Возможность добавлять динамический и интерактивный контент.
  • Гибкость и расширяемость функционала без правок тем и плагинов.

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

Для создания шорткода необходимо зарегистрировать функцию, которая будет формировать вывод, и связать её с определённым именем шорткода с помощью функции add_shortcode(). Рассмотрим пример на wpnotes.

Вот базовый пример создания собственного шорткода, который выводит приветствие:

function wpnotes_hello_shortcode($atts) {
    $atts = shortcode_atts(array(
        'name' => 'Гость',
    ), $atts);
    return 'Привет, ' . esc_html($atts['name']) . '! Добро пожаловать на wpnotes.ru';
}
add_shortcode('wpnotes_hello', 'wpnotes_hello_shortcode');

В этом коде функция wpnotes_hello_shortcode принимает атрибуты шорткода, устанавливает значение по умолчанию для параметра name и возвращает строку с приветствием.

Использование шорткода в записи будет выглядеть так: [wpnotes_hello name="Алексей"]. На сайте выведется: Привет, Алексей! Добро пожаловать на wpnotes.ru.

Продвинутые возможности: шорткод с выводом списка последних записей

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

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

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

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

    if (!empty($atts['category'])) {
        $args['category_name'] = sanitize_text_field($atts['category']);
    }

    $query = new WP_Query($args);

    if (!$query->have_posts()) {
        return '<p>Записей не найдено.</p>';
    }

    $output = '<ul class="wpnotes-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('wpnotes_latest_posts', 'wpnotes_latest_posts_shortcode');

Пример использования шорткода: [wpnotes_latest_posts category="wordpress" count="3"] — выведет 3 последние записи из категории «wordpress».

Объяснение кода

В функции мы используем shortcode_atts для обработки входных параметров. Затем формируем аргументы для WP_Query с учётом переданных атрибутов. Если категория указана, добавляем её в параметры запроса. После выполнения запроса формируем HTML-список с заголовками и ссылками на записи.

Важно после цикла вызвать wp_reset_postdata(), чтобы не нарушать глобальный объект поста.

Как добавить поддержку вложенных шорткодов и безопасный вывод

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

Пример функции с поддержкой вложенных шорткодов:

function wpnotes_wrapper_shortcode($atts, $content = null) {
    return '<div class="wpnotes-wrapper">' . do_shortcode($content) . '</div>';
}
add_shortcode('wpnotes_wrapper', 'wpnotes_wrapper_shortcode');

Такой шорткод оборачивает вложенный контент в div с классом, а если внутри будут другие шорткоды, они тоже будут обработаны.

Также не забывайте про безопасность: всегда экранируйте вывод с помощью функций esc_html(), esc_attr() или wp_kses_post(), чтобы избежать XSS-уязвимостей.

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

Если вы не хотите создавать шорткоды вручную, можно использовать плагины, которые облегчают эту задачу:

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

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

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

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

Обязательно придерживайтесь следующих правил:

  • Используйте префиксы в названиях функций и шорткодов, например, wpnotes_, чтобы избежать конфликтов.
  • Обрабатывайте и фильтруйте входящие данные с помощью shortcode_atts и функций безопасности.
  • Не забывайте очищать данные, которые выводите, чтобы защитить сайт.
  • Тестируйте шорткоды с разными параметрами и в разных местах сайта.

Таким образом, вы сможете создавать мощные и гибкие решения, которые упростят работу с контентом на вашем сайте wpnotes.ru и сделают его уникальным.

×

AI-плагин

WPGPT
Сам создает статьи для вашего сайта WordPress

SEO и мета-теги

Парсинг конкурентов

Изображения

Комментарии

Подробнее