JSFiddle - React, Tailwind, and code Playground

by yoowordpress

HTML

<section class="product">
    <div class="container">
        <h2 class="title">Экокубы</h2>
        <div class="product-block">
       <?php
        global $paged;

            $paged = ( get_query_var('page') ) ? get_query_var('page') : 1;
            $args = array(
                'post_type' => 'product',
                'posts_per_page' => 4,
                'paged' => $paged


                );
            $loop = new WP_Query( $args );
            if ( $loop->have_posts() ) {
                while ( $loop->have_posts() ) : $loop->the_post();
                    woocommerce_get_template_part( 'content', 'product' );
                endwhile;
            } else {
                echo __( 'No products found' );
            }
        ?>



        </div>

        <div class="pagination">
			
<?php 
            $total_pages = $loop->max_num_pages;

            if ($total_pages > 1){

                $current_page = max(1, get_query_var('paged'));

                echo paginate_links(array(
                    'format' => '/page/%#%',
                    'current' => $current_page,
                    'total' => $total_pages,
                    'prev_text'    => __('« prev'),
                    'next_text'    => __('next »'),
                ));
            }
            ?>  
</div>
    <?php wp_reset_postdata(); ?>
        
    </div>
</section>