Все о разработке на WordPress от азов до профессиональных приемов

WP-Dev

Рубрики

Табличный вид товаров Woocommerce

Автор: Категория: Плагины Дата:

Не секрет, что на данный момент подавляющее большинство тем WordPress можно использовать вместе с замечательным плагином WooCommerce, который с легкостью дополняет ваш сайт полноценным интернет-магазином. Причем многие темы предлагают свои варианты вывода товаров, цветовое оформление и т.д.

Но однажды я столкнулся с проблемой: мне понадобилось вывести очень много товаров без фотографий и с различными таксономиями (типом товара, производителем, совместимостью и т.д.). Я решил, что лучший вариант — сделать отображение товара в табличном виде.

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

Все распишу по пунктам, чтобы было интуитивно понятно.

  1.  Убедитесь, что вы установили и активировали плагин WooCommerce на вашем сайте. После этого подключитесь через ftp-соединение или файловый менеджер к сайту. Зайдите в папку с используемой темой.
  2. Создайте папку с именем «woocommerce» в корне темы (возможно, она уже есть) и скопируйте в нее файл «content-product», который находится по пути «wp-content/plugins/woocommerce/templates/». Это делается для того, чтобы при обновлении плагина ваши изменения сохранились.
  3. Откройте для редактирования файл «function.php», который находится в корневом каталоге темы. В конце файла дописываем:
  4.  Теперь открываем ранее скопированный файл «content-product» и после строки

    вставляем

    Весь ниже идущий код нужно удалить (или закомментировать).

В итоге мы получаем красивую таблицу товаров с нужными нам полями, которые можем менять по своему усмотрению. Так же можно использовать классы «product_table» для изменения стиля отображения (а еще можно для каждого элемента изменить класс и сделать его уникальным).

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *