Custom pagination [duplicate]

Question

I just have modified your code a little for adding pagination…. Here you go….

It will be your custom post type loop….

<?php if ( get_query_var('page') ) {  $paged = get_query_var('page'); } else if ( get_query_var('paged') ) {  $paged = get_query_var('paged'); } ?>
<?php $LoopPortfolio = new WP_Query(array( 'post_type' => 'portfolio', 'paged'=>$paged, 'posts_per_page' => '3' )); ?>
<?php if($LoopPortfolio->have_posts()) : while($LoopPortfolio->have_posts()) : $LoopPortfolio->the_post(); ?>

    <li class="col-lg-4 col-sm-4 view item <?php $terms = get_the_terms( get_the_ID(), 'portfolio_filter' ); ?><?php if($terms) : foreach ($terms as $term) { echo $term->slug.' '; } endif; ?>">

        <?php the_post_thumbnail("portfolio-image"); ?>

    </li>

<?php endwhile;
pagination($LoopPortfolio->max_num_pages); 
endif; wp_reset_query(); ?>

Add this function in your function.php file….

/// pagination
function pagination($pages="", $range = 2)
{  
     $showitems = ($range * 2)+1;  

     if ( get_query_var('page') ) {
    $paged = get_query_var('page');
} else if ( get_query_var('paged') ) {
    $paged = get_query_var('paged');
} else {
    $paged = 1;
}
     if(empty($paged)) $paged = 1;

     if($pages == '')
     {
         global $wp_query;
         $pages = $wp_query->max_num_pages;
         if(!$pages)
         {
             $pages = 1;
         }
     }   

     if(1 != $pages)
     {
         echo "<div class=\"pagination\"><span>Page ".$paged." of ".$pages."</span>";
         if($paged > 2 && $paged > $range+1 && $showitems < $pages) echo "<a href="".get_pagenum_link(1)."">&laquo; First</a>";
         if($paged > 1 && $showitems < $pages) echo "<a href="".get_pagenum_link($paged - 1)."">&lsaquo; Previous</a>";

         for ($i=1; $i <= $pages; $i++)
         {
             if (1 != $pages &&( !($i >= $paged+$range+1 || $i <= $paged-$range-1) || $pages <= $showitems ))
             {
                 echo ($paged == $i)? "<span class=\"current\">".$i."</span>":"<a href="".get_pagenum_link($i)."" class=\"inactive\">".$i."</a>";
             }
         }

         if ($paged < $pages && $showitems < $pages) echo "<a href=\"".get_pagenum_link($paged + 1)."\">Next &rsaquo;</a>";  
         if ($paged < $pages-1 &&  $paged+$range-1 < $pages && $showitems < $pages) echo "<a href="".get_pagenum_link($pages)."">Last &raquo;</a>";
         echo "</div>\n";
     }
}

Add this CSS in your css file…..

/*******************/
.pagination {
clear:both;
padding:20px 0;
position:relative;
font-size:11px;
line-height:13px;
}

.pagination span, .pagination a {
display:block;
float:left;
margin: 4px 4px 4px 0;
padding:9px 12px 8px 12px;
text-decoration:none;
width:auto;
color:#fff;
background: #555;
}

.pagination a:hover{
color:#fff;
background: #3279BB;
}

.pagination .current{
background: #3279BB;
color:#fff;
}

You can even use this code for home page ( when a custom page is set as home page the pagination normally do not work ). So just have called the pages twice to overcome this issue. If you still need help please contact me and if I will get time I must help you.

Related Posts: