Can anybody help me with a situation I have on my custom archive-product.php?

I am trying to add pagination to my grid I have made but do not know where to start. This is the code for my products:

<?php $the_query = new WP_Query( array(
   'paged' => get_query_var('paged') ? get_query_var('paged') : 1)

<div class="container marginT10P">
    <div id="products" class="row view-group">
        <?php $query = new WP_Query( $args );
            if ( $the_query->have_posts() ) {
            global $wpdb;
            while ( $the_query->have_posts() ) : $the_query->the_post();
            $image = wp_get_attachment_image_src( get_post_thumbnail_id( $the_query->post->ID ), 'single-post-thumbnail' );

  <div class="item col-xs-4 col-md-6 col-lg-4">
    <div class="thumbnail card">
      <div class="img-event">
        <a href="<?php the_permalink(); ?>"><img class="group list-group-image img-fluid propertysize" src="<?php echo $image[0]; ?>" alt="<?php get_post_meta( $attachment_id, '_wp_attachment_image_alt', true ); ?>" alt="" /></a>
    <div class="caption card-body">
        <?php global $woocommerce;
            $currency = get_woocommerce_currency_symbol();
            $price = get_post_meta( get_the_ID(), '_regular_price', true); 
        <h4 class="group card-title inner list-group-item-heading text-grey"><?php echo $currency; echo $price; ?> pcm</h4>
        <i class="fa fa-bath"></i> <?php echo $product->get_attribute( 'bathrooms' ); ?>
        <div class="icon-marginL10"><i class="fa fa-bed"></i> <?php echo $product->get_attribute( 'bedrooms' ); ?></div>
        <div class="icon-marginL10"><i class="fa fa-couch"></i> <?php echo $product->get_attribute( 'lounges' ); ?></div>
        <p class="group inner list-group-item-text bold no-margin font-size14 text-grey"><?php the_title(); ?></p>
        <p class="group inner list-group-item-text font-size14"><?php echo get_post_meta( get_the_ID(), 'grid-description', true ); ?></p>
        <div class="row">
            <div class="col-xs-12 col-md-6 col-lg-6 text-left tabletL-margin">
                <a class="btn btn-primary padding40 bold" href="<?php the_permalink(); ?>">Full Details</a>
            <div class="col-xs-12 col-md-6 col-lg-6 text-right">
                <a class="btn btn-success padding20 bold" href="<?php echo esc_url( home_url( '/request-call-back' ) ); ?>">Arrange To View</a>
    <div class="img-event">
        <a class="btn btn-danger padding40 width100 bold" href="tel:01472222333">Call 01472 222333</a>  
  <?php endwhile;
    } else {
      echo __( 'No products found' );

sorry for the messy code I will optimise it when it's complete


Hope you are doing good.

You can use the below sample code for archive-product.php page.

I have added a gist link: https://gist.github.com/baikaresandeep/32ba7723f76083ec1a7a2732f1e9be96

I have tested it, and working with pagination.

Hope this will help you.

  • when adding <?php have_posts()) : $the_query -> the_post(); ?> it comes up with this error: Parse error: syntax error, unexpected ') – JoeCold Nov 15 '18 at 11:58
  • I have updated my code for you – JoeCold Nov 15 '18 at 12:18
  • I have updated my code in gist, please check that one. Hope it'll work. – Baikare Sandeep Nov 15 '18 at 12:48
  • Thank you thats working but the pagination is <?php endwhile; $big = 999999999; // need an unlikely integer echo paginate_links( array( 'base' => str_replace( $big, '%#%', get_pagenum_link( $big ) ), 'format' => '?paged=%#%', 'current' => max( 1, get_query_var('paged') ), 'total' => $the_query->max_num_pages ) ); wp_reset_postdata(); } else { echo __( 'No products found' ); } ?> how do you style that ? – JoeCold Nov 15 '18 at 13:21
  • You can use the more parameters in that function for before_page_number and after_page_number. Reference: codex.wordpress.org/Function_Reference/paginate_links – Baikare Sandeep Nov 15 '18 at 15:42

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.