← Назад в блог

VPWC Attribute Display Settings: управление выводом атрибутов WooCommerce из админки

Практический обзор плагина для управления выводом атрибутов товаров WooCommerce: настройка лимитов, выбор атрибутов для листинга и детальной страницы, кастомные лейблы, единицы измерения, фильтры и программный API.

VPWC Attribute Display Settings: управление выводом атрибутов WooCommerce из админки

Требования

  • WordPress 5.0+
  • WooCommerce (установлен и активирован)
  • PHP 7.4+
  • Базовое понимание WordPress хуков и фильтров

О чём статья

VPWC Attribute Display Settings — это плагин для WordPress, который даёт полный контроль над отображением атрибутов товаров WooCommerce. Вместо того чтобы править код темы или использовать сложные решения, можно настроить всё через админ-панель: какие атрибуты показывать, сколько их выводить, в каком порядке, с какими лейблами и единицами измерения.

Цель статьи: разобрать функциональность плагина, показать примеры использования и объяснить, как интегрировать его в свою тему.

Репозиторий проекта: GitHub - va-proger/wordpress-woocommerce-attributs


Проблема, которую решает плагин

По умолчанию WooCommerce выводит атрибуты товаров на детальной странице, но:

  • ❌ Нет контроля над количеством атрибутов на листинге
  • ❌ Нет выбора, какие атрибуты показывать
  • ❌ Нет управления порядком вывода
  • ❌ Нет возможности добавить единицы измерения (кг, см, м²)
  • ❌ Нет кастомных лейблов
  • ❌ Нет удобных фильтров по атрибутам

Плагин решает все эти задачи через простой интерфейс в админ-панели.


Установка и активация

Требования

  • WordPress 5.0+
  • WooCommerce (обязательно)
  • PHP 7.4+

Установка

  1. Скопируйте папку плагина в wp-content/plugins/
  2. Перейдите в ПлагиныУстановленные плагины
  3. Найдите “VPWC Attribute Display Settings”
  4. Нажмите Активировать

Плагин автоматически проверит наличие WooCommerce. Если WooCommerce не установлен, появится уведомление.

Первая настройка

После активации перейдите в WooCommerceАтрибуты: вывод. Здесь можно настроить:

  • Лимиты атрибутов для листинга и детальной страницы
  • Выбор атрибутов для отображения
  • Порядок сортировки
  • Кастомные лейблы и единицы измерения

Основные возможности

1. Управление выводом атрибутов

Лимиты атрибутов

Установите максимальное количество атрибутов:

  • Лимит для листинга — сколько атрибутов показывать на странице каталога (например, 3)
  • Лимит для детальной страницы — сколько атрибутов показывать на странице товара (например, 5)

Выбор атрибутов

Отметьте галочками, какие атрибуты использовать:

  • ✅ Для листинга (страница каталога)
  • ✅ Для детальной страницы
  • ✅ Для фильтров

Порядок сортировки

Установите число для каждого атрибута (меньше = выше в списке):

Цвет: 1
Размер: 2
Материал: 3

Атрибуты будут отсортированы по возрастанию.

2. Кастомные настройки

Кастомные лейблы

Вместо стандартного названия атрибута можно задать своё:

  • Стандартное: “Цвет”
  • Кастомное: “Цвет товара”

Единицы измерения

Добавьте единицы к значениям атрибутов:

  • Вес: “кг”
  • Размер: “см”
  • Площадь: “м²”

3. Автоматический вывод

Плагин автоматически выводит атрибуты через хуки WooCommerce:

  • Листинг: woocommerce_after_shop_loop_item_title (приоритет 15)
  • Детальная страница: woocommerce_single_product_summary (приоритет 25)

Никаких правок в теме не требуется — всё работает “из коробки”.

4. Фильтры по атрибутам

Используйте шорткод для вывода фильтров:

[vpwc_attribute_filters]

Шорткод можно разместить в сайдбаре, на странице каталога или в любом месте через виджет.


Программный API

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

vpwc_attr_pick($mode, $limit, $product_id = null)

Получить список атрибутов для отображения.

Параметры:

  • $mode (string) — Режим: 'loop', 'single' или 'filter'
  • $limit (int) — Максимальное количество атрибутов
  • $product_id (int|null) — ID товара (опционально, для учёта исключений товара)

Возвращает: Массив атрибутов с настройками

Пример:

$limits = vpwc_attr_limits_get();
$attrs = vpwc_attr_pick('loop', $limits['loop_limit']);

// Вернёт массив вида:
// [
//   ['tax' => 'pa_color', 'order' => 1, 'custom_label' => 'Цвет', 'unit' => ''],
//   ['tax' => 'pa_size', 'order' => 2, 'custom_label' => 'Размер', 'unit' => 'см'],
// ]

vpwc_attr_term_names($product_id, $taxonomy)

Получить значения атрибута для товара.

Параметры:

  • $product_id (int) — ID товара
  • $taxonomy (string) — Название таксономии (например, 'pa_color')

Возвращает: Массив названий терминов

Пример:

global $product;
$product_id = $product->get_id();
$values = vpwc_attr_term_names($product_id, 'pa_color');

// Вернёт: ['Красный', 'Синий']

vpwc_attr_label($taxonomy, $custom_label = '')

Получить лейбл атрибута.

Параметры:

  • $taxonomy (string) — Название таксономии
  • $custom_label (string) — Кастомный лейбл (опционально)

Возвращает: Строка с лейблом

Пример:

$label = vpwc_attr_label('pa_color', 'Цвет товара');
// Вернёт: 'Цвет товара' или стандартное название атрибута

vpwc_attr_limits_get()

Получить настройки лимитов.

Возвращает: Массив с ключами 'loop_limit' и 'single_limit'

Пример:

$limits = vpwc_attr_limits_get();
// Вернёт: ['loop_limit' => 3, 'single_limit' => 5]

Примеры использования в теме

Вывод атрибутов на листинге

Если нужно кастомизировать вывод на листинге:

// В functions.php или в файле темы
add_action('woocommerce_after_shop_loop_item_title', 'my_custom_loop_attributes', 20);

function my_custom_loop_attributes() {
    global $product;

    if (!function_exists('vpwc_attr_pick')) {
        return;
    }

    $limits = vpwc_attr_limits_get();
    $attrs = vpwc_attr_pick('loop', $limits['loop_limit'], $product->get_id());

    if (empty($attrs)) {
        return;
    }

    echo '<div class="product-attributes-loop">';
    foreach ($attrs as $a) {
        $names = vpwc_attr_term_names($product->get_id(), $a['tax']);
        if ($names) {
            $label = vpwc_attr_label($a['tax'], $a['custom_label']);
            $val = implode(', ', $names);
            if (!empty($a['unit'])) {
                $val .= ' ' . $a['unit'];
            }
            echo '<div class="attr-item">';
            echo '<strong>' . esc_html($label) . ':</strong> ';
            echo '<span>' . esc_html($val) . '</span>';
            echo '</div>';
        }
    }
    echo '</div>';
}

Вывод атрибутов на детальной странице

Для кастомизации вывода на странице товара:

add_action('woocommerce_single_product_summary', 'my_custom_single_attributes', 25);

function my_custom_single_attributes() {
    global $product;

    if (!function_exists('vpwc_attr_pick')) {
        return;
    }

    $limits = vpwc_attr_limits_get();
    $attrs = vpwc_attr_pick('single', $limits['single_limit'], $product->get_id());

    if (empty($attrs)) {
        return;
    }

    echo '<div class="product-attributes-single">';
    echo '<h3>Характеристики</h3>';
    foreach ($attrs as $a) {
        $names = vpwc_attr_term_names($product->get_id(), $a['tax']);
        if ($names) {
            $label = vpwc_attr_label($a['tax'], $a['custom_label']);
            $val = implode(', ', $names);
            if (!empty($a['unit'])) {
                $val .= ' ' . $a['unit'];
            }
            echo '<div class="attr-item">';
            echo '<span class="attr-label">' . esc_html($label) . ':</span> ';
            echo '<span class="attr-value">' . esc_html($val) . '</span>';
            echo '</div>';
        }
    }
    echo '</div>';
}

Отключение стандартного вывода

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

// Отключить стандартный вывод
remove_action('woocommerce_after_shop_loop_item_title', 'vpwc_attr_render_loop', 15);
remove_action('woocommerce_single_product_summary', 'vpwc_attr_render_single', 25);

// Добавить свой вывод в нужном месте
add_action('woocommerce_shop_loop_item_title', 'my_custom_attr_display', 20);

function my_custom_attr_display() {
    // Ваш код вывода
}

Фильтры для кастомизации

Плагин предоставляет фильтры для изменения вывода.

vpwc_attributes_loop_output

Фильтр для изменения вывода атрибутов на листинге:

add_filter('vpwc_attributes_loop_output', function($output, $attrs, $product) {
    // Кастомный вывод
    return '<div class="my-custom-attributes">' . $output . '</div>';
}, 10, 3);

vpwc_attributes_single_output

Фильтр для изменения вывода атрибутов на детальной странице:

add_filter('vpwc_attributes_single_output', function($output, $attrs, $product) {
    // Кастомный вывод
    return '<div class="my-custom-attributes">' . $output . '</div>';
}, 10, 3);

vpwc_attributes_limit

Фильтр для изменения лимита атрибутов:

add_filter('vpwc_attributes_limit', function($limit, $mode) {
    if ($mode === 'loop') {
        return 5; // Показывать 5 атрибутов на листинге
    }
    return $limit;
}, 10, 2);

Стилизация

Плагин использует следующие CSS классы:

Для листинга

.vpwc-attrs--loop {
  margin: 10px 0;
  font-size: 14px;
}

.vpwc-attrs--loop .vpwc-attr {
  margin: 5px 0;
  display: flex;
  align-items: center;
}

.vpwc-attrs--loop .vpwc-attr-label {
  font-weight: 600;
  margin-right: 5px;
}

.vpwc-attrs--loop .vpwc-attr-value {
  color: #666;
}

Для детальной страницы

.vpwc-attrs--single {
  margin: 20px 0;
  padding: 15px;
  background: #f9f9f9;
  border-radius: 4px;
}

.vpwc-attrs--single .vpwc-attr {
  margin: 8px 0;
  padding-bottom: 8px;
  border-bottom: 1px solid #eee;
  display: flex;
  justify-content: space-between;
}

.vpwc-attrs--single .vpwc-attr:last-child {
  border-bottom: none;
}

Для фильтров

.vpwc-filters {
  margin: 20px 0;
}

.vpwc-filter {
  margin-bottom: 15px;
}

.vpwc-filter-label {
  font-weight: 600;
  margin-bottom: 5px;
  display: block;
}

Структура плагина

woocomerce-attribute/
├── vpwc-attributes-display.php  # Главный файл плагина
├── includes/                    # Основные классы
│   ├── class-vpwc-attributes.php           # Главный класс
│   └── class-vpwc-attributes-settings.php  # Функции настроек
├── admin/                      # Админ-панель
│   └── class-vpwc-attributes-admin.php    # Интерфейс админки
├── public/                     # Фронтенд
│   └── class-vpwc-attributes-public.php   # Вывод атрибутов
└── languages/                  # Переводы
    └── vpwc-attributes-ru_RU.po

Безопасность

Плагин следует стандартам безопасности WordPress:

  • ✅ Проверка прав доступа через current_user_can()
  • ✅ Проверка nonce для всех форм
  • ✅ Санитизация данных через sanitize_text_field(), sanitize_textarea_field()
  • ✅ Экранирование вывода через esc_html(), esc_attr(), esc_url()
  • ✅ Валидация данных
  • ✅ Защита от SQL Injection через $wpdb->prepare()

Совместимость

Плагин протестирован с:

  • WordPress: 5.0, 5.5, 5.9, 6.0, 6.1, 6.2, 6.3, 6.4
  • PHP: 7.4, 8.0, 8.1, 8.2, 8.3, 8.4
  • WooCommerce: 5.0+, 6.0+, 7.0+, 8.0+

Код соответствует WordPress Coding Standards (WPCS) и совместим с PHP 8.2+.


Итоги

VPWC Attribute Display Settings — это простой и гибкий плагин для управления выводом атрибутов WooCommerce. Он решает типичные задачи:

  • ✅ Контроль количества атрибутов
  • ✅ Выбор атрибутов для разных страниц
  • ✅ Управление порядком вывода
  • ✅ Кастомные лейблы и единицы измерения
  • ✅ Фильтры по атрибутам
  • ✅ Программный API для интеграции

Всё настраивается через админ-панель, без правок кода темы. Если нужна кастомизация — есть фильтры и функции для программного доступа.


Примечание: Плагин требует установленного и активированного WooCommerce для работы.

0 просмотров

Комментарии

Загрузка комментариев...
Пока нет комментариев. Будьте первым!