Intereting Posts
Поиск крюка, который срабатывает при удалении сообщения, чтобы получить все комментарии dynamic_sidebar, не отображающий боковую панель Смещение WP_query, похоже, подсчитывает нагрузку на пост-AJAX больше Как редактировать / удалять элементы одной строки в таблице на моей странице меню Как сортировать по пользовательскому значению поля? кто-нибудь может помочь мне узнать, что происходит не так? Заголовок и почтовый URL на основе пользовательских полей? <? php wp_list_comments (); ?> возможно ли получить полный код на странице comments.php Заказ пользовательского типа сообщений несколькими настраиваемыми полями Фильтрация сообщений по уже зарегистрированной таксономии Фильтрация исходящих пользовательских данных поля Как я могу показывать последние сообщения из той же таксономии, что и просматриваемая публикация? $ wpdb возвращает старые столбцы? Вы можете его сбросить? Клиент использует Softaculous для обновления версий WordPress. Как я могу перейти с панели инструментов WordPress? Как удалить «Нажмите здесь, чтобы отменить ответ» Ссылка из формы комментария WordPress

Как настроить wp_list_categories

У меня есть список категорий в woo-commerce, которые я пытаюсь настроить для отображения, чтобы выглядеть следующим образом.

Список категорий

Я создал вышеупомянутое изображение, используя обычные HTML и CSS, но теперь я хотел бы преобразовать его в WordPress, чтобы он был динамически создан.

Вот HTML:

<div class="col tertiary" id="filters"> <ul class="product-categories"> <li id="pattern_garment_type"> <h5>Women</h5> <ul> <li class="selected"> <a href="#">All</a> </li> <li class=""> <a href="#">Accessories</a> </li> <li class=""> <a href="#">Blouses</a> </li> .etc... </ul> </li> <li id="pattern_garment_type"> <h5>Men</h5> <ul> <li class="selected"> <a href="#">All</a> </li> <li class=""> <a href="#">Accessories</a> </li> <li class=""> <a href="#">Coats</a> </li> ..etc.. </ul> </li> <li id="pattern_garment_type"> <h5>Kids</h5> <ul> <li class="selected"> <a href="#">All</a> </li> <li class=""> <a href="#">Babies</a> </li> <li class=""> <a href="#">Girls</a> </li> <li class=""> <a href="#">Boys</a> </li> </ul> </li> </ul> </div> 

Вот текущий код WordPress, с которым я работаю (не уверен, что я должен использовать walker для настройки вывода, который будет сгенерирован, как и HTML выше):

  <div id="content-filters" class="two columns"> <?php $args = array( 'style' => 'list', 'show_count' => 0, 'use_desc_for_title' => 1, 'child_of' => 0, 'title_li' => __( '' ), 'show_option_none' => __('No Menu Items'), 'number' => null, 'echo' => 1, 'depth' => 2, 'taxonomy' => 'product_cat', ); ?> <div class="col tertiary" id="filters"> <ul class="product-categories"> <?php wp_list_categories( $args ); ?> </ul> </div> 

1) Как я могу использовать фильтр wp_list_categories, чтобы добавить ссылку «Все» в верхней части подкатегорий, которая ссылается на страницу, на которой отображаются все элементы.

2) Как я могу также использовать фильтр wp_list_categories, чтобы удалить ссылку из родительской родительской категории и перенести ее в a, чтобы сделать ее полужирным (как в примере изображения)?

Любая помощь будет оценена

Solutions Collecting From Web of "Как настроить wp_list_categories"

Даже если фильтр wp_list_categories существует, он передает (и поэтому вам нужно вернуть) разметку html, сгенерированную wp_list_categories() . Это означает, что если вы хотите использовать этот фильтр, вам нужно изменить DOM с php, и даже если это возможно (мы надеемся, используя внешние php-библиотеки), убедитесь, что это не лучшее решение для ваших нужд. Alternartive – это использование js для изменения html после его создания. Это возможность, но я разработчик WP, а не js, поэтому я дам вам решение Worpress.

Вы должны создать собственный класс Walker класса, а затем использовать его в пользовательской версии wp_list_categories ();

Давайте начнем.

Прежде всего, пользовательский класс категории Walker (поместите его в functions.php ):

 class My_Category_Walker extends Walker_Category { var $lev = -1; var $skip = 0; static $current_parent; function start_lvl( &$output, $depth = 0, $args = array() ) { $this->lev = 0; $output .= "<ul>" . PHP_EOL; } function end_lvl( &$output, $depth = 0, $args = array() ) { $output .= "</ul>" . PHP_EOL; $this->lev = -1; } function start_el( &$output, $category, $depth = 0, $args = array(), $id = 0 ) { extract($args); $cat_name = esc_attr( $category->name ); $class_current = $current_class ? $current_class . ' ' : 'current '; if ( ! empty($current_category) ) { $_current_category = get_term( $current_category, $category->taxonomy ); if ( $category->term_id == $current_category ) $class = $class_current; elseif ( $category->term_id == $_current_category->parent ) $class = rtrim($class_current) . '-parent '; } else { $class = ''; } if ( ! $category->parent ) { if ( ! get_term_children( $category->term_id, $category->taxonomy ) ) { $this->skip = 1; } else { if ($class == $class_current) self::$current_parent = $category->term_id; $output .= "<li class='" . $class . $level_class . "'>" . PHP_EOL; $output .= sprintf($parent_title_format, $cat_name) . PHP_EOL; } } else { if ( $this->lev == 0 && $category->parent) { $link = get_term_link(intval($category->parent) , $category->taxonomy); $stored_parent = intval(self::$current_parent); $now_parent = intval($category->parent); $all_class = ($stored_parent > 0 && ( $stored_parent === $now_parent) ) ? $class_current . ' all' : 'all'; $output .= "<li class='" . $all_class . "'><a href='" . $link . "'>" . __('All') . "</a></li>\n"; self::$current_parent = null; } $link = '<a href="' . esc_url( get_term_link($category) ) . '" >' . $cat_name . '</a>'; $output .= "<li"; $class .= $category->taxonomy . '-item ' . $category->taxonomy . '-item-' . $category->term_id; $output .= ' class="' . $class . '"'; $output .= ">" . $link; } } function end_el( &$output, $page, $depth = 0, $args = array() ) { $this->lev++; if ( $this->skip == 1 ) { $this->skip = 0; return; } $output .= "</li>" . PHP_EOL; } } 

Он расширяет WP Walker_Category и перезаписывает все 4 метода чем-то, что соответствует вашим потребностям.

После этого в functions.php добавьте настраиваемую функцию:

 function custom_list_categories( $args = '' ) { $defaults = array( 'taxonomy' => 'category', 'show_option_none' => '', 'echo' => 1, 'depth' => 2, 'wrap_class' => '', 'level_class' => '', 'parent_title_format' => '%s', 'current_class' => 'current' ); $r = wp_parse_args( $args, $defaults ); if ( ! isset( $r['wrap_class'] ) ) $r['wrap_class'] = ( 'category' == $r['taxonomy'] ) ? 'categories' : $r['taxonomy']; extract( $r ); if ( ! taxonomy_exists($taxonomy) ) return false; $categories = get_categories( $r ); $output = "<ul class='" . esc_attr( $wrap_class ) . "'>" . PHP_EOL; if ( empty( $categories ) ) { if ( ! empty( $show_option_none ) ) $output .= "<li>" . $show_option_none . "</li>" . PHP_EOL; } else { if ( is_category() || is_tax() || is_tag() ) { $current_term_object = get_queried_object(); if ( $r['taxonomy'] == $current_term_object->taxonomy ) $r['current_category'] = get_queried_object_id(); } $depth = $r['depth']; $walker = new My_Category_Walker; $output .= $walker->walk($categories, $depth, $r); } $output .= "</ul>" . PHP_EOL; if ( $echo ) echo $output; else return $output; } 

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

 <div id="content-filters" class="two columns"> <div class="col tertiary" id="filters"> <?php $args = array( 'taxonomy' => 'product_cat', 'show_option_none' => __('No Menu Items.'), 'echo' => 1, 'depth' => 2, 'wrap_class' => 'product-categories', 'level_class' => 'pattern_garment_type', 'parent_title_format' => '<h5>%s</h5>', 'current_class' => 'selected' ); custom_list_categories( $args ); ?> </div> </div> 

Настройте $ args, если хотите, я установил их в соответствии с вашим кодом ответа. Только я изменил 'pattern_garment_type' как класс, а не id, потому что вы не можете иметь один и тот же идентификатор тега несколько раз в html (как в вашей разметке).

Вот и все, надеюсь, это поможет.

Уденом

Я отвечу здесь на часть CSS вашего вопроса:

Используйте это, чтобы удалить пули списка:

 .ul.product-categories, ul.children{ list-style-type: none; } 

Используйте это, чтобы выделить только основные категории:

 li {font-weight:normal} // you need to set the default state first of the list ul.product-categories > li{font-weight:bold;} //then you can change the top level list without affecting its children 

Вот как вы нацеливаете эти элементы css без необходимости писать свои собственные классы.

Вы также можете добавить это в свои аргументы wp_list_categories

 'hide_empty' => 0 

Показать все категории, даже те, у кого нет сообщения.

Существует два подхода к второй части вашего вопроса (добавление ссылки ALL и удаление ссылки из основных категорий)

  1. Вы можете использовать Javascript / jquery для удаления / добавления того, что вы хотите, как только страница загрузится
  2. Вы можете написать фильтр wp_list_categories, чтобы внести эти изменения

Вариант 2 – это чистый способ сделать это. Вариант 1 – самый быстрый способ сделать это.

Я тоже не попал, из-за нехватки времени. Но загляните в создание фильтров в wordpress.