Как создать таблицу всех товаров Woocomerce, вывести ее на основном и другом сайте через скрипт

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

Сложная задача, которая оказалась посильной chat.qwen.ai 2.5

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


// 2 таблицы выводим на других сайтах
//
	
add_action('rest_api_init', function () {
    // Endpoint для первой таблицы
    register_rest_route('custom/v1', '/table-html-1/', array(
        'methods' => 'GET',
        'callback' => 'get_table_html_1',
    ));

    // Endpoint для второй таблицы
    register_rest_route('custom/v1', '/table-html-2/', array(
        'methods' => 'GET',
        'callback' => 'get_table_html_2',
    ));
});

// Функция для получения HTML первой таблицы
function get_table_html_1() {
    // ID страницы с первой таблицей (замените на реальный ID)
    $page_id = 52084; // Укажите ID страницы с первой таблицей

    // Получаем содержимое страницы
    $page_content = get_post_field('post_content', $page_id);

    // Применяем фильтры WordPress для обработки шорткодов и других элементов
    $page_content = apply_filters('the_content', $page_content);

    // Ищем HTML-код таблицы
    if (preg_match('/<table.*?>.*?<\/table>/is', $page_content, $matches)) {
        return rest_ensure_response($matches[0]); // Возвращаем только таблицу
    }

    return rest_ensure_response('<p>Таблица 1 не найдена.</p>');
}

// Функция для получения HTML второй таблицы
function get_table_html_2() {
    // ID страницы со второй таблицей (замените на реальный ID)
    $page_id = 52087; // Укажите ID страницы со второй таблицей

    // Получаем содержимое страницы
    $page_content = get_post_field('post_content', $page_id);

    // Применяем фильтры WordPress для обработки шорткодов и других элементов
    $page_content = apply_filters('the_content', $page_content);

    // Ищем HTML-код таблицы
    if (preg_match('/<table.*?>.*?<\/table>/is', $page_content, $matches)) {
        return rest_ensure_response($matches[0]); // Возвращаем только таблицу
    }

    return rest_ensure_response('<p>Таблица 2 не найдена.</p>');
}
// 2 таблицы выводим на других сайтах




// Таблицы и сортировка товаров сайтов с доменои и без для сторонних сайтов

// Функция для вывода таблицы товаров
function display_products_table($atts) {
    // Получаем атрибуты шорткода (например, category="slug")
    $atts = shortcode_atts(array(
        'category' => '', // Слаг категории по умолчанию
    ), $atts, 'products_table');

    // Параметры запроса
    $args = array(
        'post_type'      => 'product', // Только товары WooCommerce
        'posts_per_page' => -1,       // Все товары
        'post_status'    => 'publish', // Только опубликованные товары
        'tax_query'      => array(
            array(
                'taxonomy' => 'pa_thematics', // Таксономия "Тематика"
                'operator' => 'EXISTS',      // Товары с назначенной таксономией
            ),
        ),
    );

    // Если указана категория, добавляем фильтр по категории
    if (!empty($atts['category'])) {
        $args['tax_query'][] = array(
            'taxonomy' => 'product_cat', // Категории WooCommerce
            'field'    => 'slug',       // Используем слаг категории
            'terms'    => $atts['category'], // Указанный слаг категории
        );
    }

    // Выполняем запрос
    $products = new WP_Query($args);

    // Если товары найдены
    if ($products->have_posts()) {
        ob_start(); // Начинаем буферизацию вывода
        echo '<table style="width: 100%; border-collapse: collapse;">';
        echo '<tr>
                <th>Название товара</th>
                <th>Цена</th>
                <th>Ссылка на сайт</th>
                <th>Тематика (А-Я)<span class="pulse"> Сортировка по тематике  от А до Я</sapn></th>
			</tr>';

        while ($products->have_posts()) {
            $products->the_post();
            global $product;

            // Получаем данные товара
            $product_id = get_the_ID();
            $title = get_the_title(); // Название товара
            $price = $product->get_price_html(); // Цена
            $short_description = apply_filters('the_content', $product->get_short_description()); // Краткое описание

            // Получаем значение атрибута "Тематика"
            $tematika = '';
            $taxonomy = 'pa_thematics'; // Слаг таксономии для атрибута "Тематика"

            // Проверяем, существует ли таксономия
            if (taxonomy_exists($taxonomy)) {
                $tematika_terms = wp_get_post_terms($product_id, $taxonomy);
                if (!empty($tematika_terms) && !is_wp_error($tematika_terms)) {
                    $tematika = $tematika_terms[0]->name; // Берем первое значение атрибута
                } else {
                    $tematika = 'Значение не найдено'; // Отладочное сообщение
                }
            } else {
                $tematika = 'Таксономия не существует'; // Отладочное сообщение
            }

            // Выводим строку таблицы
            echo '<tr>';
            echo '<td>' . esc_html($title) . '</td>';
            echo '<td>' . $price . '</td>';
            echo '<td>' . $short_description . '</td>';
            echo '<td>' . esc_html($tematika) . '</td>';
            echo '</tr>';
        }

        echo '</table>';
        wp_reset_postdata(); // Сброс цикла
        return ob_get_clean(); // Возвращаем буферизованный вывод
    } else {
        return '<p>Товаров не найдено.</p>';
    }
}

// Регистрация шорткода
add_shortcode('products_table', 'display_products_table');
// Подключение JavaScript для сортировки таблицы
function enqueue_sort_script() {
    ?>
    <script>
        document.addEventListener("DOMContentLoaded", function () {
            const table = document.querySelector("table");
            if (!table) return; // Если таблица не найдена, завершаем выполнение

            const rows = Array.from(table.querySelectorAll("tr:nth-child(n+2)")); // Все строки таблицы, кроме заголовка

            // Сортировка строк по столбцу "Тематика" (четвертый столбец)
            rows.sort((a, b) => {
                const aText = a.children[3].innerText.trim().toLowerCase(); // Значение из столбца "Тематика"
                const bText = b.children[3].innerText.trim().toLowerCase();
                return aText.localeCompare(bText); // Сравнение строк
            });

            // Добавляем отсортированные строки обратно в таблицу
            const tbody = table.querySelector("tbody");
            if (tbody) {
                rows.forEach(row => tbody.appendChild(row));
            }
        });
    </script>
    <?php
}
add_action('wp_footer', 'enqueue_sort_script');


// Таблицы и сортировка товаров сайтов с доменом и без для сторонних сайтов

2. На сайте поддомене (другом URL) для вывода таблицы добавляем:


 <div class="content">

 <div id="table-container">Загрузка данных...</div>

<script>
document.addEventListener("DOMContentLoaded", function () {
    // Функция для сортировки таблицы
    function sortTable() {
        const table = document.querySelector("table");
        if (!table) return;

        const rows = Array.from(table.querySelectorAll("tr:nth-child(n+2)"));
        rows.sort((a, b) => {
            const aText = a.children[3].innerText.trim().toLowerCase();
            const bText = b.children[3].innerText.trim().toLowerCase();
            return aText.localeCompare(bText);
        });

        const tbody = table.querySelector("tbody");
        if (tbody) {
            rows.forEach(row => tbody.appendChild(row));
        }
    }

    // Отслеживание изменений в DOM
    const observer = new MutationObserver(function (mutations) {
        mutations.forEach(function (mutation) {
            if (document.querySelector("table")) {
                sortTable(); // Запускаем сортировку, если таблица найдена
                observer.disconnect(); // Останавливаем наблюдение
            }
        });
    });

    // Начинаем наблюдение за изменениями в DOM
    observer.observe(document.body, { childList: true, subtree: true });
});
</script>



<script>
    // URL REST API
    const apiUrl = 'https://zaplata.ru/wp-json/custom/v1/table-html-2/';

    // Функция для получения данных
    async function fetchTableHtml() {
        try {
            const response = await fetch(apiUrl, { method: 'GET' });
            if (!response.ok) {
                throw new Error(`Ошибка HTTP: ${response.status}`);
            }

            // Получаем данные как JSON
            const data = await response.json();

            // Вставляем HTML-код таблицы на страницу
            document.getElementById('table-container').innerHTML = data || '<p>Таблица не найдена.</p>';
        } catch (error) {
            document.getElementById('table-container').innerHTML = `<p>Ошибка: ${error.message}</p>`;
        }
    }

    // Вызываем функцию при загрузке страницы
    fetchTableHtml();
</script>

</div>
guest
Другие сообщения форума
Закрыть меню