Я запускаю сайт woocommerce и застрял. Ниже мой код в content-product_cat.php
файл
<?php
if ( ! defined( 'ABSPATH' ) ) {
exit;
}
?>
<li <?php wc_product_cat_class( 'col-xs-12 col-sm-6 col-md-3' ); ?>>
<?php
/**
* woocommerce_before_subcategory hook.
*
* @hooked woocommerce_template_loop_category_link_open - 10
*/
do_action( 'woocommerce_before_subcategory', $category );
/**
* woocommerce_before_subcategory_title hook.
*
* @hooked woocommerce_subcategory_thumbnail - 10
*/
do_action( 'woocommerce_before_subcategory_title', $category );
/**
* woocommerce_shop_loop_subcategory_title hook.
*
* @hooked woocommerce_template_loop_category_title - 10
*/
do_action( 'woocommerce_shop_loop_subcategory_title', $category );
/**
* woocommerce_after_subcategory_title hook.
*/
do_action( 'woocommerce_after_subcategory_title', $category );
/**
* woocommerce_after_subcategory hook.
*
* @hooked woocommerce_template_loop_category_link_close - 10
*/
do_action( 'woocommerce_after_subcategory', $category ); ?>
</li>
Это выводит как это:
<ul class="products">
<li class="col-xs-12 col-sm-6 col-md-3 product-category product first"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li>
<li class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li>
<li class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li>
<li class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li><li class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li><li class="col-xs-12 col-sm-6 col-md-3 product-category product last"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li>
...
<li class="col-xs-12 col-sm-6 col-md-3 product-category product first"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></li>
</ul>
Проблема в том, что если изображения не одного размера, укладка прерывается. Мне нужно иметь возможность обернуть его в этот вывод:
<div class="products row">
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
</div>
<div class="products row">
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
</div>
...
<div class="products row">
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
<div class="col-xs-12 col-sm-6 col-md-3 product-category product"><a href="#"><img src="#"><h3>Category title <mark class="count">(1)</mark></h3></a></div>
</div>
Кто-нибудь может указать мне правильное направление? Если бы вы могли помочь мне написать код для меня, я буду очень благодарен. Я знаю, что лучше учиться, чем заставлять кого-то делать это, но у меня буквально есть масса вещей, которые можно сделать на этом сайте. Мне нужно двигаться быстро.
Бесконечно благодарен
Задача ещё не решена.
Других решений пока нет …