Как создать динамическую таблицу в WordPress с помощью шорткода

Зачем нужна динамическая таблица в WordPress

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

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

В этой статье мы рассмотрим, как создать собственный шорткод для динамической таблицы с использованием PHP и SQL-запросов к базе данных WordPress, а также приведем примеры готовых плагинов для работы с таблицами.

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

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

Добавьте следующий код в файл functions.php вашей темы или в отдельный плагин:

function wpconfig_dynamic_table_shortcode() {
    global $wpdb;
    // Пример: получаем данные из пользовательской таблицы wpconfig_data
    $table_name = $wpdb->prefix . 'wpconfig_data';
    
    $results = $wpdb->get_results("SELECT id, name, value FROM $table_name");
    if (empty($results)) {
        return '<p>Данные отсутствуют.</p>';
    }
    
    $output = '<table border="1" cellpadding="5" cellspacing="0">';
    $output .= '<thead><tr><th>ID</th><th>Название</th><th>Значение</th></tr></thead>';
    $output .= '<tbody>';
    foreach ($results as $row) {
        $output .= "<tr><td>" . esc_html($row->id) . "</td><td>" . esc_html($row->name) . "</td><td>" . esc_html($row->value) . "</td></tr>";
    }
    $output .= '</tbody></table>';
    
    return $output;
}
add_shortcode('wpconfig_table', 'wpconfig_dynamic_table_shortcode');

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

• Используем глобальный объект $wpdb для доступа к базе данных.
• Запрашиваем данные из пользовательской таблицы wpconfig_data, которая должна быть создана заранее.
• Если данные есть, формируем HTML таблицу с заголовками и строками.
• Добавляем шорткод [wpconfig_table], который можно вставить в любой контент.

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

Создание пользовательской таблицы в базе

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

function wpconfig_create_table() {
    global $wpdb;
    $table_name = $wpdb->prefix . 'wpconfig_data';
    $charset_collate = $wpdb->get_charset_collate();

    $sql = "CREATE TABLE IF NOT EXISTS $table_name (
      id mediumint(9) NOT NULL AUTO_INCREMENT,
      name varchar(100) NOT NULL,
      value varchar(255) NOT NULL,
      PRIMARY KEY  (id)
    ) $charset_collate;";

    require_once(ABSPATH . 'wp-admin/includes/upgrade.php');
    dbDelta($sql);
}
register_activation_hook(__FILE__, 'wpconfig_create_table');

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

Использование популярных плагинов для динамических таблиц

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

• TablePress — мощный и бесплатный плагин с удобным интерфейсом для создания таблиц. Позволяет импортировать/экспортировать CSV, XLS, Google Sheets и выводить таблицы через шорткод. Для динамичности можно использовать дополнения или API TablePress.
• wpDataTables — платный плагин с расширенными функциями: подключение к базе данных, AJAX загрузка, сортировка, фильтрация и визуализация данных. Отлично подходит для сложных таблиц с большим объемом данных.
• Data Tables Generator by Supsystic — еще один удобный плагин с визуальным редактором, поддержкой кастомных запросов и адаптивным дизайном.

Для примера интеграции TablePress с кастомным SQL-запросом можно использовать его API, но для большинства случаев удобнее использовать встроенный интерфейс.

Как расширить функционал динамической таблицы своими руками

Если базового шорткода мало, можно добавить в него:

• Пагинацию — разбить таблицу на страницы, чтобы не грузить много данных сразу.
• Сортировку по колонкам — чтобы посетитель мог сортировать данные кликом на заголовок.
• Фильтры — например, выпадающие списки или поля поиска по колонкам.

Для реализации пагинации можно добавить параметр page в URL или шорткод, а в SQL-запрос использовать LIMIT и OFFSET. Пример:

function wpconfig_dynamic_table_shortcode($atts) {
    global $wpdb;
    $atts = shortcode_atts(array('page' => 1), $atts, 'wpconfig_table');
    $items_per_page = 10;
    $offset = ($atts['page'] - 1) * $items_per_page;
    
    $table_name = $wpdb->prefix . 'wpconfig_data';
    
    $results = $wpdb->get_results($wpdb->prepare("SELECT id, name, value FROM $table_name LIMIT %d OFFSET %d", $items_per_page, $offset));

    // Вывод таблицы как в предыдущем примере
    // ...
}
add_shortcode('wpconfig_table', 'wpconfig_dynamic_table_shortcode');

<

Для сортировки можно добавить в шорткод атрибуты orderby и order и использовать их в SQL-запросе с проверкой допустимых значений для безопасности.

Пример защиты от SQL-инъекций при сортировке

function wpconfig_dynamic_table_shortcode($atts) {
    global $wpdb;
    $atts = shortcode_atts(array(
        'orderby' => 'id',
        'order' => 'ASC'
    ), $atts, 'wpconfig_table');

    $allowed_orderby = array('id','name','value');
    $allowed_order = array('ASC','DESC');

    $orderby = in_array($atts['orderby'], $allowed_orderby) ? $atts['orderby'] : 'id';
    $order = in_array(strtoupper($atts['order']), $allowed_order) ? strtoupper($atts['order']) : 'ASC';

    $table_name = $wpdb->prefix . 'wpconfig_data';
    
    $results = $wpdb->get_results("SELECT id, name, value FROM $table_name ORDER BY $orderby $order");

    // Вывод таблицы
}

Так вы обезопасите запрос от внедрения вредоносного кода через параметры сортировки.

Выводы и рекомендации

Динамические таблицы — отличный инструмент для отображения актуальных данных на сайте WordPress без постоянного ручного обновления. Использование шорткодов с кастомным PHP-кодом дает гибкость и возможность интеграции с любыми данными.

Если вы не готовы писать код, используйте проверенные плагины, которые обеспечивают удобный интерфейс, фильтры и сортировку.

Обязательно уделяйте внимание безопасности при работе с базой данных — используйте prepare, фильтруйте входящие данные и избегайте прямого включения переменных в SQL-запросы.

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