Данный код выводит подкатегории заданого id категории на всех страницах категориях — пример использование как фильтр, для активной подкатегории добавляется class=»disabled» -не активный и становится светлым на 25%
Подкатегория выводится как её изображение с размером в 60px
На странице /ваша_тема/woocommerce/archive-product.php
Сразу после <?php get_header();?>
Вставляем код:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
<?php global $wp_query; $cate = get_queried_object(); $cateID = $cate->term_id;?> <ul class="wsubcategs"> <?php $wsubargs = array( 'hierarchical' => 1, 'show_option_none' => '', 'hide_empty' => 0, 'parent' => 9, 'taxonomy' => 'product_cat' ); $wsubcats = get_categories($wsubargs); foreach ($wsubcats as $wsc){ $thumbnail_id = get_woocommerce_term_meta( $wsc->term_id, 'thumbnail_id', true ); $image = wp_get_attachment_url($thumbnail_id); $cat_arguments = array( 'orderby' => 'name', 'parent' => 0 ); $cats = get_woocommerce_term_meta( $wsc->term_id, 'thumbnail_id', true ); if($cateID != $wsc->term_id) { ?> <li class="subss"> <a href="<?php echo get_term_link( $wsc->slug, $wsc->taxonomy );?>"> <?php echo '<img src="'.$image.'" alt="category image" style="width:60px;">'; ?> </a> </li> <?php } else { ?> <li class="subss kl"> <a class="disabled"> <?php echo '<img src="'.$image.'" alt="category image" style="width:60px;">'; ?> </a> </li> <?php } } ?> </ul> <? ?> |
class=»disabled» — добавляем в конце файла style.css
class=»kl» для li нужен для осветления фотографии , остальные классы для добавляем сами для вывода необходимого расположения, как выравнивание по левой стороне ( в ряд ) или ещё как.
|
1 2 3 4 5 6 7 8 |
a.disabled { pointer-events: none; /* делаем элемент неактивным для взаимодействия */ cursor: default; /* курсор в виде стрелки */ color: #888;/* цвет текста серый */ } .kl { opacity:.25; } |
Post a comment