Bounty: 100
I need to insert a pagination to the post instead of the load more button and I don’t know how how to do it. I require pagination of Next & Previous or numbers.
Here’s our dev work, but I don’t know where to start or where I should put this example.
<?php
/*
* Template Name: Blog
* description: >-
Page template without sidebar
*/
get_header(); ?>
<body class=" pageHeader--gray">
<div class="wrapper">
<div class="content">
<div class="pageHeader">
<div class="container animate">
<h1 class="pageHeader__title"><?php the_field('title'); ?>
</h1>
</div>
<div class="pageHeader__background">
<svg xmlns="http://www.w3.org/2000/svg" width="1920" viewBox="0 0 1920 126">
<path fill="#FFF" fill-rule="evenodd" d="M9.09494702e-13,7.95807864e-13 L1920,7.95807864e-13 L1920,22.1174168 C1622.41146,91.3724723 1302.41146,126 960,126 C617.588542,126 297.588542,91.3724723 9.09494702e-13,22.1174168 L9.09494702e-13,7.95807864e-13 Z" transform="rotate(180 960 63)"></path>
</svg>
</div>
<div class="pageHeader__decor animate animate--wrapper">
<div class="pageHeader__decor-1 animate__child">
</div>
<div class="pageHeader__decor-2 animate__child">
</div>
</div>
</div>
<div class="blog">
<div class="container">
<div class="blog__tags animate">
<?php
$categories = get_categories( array(
'orderby' => 'name',
'order' => 'ASC'
) );
$active = "";
if ( null == @$_GET['category_id'] ) {
$active = "active";
}
echo '<a class="blog__tag '.$active.'" href="'. site_url() .'/blog">All Categories</a>';
foreach( $categories as $category ) {
$active = "";
if ( $category->name == @$_GET['category_id']) {
$active = "active";
}
echo '<a class="blog__tag '.$active.'" href="'. site_url() .'/blog?category_id='.$category->name.'">'.$category->name.'</a>';
}
?>
</div>
<div class="blog__wrapper">
<?php
$args = array(
'posts_per_page' => 1,
'post__in' => get_option( 'sticky_posts' ),
'ignore_sticky_posts' => 1,
'category_name' => @$_GET['category_id']
);
$sticky_query = new WP_Query( $args );
while ( $sticky_query->have_posts() ) : $sticky_query->the_post();
?>
<a class="newsCard newsCard--big animate" href="<?php the_permalink(); ?>">
<?php if (has_post_thumbnail( get_the_ID() ) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), 'single-post-thumbnail' ); ?>
<div class="newsCard__image"><img src="<?php echo $image[0]; ?>" alt=""/></div>
<?php endif; ?>
<div class="newsCard__content">
<div class="newsCard__tag">
<?php
$categories="";
foreach((get_the_category()) as $category){
$categories = $category->name.",";
}
echo substr($categories, 0, -1);
?>
</div>
<div class="newsCard__title"><?php the_title(); ?>
</div>
<div class="newsCard__description"><?php the_excerpt(); ?>
</div>
<div class="newsCard__link">Learn more
<div class="newsCard__link-icon">
</div>
</div>
</div>
</a>
<?php
endwhile;
wp_reset_postdata();
?>
<?php
$load = 0;
$total_post =wp_count_posts()->publish;
if (null !== @$_GET['load']){
$load = $_GET['load'];
}
$i = 6 + $load;
?>
<?php
// the query
$wpb_all_query = new WP_Query(array(
'post_type'=>'post',
'post_status'=>'publish',
'posts_per_page'=>$i,
'ignore_sticky_posts' => 1,
'category_name' => @$_GET['category_id']
));
$count = $wpb_all_query->found_posts;
?>
<?php if ( $wpb_all_query->have_posts() ) : ?>
<!-- the loop -->
<?php while ( $wpb_all_query->have_posts() ) : $wpb_all_query->the_post(); ?>
<a class="newsCard newsCard animate" href="<?php the_permalink(); ?>">
<?php if (has_post_thumbnail( get_the_ID() ) ): ?>
<?php $image = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), 'single-post-thumbnail' ); ?>
<div class="newsCard__image"><img src="<?php echo $image[0]; ?>" alt=""/></div>
<?php endif; ?>
<div class="newsCard__content">
<div class="newsCard__tag">
<?php
$categories="";
foreach((get_the_category()) as $category){
$categories = $category->name.",";
}
echo substr($categories, 0, -1);
?>
</div>
<div class="newsCard__title"><?php the_title(); ?>
</div>
<div class="newsCard__description"><?php the_excerpt(); ?>
</div>
<div class="newsCard__link">Learn more
<div class="newsCard__link-icon">
</div>
</div>
</div>
</a>
<?php endwhile; ?>
<!-- end of the loop -->
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>
</div>
<?php if( null == @$_GET['load'] && $count > 6 ) : ?>
<div class="blog__button animate">
<?php
if ( null == @$_GET['category_id'] ) {
?>
<a class="btn" href="<?php echo site_url(); ?>/blog?load=<?php echo $load + $total_post; ?>"><?php the_field('load_more_button_label'); ?></a>
<?php
} else {
?>
<a class="btn" href="<?php echo site_url(); ?>/blog?category_id=<?php echo $_GET['category_id']; ?>&load=<?php echo $load + $total_post; ?>"><?php the_field('load_more_button_label'); ?></a>
<?php
}
?>
</div>
<?php endif; ?>
</div>
</div>
<div class="achievments">
<div class="container">
<div class="blockTitle blockTitle--center blockTitle--small">
<h2><?php the_field('achievement_title'); ?></h2>
</div>
<div class="rewardsCards2 animate animate--wrapper">
<?php
// the query
$wpb_all_query = new WP_Query(array(
'post_type'=>'achievement_cpt',
'post_status'=>'publish',
'posts_per_page'=>-1,
// 'ignore_sticky_posts' => 1,
// 'meta_key' => 'departament',
// 'meta_value' => 'Information Technology and Security'
));
?>
<?php if ( $wpb_all_query->have_posts() ) : ?>
<?php while ( $wpb_all_query->have_posts() ) : $wpb_all_query->the_post(); ?>
<div class="rewardsCards2__item animate__child"><img src="<?php echo get_field('image', get_the_ID()); ?>" alt=""/>
<div class="rewardsCards2__tooltip">
<div class="rewardsCards2__tooltip-logo"><img src="<?php echo get_field('image', get_the_ID()); ?>" alt=""/>
</div>
<div class="rewardsCards2__tooltip-content">
<div class="rewardsCards2__tooltip-title"><?php echo get_field('title', get_the_ID());?>
</div>
<div class="rewardsCards2__tooltip-description"><?php echo get_field('content', get_the_ID());?>
</div><a class="rewardsCards2__tooltip-link" href="<?php echo get_field('url',get_the_ID());?>">Read More</a>
</div>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>
</div>
</div>
</div>
<?php get_footer('phone'); ?>
</div>
</body>
<?php get_footer(); ?>
Get this bounty!!!
