How to display Woocommerce products in Swiper slider?

Question

WooCommerce

I need to display new products using Swiper Slider. Usually products are displayed using a shortcode, but what about Swiper? To initialize the slider, it needs to prescribe classes, and when displaying products with a shortcode, Woocommerce wraps them in its tags and gives its classes.

<div class="swiper">
   <div class="swiper-wrapper">
   <?php
      echo do_shortcode('[products limit=4" order=""DESC]');
   ?>
   </div>
</div>

And here is the content of content-product:

<div class="swiper-slide slide">
  <div class="slide__img-wrapper">
    <a href="<?= $product->get_permalink(); ?>">
      <?php
      echo $product->get_image('full');
      ?>
    </a>
  </div>
  <div class="slide__info">
    <p class="slide__price">
      <span>
        <?php woocommerce_template_loop_price(); ?>
      </span>
    </p>
    <p class="slide__desc">
      <a href="<?= $product->get_permalink(); ?>">
        <p><?= $product->get_name() ?></p>
      </a>
    </p>
  </div>
  <a href="<?= $product->get_permalink(); ?>" class="btn slide__btn">Подробнее</a>
</div>

Answer 1

Something like this

<div class="swiper-wrapper">
                            <?  
                            $featured = new WP_Query(
                                array(
                                    'posts_per_page' => 10,
                                    'post_type' => 'product',
                                    'orderby' => array('name' => 'ASC'),
                                    'tax_query' => array(
                                        array(
                                            'taxonomy' => 'product_visibility',
                                            'field'    => 'name',
                                            'terms'    => 'featured',
                                        )
                                    )
                                )
                            );

                            while($featured->have_posts()): $featured->the_post();?>
                                <?$product_id = get_the_ID();?>
                                <?$product = new WC_Product($product_id);?>
                                <div class="swiper-slide">
                                    <div class="top_products_item">
                                        <div class="top_products_img">
                                            <a href="<?=$product->add_to_cart_url()?>">
                                                <?=$product->get_image()?>
                                            </a>
                                        </div>
                                        <div class="top_products_content">
                                            <div class="top_products_title">
                                                <a href="<?=$product->add_to_cart_url()?>"><?=$product->get_title()?></a>
                                            </div>
                                            <div class="top_products_price">от <?=$product->get_price()?> р.</div>
                                            <a href="<?=$product->add_to_cart_url()?>" class="button">Оформить заказ</a>
                                        </div>
                                    </div>
                                </div>
                            <?endwhile;?>
                            <?wp_reset_postdata()?>
                        </div>