0

I'm using template part for showing portfolio items. It's not page template just portfolio.php file and I'm included it with get_template_part('portfolio'); to homepage.

Now everything is working good. But I want to use pagination for this section. Here is my code block;

<?php
global $wp_query;
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
$port_args = array(
        'post_type'     => 'portfolio',
        'posts_per_page'  => 3,
        'post_status'     => 'publish',
        'paged'       => $paged
);
$wp_port_query = new WP_Query($port_args);

if( have_posts() ) :
    while ( $wp_port_query->have_posts() ) : $wp_port_query->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;
endif;

echo '<nav>';
echo  '<div>'.get_next_posts_link('Older', $wp_port_query->max_num_pages).'</div>'; //Older Link using max_num_pages
echo  '<div>'.get_previous_posts_link('Newer', $wp_port_query->max_num_pages).'</div>'; //Newer Link using max_num_pages
echo "</nav>";

wp_reset_query();
?>

When I click the Older pagination button it's going to ?paged=2, but it's not working it shows same posts again. If I use the page template and open the themename/page_id=82 directly it's working. And url looking like this ?page_id=82&paged=2 now I'm thinking I missing page id on section. How can I fix this and work it in homepage template section. If it's not working how can I add the page_id in get_next_posts_link . It's looking like this now ?paged=2 and I want to change it like this ?page_id=82&paged=2. Page id is coming automaticly from page. How can I do this?

0

1 Answer 1

0

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.

1
  • I might be confused, if you want next and previous link working it the above answer will not cover it. I assume you are trying to get pagination working and my codes above must do it.
    – Sabbir H
    Mar 12, 2014 at 21:27

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