Woocommerce товары таблицей или как изменить шаблон категории товаров

04.07.2017БлогDjo

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

В первую очередь, что бы править шаблоны вывода, не забудьте из папки плагина Woocommerce/templates скопировать необходимые для редактирования файлы в папку «ваша тема»/woocommerce/. Если папки «woocommerce» в папке с вашей темой нет, тогда создайте её. Все файлы переносить не нужно, берите только те что вы будете править, если не знаете какой файл за что отвечает, перенесите все — потом методом «нучного тыка» определите ваш, а остальные — удалите.

Итак как же изменить вывод товаров в категории от привычного что есть в шаблонах Woo.

Например — на «Тостере» советуют:

Начальные тэг таблиц:

<table class="shop_table cart" cellspacing="0"> <thead> <tr> <th class="product-name"><?php _e( 'Product', 'woocommerce' ); ?></th> <th class="product-price"><?php _e( 'Price', 'woocommerce' ); ?></th> <th class="product-price"></th> </tr> </thead> <tbody>

1
2
3
4
5
6
7
8
9
10

<table class="shop_table cart" cellspacing="0">
  <thead>
    <tr>
      <th class="product-name"><?php _e( 'Product', 'woocommerce' ); ?></th>
      <th class="product-price"><?php _e( 'Price', 'woocommerce' ); ?></th>
      <th class="product-price"></th>
    </tr>
  </thead>

   <tbody>

был помещен в другой файл в этом шаблоне — loop/loop-start.php.
Ну и соответственно конечный тэг таблицы был помещен в loop/loop-end.php.

А сам код вывода данных таблицы помещают в «content-product.php»

А ресурс «ИглуЧит» советует в файле шаблона function.php прописать следующий код:

<?php /* Изменяем отображение товара в табличный вид  */
add_action('woocommerce_before_shop_loop', 'table_loop_head',40);
function table_loop_head( ) {
?>
<table class="loop_table loop" cellspacing="0">
/* Вывод заголовков таблицы. Можно добавлять/менять/удалять строки. */
    <thead>
        <tr>
            <th class="product_table"><?php _e( 'Товар', 'woocommerce' ); ?></th> 
            <th class="product_table"><?php _e( 'Категория', 'woocommerce' ); ?></th>
            <th class="product_table"><?php _e( 'Тип', 'woocommerce' ); ?></th>
            <th class="product_table"><?php _e( 'Производитель', 'woocommerce' ); ?></th>
            <th class="product_table"><?php _e( 'Цена', 'woocommerce' ); ?></th>
            <th class="product-table">&nbsp;</th>
        </tr>
    </thead>
    <tbody>
<?php
}
add_action('woocommerce_after_shop_loop', 'table_loop_closetag',9);
function table_loop_closetag( ) {
?>
</tbody></table>
<?php
} ?>

<?php /* Изменяем отображение товара в табличный вид */

add_action('woocommerce_before_shop_loop', 'table_loop_head',40);

function table_loop_head( ) {

/* Вывод заголовков таблицы. Можно добавлять/менять/удалять строки. */

<thead>

<tr>

</tr>

</thead>

<tbody>

<?php

}

add_action('woocommerce_after_shop_loop', 'table_loop_closetag',9);

function table_loop_closetag( ) {

</tbody></table>

<?php

} ?>

и в файле content-product.php после строки

<?php do_action( 'woocommerce_before_shop_loop_item' ); ?>

1	<?php do_action( 'woocommerce_before_shop_loop_item' ); ?>

вставить

/* Здесь мы меняем вывод информации о товаре в табличный вид, согласно заголовкам, записанным в function.php */
<tr>
        <td class="product_table"><a href="<?php the_permalink() ?>" ><?php the_title(); ?></a></td> // Наименование
       
        <td class="product_table"><?php echo ($product->get_attribute( 'cat' )); ?></td>  // Категория
       
        <td class="product_table"><?php echo ($product->get_attribute( 'type' )); ?></td>  // Тип товара
       
        <td class="product_table"><?php echo ($product->get_attribute( 'vendor' )); ?></td>  // Производитель
       
        <td class="product_table"><?php do_action( 'woocommerce_after_shop_loop_item_title' ); ?></td> // Цена
       
        <td class="product-table"><?php do_action( 'woocommerce_after_shop_loop_item' ); ?></td> // Кнопка "Добавить в корзину"
      </tr>

/* Здесь мы меняем вывод информации о товаре в табличный вид, согласно заголовкам, записанным в function.php */

<tr>

<td class="product_table"><a href="<?php the_permalink() ?>" ><?php the_title(); ?></a></td> // Наименование

<td class="product_table"><?php echo ($product->get_attribute( 'cat' )); ?></td> // Категория

<td class="product_table"><?php echo ($product->get_attribute( 'type' )); ?></td> // Тип товара

<td class="product_table"><?php echo ($product->get_attribute( 'vendor' )); ?></td> // Производитель

<td class="product_table"><?php do_action( 'woocommerce_after_shop_loop_item_title' ); ?></td> // Цена

<td class="product-table"><?php do_action( 'woocommerce_after_shop_loop_item' ); ?></td> // Кнопка "Добавить в корзину"

</tr>

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

Итак, еще одно решение от Zixn.ru(т.е от нас)

Подготовка

Скопируйте файл из «/wp-content/plugins/woocommerce/templates/content-product.php» в «/Ваш_Шаблон/woocommerce/content-product.php»

Создайте файл «/Ваш_Шаблон/woocommerce/content-tables.php» и скопируйте в него следующий код:

<?php
/**
 * Шаблон табличного отображения товаров в категории
 */
if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}

global $product;

// Ensure visibility
if (empty($product) || !$product->is_visible()) {
    return;
}
if (stripos(woocommerce_get_product_thumbnail(), 'placeholder.png') !== FALSE) {
    $styleImage = 'product-table-image-no';
} else {
    $styleImage = 'product-table-image';
}
?>
<tr class="productDescription">
    <td class="<?php echo $styleImage; ?>"><?php echo woocommerce_get_product_thumbnail(); ?></td>
    <td class="product-table-title"><a href="<?php the_permalink() ?>" ><?php the_title(); ?></a></td> 
<!--    <td class="product-table-manufactur"><?php echo ($product->get_attribute('manufacture')); ?></td> -->
    <td class="product-table-price"><?php do_action('woocommerce_after_shop_loop_item_title'); ?></td> 
    <td class="product-table-button"><?php do_action('woocommerce_after_shop_loop_item'); ?></td> 
</tr>

<?php

/**

* Шаблон табличного отображения товаров в категории

if (!defined('ABSPATH')) {

exit; // Exit if accessed directly

}

global $product;

// Ensure visibility

if (empty($product) || !$product->is_visible()) {

return;

}

if (stripos(woocommerce_get_product_thumbnail(), 'placeholder.png') !== FALSE) {

$styleImage = 'product-table-image-no';

} else {

$styleImage = 'product-table-image';

}

</tr>

3. Создайте файл(но только если у вас его еще там нет) «/Ваш_Шаблон/woocommerce/archive-product.php». Это стандартный файл шаблона Woocommerce, если вы уже его кастомизировали, то рекомендую найти разницу в коде и взять то что вам нужно. Код для этого файла следующий:

<?php
/**
 * The Template for displaying product archives, including the main shop page which is a post type archive
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.
 *
 * HOWEVER, on occasion WooCommerce will need to update template files and you
 * (the theme developer) will need to copy the new files to your theme to
 * maintain compatibility. We try to do this as little as possible, but it does
 * happen. When this occurs the version of the template file will be bumped and
 * the readme will list any important changes.
 *
 * @see 	    https://docs.woocommerce.com/document/template-structure/
 * @author 		WooThemes
 * @package 	WooCommerce/Templates
 * @version     2.0.0
 */
if (!defined('ABSPATH')) {
    exit; // Exit if accessed directly
}

get_header('shop');
?>

<?php
/**
 * woocommerce_before_main_content hook.
 *
 * @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)
 * @hooked woocommerce_breadcrumb - 20
 */
do_action('woocommerce_before_main_content');
?>

<?php if (apply_filters('woocommerce_show_page_title', true)) : ?>

    <h1 class="page-title"><?php woocommerce_page_title(); ?></h1>

<?php endif; ?>

<?php
/**
 * woocommerce_archive_description hook.
 *
 * @hooked woocommerce_taxonomy_archive_description - 10
 * @hooked woocommerce_product_archive_description - 10
 */
do_action('woocommerce_archive_description');
?>



<?php if (have_posts()) : ?>

    <?php
    /**
     * woocommerce_before_shop_loop hook.
     *
     * @hooked woocommerce_result_count - 20
     * @hooked woocommerce_catalog_ordering - 30
     */
    do_action('woocommerce_before_shop_loop');
    ?>
    <div class="templateBlockSelector">
        <a href="<?php echo add_query_arg(array('cat_templete' => 'list')); ?>"><i class="fa fa-list fa-2x" aria-hidden="true"></i></a>
        <a href="<?php echo add_query_arg(array('cat_templete' => 'table')); ?>"><i class="fa fa-table fa-2x" aria-hidden="true"></i></a>
    </div>
    <?php woocommerce_product_loop_start(); ?>

    <?php woocommerce_product_subcategories(); ?>

    <?php
    global $VIEW_TEMPLATE;
    ?>
    <?php if ($VIEW_TEMPLATE == 'table') { ?>
        <?php while (have_posts()) : the_post(); ?>
            <?php wc_get_template_part('content', 'product'); ?>
        <?php endwhile; // end of the loop. ?>
    <?php } else { ?>
        <table class="productTemplateTables">
            <?php while (have_posts()) : the_post(); ?>
                <?php wc_get_template_part('content', 'tables'); ?>
            <?php endwhile; // end of the loop. ?>
        </table>
    <?php } ?>

    <?php woocommerce_product_loop_end(); ?>

    <?php
    /**
     * woocommerce_after_shop_loop hook.
     *
     * @hooked woocommerce_pagination - 10
     */
    remove_action('woocommerce_after_shop_loop', 'woocommerce_pagination', 10);
    do_action('woocommerce_after_shop_loop');
    ?>

<?php elseif (!woocommerce_product_subcategories(array('before' => woocommerce_product_loop_start(false), 'after' => woocommerce_product_loop_end(false)))) : ?>

    <?php wc_get_template('loop/no-products-found.php'); ?>

<?php endif; ?>

<?php
/**
 * woocommerce_after_main_content hook.
 *
 * @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)
 */
do_action('woocommerce_after_main_content');
?>

<?php
/**
 * woocommerce_sidebar hook.
 *
 * @hooked woocommerce_get_sidebar - 10
 */
do_action('woocommerce_sidebar');
?>

<?php get_footer('shop'); ?>

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

<?php

/**

* The Template for displaying product archives, including the main shop page which is a post type archive

* This template can be overridden by copying it to yourtheme/woocommerce/archive-product.php.

* HOWEVER, on occasion WooCommerce will need to update template files and you

* (the theme developer) will need to copy the new files to your theme to

* maintain compatibility. We try to do this as little as possible, but it does

* happen. When this occurs the version of the template file will be bumped and

* the readme will list any important changes.

* @see https://docs.woocommerce.com/document/template-structure/

* @author WooThemes

* @package WooCommerce/Templates

* @version 2.0.0

if (!defined('ABSPATH')) {

exit; // Exit if accessed directly

}

get_header('shop');

<?php

/**

* woocommerce_before_main_content hook.

* @hooked woocommerce_output_content_wrapper - 10 (outputs opening divs for the content)

* @hooked woocommerce_breadcrumb - 20

do_action('woocommerce_before_main_content');

<?php if (apply_filters('woocommerce_show_page_title', true)) : ?>

<?php endif; ?>

<?php

/**

* woocommerce_archive_description hook.

* @hooked woocommerce_taxonomy_archive_description - 10

* @hooked woocommerce_product_archive_description - 10

do_action('woocommerce_archive_description');

<?php if (have_posts()) : ?>

<?php

/**

* woocommerce_before_shop_loop hook.

* @hooked woocommerce_result_count - 20

* @hooked woocommerce_catalog_ordering - 30

do_action('woocommerce_before_shop_loop');

<a href="<?php echo add_query_arg(array('cat_templete' => 'table')); ?>"><i class="fa fa-table fa-2x" aria-hidden="true"></i></a>

</div>

<?php woocommerce_product_loop_start(); ?>

<?php woocommerce_product_subcategories(); ?>

<?php

global $VIEW_TEMPLATE;

<?php if ($VIEW_TEMPLATE == 'table') { ?>

<?php while (have_posts()) : the_post(); ?>

<?php wc_get_template_part('content', 'product'); ?>

<?php endwhile; // end of the loop. ?>

<?php } else { ?>

<?php while (have_posts()) : the_post(); ?>

<?php wc_get_template_part('content', 'tables'); ?>

<?php endwhile; // end of the loop. ?>

</table>

<?php } ?>

<?php woocommerce_product_loop_end(); ?>

<?php

/**

* woocommerce_after_shop_loop hook.

* @hooked woocommerce_pagination - 10

remove_action('woocommerce_after_shop_loop', 'woocommerce_pagination', 10);

do_action('woocommerce_after_shop_loop');

<?php elseif (!woocommerce_product_subcategories(array('before' => woocommerce_product_loop_start(false), 'after' => woocommerce_product_loop_end(false)))) : ?>

<?php wc_get_template('loop/no-products-found.php'); ?>

<?php endif; ?>

<?php

/**

* woocommerce_after_main_content hook.

* @hooked woocommerce_output_content_wrapper_end - 10 (outputs closing divs for the content)

do_action('woocommerce_after_main_content');

<?php

/**

* woocommerce_sidebar hook.

* @hooked woocommerce_get_sidebar - 10

do_action('woocommerce_sidebar');

<?php get_footer('shop'); ?>

Всё, почва для шаблона готова и теперь маленький штрих для того что бы можно было выбрать между стандартным шаблоном и вашим.

Заходим в файл «»/Ваш_Шаблон/functions.php» и дописывам хук + функцию

add_action('woocommerce_before_shop_loop', 'setTempleteCategory');

/**
 * Устанавливает режим просмотра категорий товаров
 * @global type $VIEW_TEMPLATE
 */
function setTempleteCategory() {
    global $VIEW_TEMPLATE;

    if (isset($_REQUEST['cat_templete'])) {
        if ($_REQUEST['cat_templete'] == 'list') {
            $VIEW_TEMPLATE = 'list';
            setcookie("view_template_product", "", time() - 3600);
            setcookie('view_template_product', 'list', time() + 60 * 60 * 24 * 30);
        } elseif ($_REQUEST['cat_templete'] == 'table') {
            $VIEW_TEMPLATE = 'table';
            setcookie("view_template_product", "", time() - 3600);
            setcookie('view_template_product', 'table', time() + 60 * 60 * 24 * 30);
        } else {
            $VIEW_TEMPLATE = 'table';
        }
    } else {
        if (isset($_COOKIE['view_template_product'])) {
            if ($_COOKIE['view_template_product'] == 'list') {
                $VIEW_TEMPLATE = 'list';
            } elseif ($_COOKIE['view_template_product'] == 'table') {
                $VIEW_TEMPLATE = 'table';
            }
        } else {
            $VIEW_TEMPLATE = 'table';
        }
    }
}

add_action('woocommerce_before_shop_loop', 'setTempleteCategory');

/**

* Устанавливает режим просмотра категорий товаров

* @global type $VIEW_TEMPLATE

function setTempleteCategory() {

global $VIEW_TEMPLATE;

if (isset($_REQUEST['cat_templete'])) {

if ($_REQUEST['cat_templete'] == 'list') {

$VIEW_TEMPLATE = 'list';

setcookie("view_template_product", "", time() - 3600);

setcookie('view_template_product', 'list', time() + 60 * 60 * 24 * 30);

} elseif ($_REQUEST['cat_templete'] == 'table') {

$VIEW_TEMPLATE = 'table';

setcookie("view_template_product", "", time() - 3600);

setcookie('view_template_product', 'table', time() + 60 * 60 * 24 * 30);

} else {

$VIEW_TEMPLATE = 'table';

}

} else {

if (isset($_COOKIE['view_template_product'])) {

if ($_COOKIE['view_template_product'] == 'list') {

$VIEW_TEMPLATE = 'list';

} elseif ($_COOKIE['view_template_product'] == 'table') {

$VIEW_TEMPLATE = 'table';

}

} else {

$VIEW_TEMPLATE = 'table';

}

Немного поясню: В файле «/Ваш_Шаблон/woocommerce/archive-product.php» при помощи глобальной переменной «VIEW_TEMPLATE» и условия «IF» проиcходит определение того, какой файл шаблона подключить(табличный или стандартный). Так же данный файл дополнен блоком

    <div class="templateBlockSelector">
        <a href="<?php echo add_query_arg(array('cat_templete' => 'list')); ?>"><i class="fa fa-list fa-2x" aria-hidden="true"></i></a>
        <a href="<?php echo add_query_arg(array('cat_templete' => 'table')); ?>"><i class="fa fa-table fa-2x" aria-hidden="true"></i></a>
    </div>

<a href="<?php echo add_query_arg(array('cat_templete' => 'table')); ?>"><i class="fa fa-table fa-2x" aria-hidden="true"></i></a>

</div>

Для отображения двух «пиктограм» выбора шаблона.

Код который мы добавили в файл function.php следит за наличием GET переменных и устанавливает соответсвующее значение в глобальную переменную «VIEW_TEMPLATE», при этом значение записывается в куки — что бы выбранный шаблон отображался у пользователя всегда пока есть куки сайта.

Так же вам может понадобиться подключить дополнительные стили:

Для отображения «пиктограм» здесь используется библиотека «font awesome» — если вам не нужны эти значки, вы можете прописать свой стиль или оставить просто текст.

В любом случаем вам потребуется «допилить» стиль отображения под себя, не забывайте подключить дополнительный файл стилей для «комфортной» правки. Например свой файл стилей можно подключить через хук в файле function.php

add_action('wp_enqueue_scripts', 'jsThemeInclude');

function jsThemeInclude() {
      wp_enqueue_style('pruduct-customize', get_stylesheet_directory_uri() . '/css/product-table.css');
}

add_action('wp_enqueue_scripts', 'jsThemeInclude');

function jsThemeInclude() {

wp_enqueue_style('pruduct-customize', get_stylesheet_directory_uri() . '/css/product-table.css');

}

Если вы всё сделали верно для создания шаблона табличного вывода товаров в Woocommerce, то результат определённо вас порадует, ну а вот что получилось у нас:

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

upd: 11.2018

Важно, если ваш шаблон сайта содержит в корне файл «woocommerce.php» тогда любые изменения файла «/Ваш_Шаблон/woocommerce/archive-product.php» игнорируются и этот способ вам не поможет пока вы не модифицируете свой шаблон что бы он работал без файла «woocommerce.php»

О наличие этот файла в вашем шаблоне вам сообщит Woocommerce из админки сайта. Пример на скриншоте ниже:

33 thoughts on “Woocommerce товары таблицей или как изменить шаблон категории товаров”

Анатолий:

13.03.2018 в 8:45 пп

Спасибо, помогло.
А как по умолчанию сделать в табличном виде?
Спасибо.

Ответить
1. Djo:
  
  14.03.2018 в 9:52 пп
  
  Добрый день! В условиях «} else {
  $VIEW_TEMPLATE = ‘table’;
  }»
  Пропишите нужный вам шаблон — например «list»
  
  Ответить
Павел:

22.04.2018 в 9:34 пп

Подскажите пожалуйста, а можно как нибудь настроить стиль например для размера изображений, чтоб он подкачивал их не с основного файла Темы например: «themes/storefront/style.css» а «themes/storefront/woocommerce/style.css»
Очень хотелось бы для этой таблички отдельную тему сделать!
Спасибо вам большое полезная статья! 🙂

Ответить
1. Djo:
  
  24.04.2018 в 9:32 пп
  
  Здесь есть несколько путей. Если вы с кодом на «Вы», то можно установить плагина который позволяет писать стили css прям в админке сайта.
  Если вы с кодом на «Ты», тогда можно создать отдельный файл стилей и подключать его на отдельной странице через add_action.
  
  Ответить
Павел:

22.04.2018 в 11:03 пп

Еще хотелось бы понять как вывести вес товара например после имени! В заранее больше спасибо!!!

Ответить
1. Djo:
  
  24.04.2018 в 9:34 пп
  
  Всё зависит от того в каком поле у вас хранится вес. Но любые кастомные поля в WP в принципе можно выводить через функцию WP «get_post_meta()»
  
  Ответить
Павел:

24.04.2018 в 9:55 пп

Спасибо вам большое!

Ответить
Иван:

27.04.2018 в 9:59 дп

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

Ответить
1. Павел:
  
  30.04.2018 в 11:20 пп
  
  Да, полезно было бы! 🙂
  
  Ответить
Павел:

02.05.2018 в 4:35 пп

Вообще прикольная задумка, например на главной выходят не все товары, а только с одной категории, предположим распродажа! Djo подскажите пожалуйста как можно реализовать, я так понимаю надо В файле «/Ваш_Шаблон/woocommerce/archive-product.php что-то поменять ?

Ответить
1. Djo:
  
  04.05.2018 в 8:16 пп
  
  В этом случае создаёте файл шаблона для главной странице(по всем требованиям WordPress). Затем в админке сайта создаёте страницу с этим шаблоном и делайете в настройках её главной. Далее переходите в код данного шаблона и делаете в нём запрос на получение товаров с нужной категории. Подобным образом реализована главная этого сайта http://teplodiskont.ru/
  
  Ответить
dmtr32:

17.05.2018 в 6:14 пп

Добрый день , поставил всё по инструкции — https://жби.com/product-category/dorozhnoe-stroitelstvo/dorozhnaya-plita-s-nenapryagaemoj-armaturoj/
почему то не так работает ?*

Ответить
dmtr32:

17.05.2018 в 6:27 пп

https://жби.com/product-category/dorozhnoe-stroitelstvo/dorozhnaya-plita-s-nenapryagaemoj-armaturoj/
как сделать вывод таких полей как размер товара \ атрибут \ ну и других ? у меня только картинка и название выходит

Ответить
Егор:

06.08.2018 в 12:31 пп

Впервые оставляю комментарий на чьем-либо блоге. Не могу ни сказать спасибо. Только ваш способ оказался действенным и без всяких там ошибок и подводных камней. Все работает на ура.

Еще раз благодарю!

Ответить
RB:

21.09.2018 в 2:10 пп

Сделал всё по вашей инструкции, но чудо не произошло…
Пихтограммы не отобразились, попробовал установить значения $VIEW_TEMPLATE = ‘table’ или $VIEW_TEMPLATE = ‘list’ результат нулевой

Ответить
1. RB:
  
  21.09.2018 в 4:34 пп
  
  Если что тему использовал: https://wordpress.org/themes/istore/
  
  Ответить
  1. Djo:
    
    30.09.2018 в 7:50 пп
    
    Возможно вам не нужны вызовы некоторых функций, что бы всё заработало как надо.
    Например <td class="product-table-quantity"><?php custom_quantity_field_archive($product); ?></td>
    
    Ответить
kharin:

08.11.2018 в 10:34 дп

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

Ответить
Кирилл:

12.12.2018 в 12:39 дп

Добрый день,
а есть описание настройки шаблона страницы с категориями как на этом сайте http://teplodiskont.ru/ ?
нужно вывести так же Категории, с под категориями. Буду очень благодарен если покажите.

Ответить
Александр:

14.12.2018 в 3:08 пп

Здравствуйте. Спасибо большое за труды — действительно помогает сделать безопасный вывод товаров таблицей.
Но мне нужна еще более «глубокая переделка». Мне нужен такой же вывод категорий: чтобы в две колонки выводились: изображение категории (слева), заголовок категории (справа). И еще подкатегории должны быть не прямыми ссылками, а средством навигации по общей таблице товаров. А названия подкатегорий должны быть заголовками в таблице товаров.

Заголовок подкатегории 1
(Изображение 1) Товар 1 —————— Перейти
(Изображение 2) Товар 2 —————— Перейти
(Изображение 3) Товар 3 —————— Перейти
Заголовок подкатегории 2
(Изображение 4) Товар 4 —————— Перейти
(Изображение 5) Товар 5 —————— Перейти
(Изображение 6) Товар 6 —————— Перейти

И при нажатии на подкатегории (в сайдбаре слева) пользователя должно перенести в нужную часть общей таблицы товаров…
и так далее.
Скажите пожалуйста, можно ли внеся правки в Ваш код реализовать что-то подобное?

Ответить
DimitryM:

23.12.2018 в 3:51 пп

Возможно ли сделать переход к товару при нажатии на фотографию?

Ответить
Александр Демидов:

25.05.2019 в 10:49 дп

Добрый день!
Подскажите почему используете setcookie, а не wc_setcookie?
Плагин Query Monitor ругается на использование setcookie.
Заранее спасибо за ответ.

Ответить
VladChVV:

27.05.2019 в 12:09 пп

Добрый день. Спасибо, пригодилось. А можно ли зааяксить все это делао?

Ответить
Александр:

11.04.2020 в 9:25 пп

Добрый день. А как вставить шапку для таблицы товаров?

Ответить
Аблай:

08.07.2020 в 3:47 пп

Добрый день! у меня тема «STOREFRONT» уже залил на хостинг, хотелось бы сделать категорию товаров чтобы отображалось в табличном виде, кто может помочь более подробнее рассказать или помочь:)

Ответить
Дмитрий:

05.08.2020 в 10:15 дп

Спасибо! Невероятно полезно.
Единственное, в «list» у вас вырезается пагинация

Ответить
Никита:

10.12.2020 в 4:47 пп

Всё супер! Жаль только не переключается(не работает кнопка) в стандартный вид… Только табличка при нажатии на любой из значков

Ответить
1. Никита:
  
  10.12.2020 в 11:15 пп
  
  А ещё пропал выбор страниц внизу. То есть отображается 50 товаров из 9210 на 1 странице, на 2 никак не переключить пользователю.
  
  Ответить
  1. Никита:
    
    10.12.2020 в 11:16 пп
    
    Хотя на вашем скрине страницы есть и всё ок. Я уже несколько раз все отменял, загружал копию и повторял все действия по порядку. Нигде не ошибся. До этих изменений страницы есть, после нет….. Печально, учитывая что я не понимаю что делаю))))
    
    Ответить
Дмитрий:

24.07.2021 в 11:49 пп

Здравствуйте,. когда переключаю вид магазина с таблицы на плитку или на оборот, возникает вот такая ошибка:
Warning: Cannot modify header information — headers already sent by (output started at….

Ответить
Дмитрий:

24.07.2021 в 11:51 пп

Warning: Cannot modify header information — headers already sent by (output started at C:\Server\domains\shop.ru\wp-content\themes\storefront\header.php:9) in C:\Server\domains\shop.ru\wp-content\themes\storefront\functions.php on line 82

Warning: Cannot modify header information — headers already sent by (output started at C:\Server\domains\shop.ru\wp-content\themes\storefront\header.php:9) in C:\Server\domains\shop.ru\wp-content\themes\storefront\functions.php on line 83

вроде как ругается на куки..

Ответить
Дмитрий:

03.08.2021 в 4:35 дп

Здравствуйте. А как прикрутить плагин быстрого просмотра товара в табличном виде? при стандартном отображении товаров в категории, быстрый просмотр товара работает, а при табличном виде не срабатывает. Подскажите решение, кто сталкивался с данной проблемой. Спасибо.

Ответить
Татьяна:

03.09.2021 в 3:21 дп

Спасибо большое за статью, очень помогла!!!! Подскажите пожалуйста, как можно сделать что бы вместо кнопки добавить в корзину была кнопка подробнее и при ее нажатии человек попадал не в корзину, а на карточку товара

Ответить

Web разработка и оптимизация

Woocommerce товары таблицей или как изменить шаблон категории товаров

33 thoughts on “Woocommerce товары таблицей или как изменить шаблон категории товаров”

Добавить комментарий для Djo Отменить ответ