Pagination in Wordpress after the 5 latest posts - wordpress

How do I add pagination to this code? It currently shows latest articles.
Pagination can be after every 3 or 5 or 10 posts.
<?php
$the_query = new WP_Query( array(
'category_name' => $category_name,
'offset' => 1, //ignore the first 4 posts and show remaining
'orderby' => 'post_date',
'order' => 'DESC',
'post_type' => 'post',
'post_status' => 'publish',
'posts_per_page' => 3,
'ignore_sticky_posts' => true,
));
?>
<?php if ( $the_query->have_posts() ) : ?>
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div class="home__full">
<div class="row">
<div class="col-md-3">
<small><?php the_time('F jS, Y') ?> • <?php echo reading_time(); ?> • <?php $cat = get_the_category(); echo $cat[0]->cat_name; ?></small>
</div>
<div class="col-md-6">
<h3><?php echo substr(get_the_title(),0,95); ?></h3>
<div class="home__latest--excerpt"><p><?php echo substr(get_the_excerpt(),0,140); ?></p></div>
</div>
<div class="col-md-3">
<a href="<?php the_permalink() ?>">
<?php if( !empty(get_the_post_thumbnail()) ) { ?>
<?php the_post_thumbnail('medium');?>
<?php } else { ?>
<img src="<?php echo get_template_directory_uri(); ?>/images/blog-thumbnail.png" alt="<?php echo the_title(); ?>" class="wp-post-image" />
<?php } ?>
</a>
</div>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php __('No News'); ?></p>
<?php endif; ?>

Related

Wordpress CPT pagination returns 404 page

I want to add pagination to my CPT wordpress posts. I've seen some of the solutions, but neither I see no pagination or the pagination does not work.
I've added some pagination code, and it shows the correct number of pages but when I click on page number it returns 404 page. The url is also correct.
Here's my code:
<div class="container">
<div class="row">
<?php $paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1; ?>
<?php $args = array( 'post_type' => 'Realizacje', 'posts_per_page' => 6, 'category_name' => array('projekty-wnetrz', 'wykonczenia-pod-klucz'), 'paged' => $paged); ?>
<?php $loop = new WP_Query($args); ?>
<?php $count=0; ?>
<?php if ( $loop->have_posts() ) : while ( $loop->have_posts() ) : $loop->the_post();
$num = $loop->post_count;
?>
<div class="col-md-4">
<div class="realisation">
<!-- <div class="gallery">
<?php
$images = get_field('galeria');
$size = 'medium';
if( $images ): ?>
<div id="lightgallery<?php echo $count; ?>">
<?php foreach( $images as $image ): ?>
<div class="gal">
<img src="<?php echo $image; ?>"/>
</div>
<?php endforeach; ?>
</div>
<?php endif; ?>
</div> -->
<div class="galeria">
<div class="lightg" id="lightgallery<?php echo $count; ?>">
<a href="<?php echo get_the_post_thumbnail_url(); ?>">
<div class="relative-box"><img class="first_image"src="<?php echo get_the_post_thumbnail_url(); ?>"/>
<div class="demo-gallery-poster">
<i class="fa fa-search" aria-hidden="true"></i>
</div></div>
<div class="gallery-title"><h5 class="gallery-t"><?php the_title(); ?></h5></div>
</a>
<?php
$count=$count+1;
$images = get_field('galeria');
$size = 'large';
if( $images ): ?>
<?php foreach( $images as $image ): ?>
<img src="<?php echo $image; ?>"/>
<?php endforeach; ?>
<?php endif; ?>
</div>
</div>
</div>
</div>
<?php endwhile; ?>
<?php else: ?>
<h5>Brak realizacji</h5>
<?php endif; ?>
<div class="pagination">
<?php
$big = 999999999;
echo paginate_links( array(
'base' => str_replace( $big, '%#%', get_pagenum_link( $big ) ),
'format' => '?paged=%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => $loop->max_num_pages,
'prev_text' => '«',
'next_text' => '»'
) );
?>
</div>
<?php wp_reset_postdata(); ?>
</div>
</div>

Add pagination on display post wordpress

I am using the below code to list the posts but there are more than 200 posts so i want to add pagination at the end.
<?php
// the query
$the_query = new WP_Query(array(
'category_name' => 'Reports',
'post_status' => 'publish',
));
?>
<?php if ($the_query->have_posts()) : ?>
<?php while ($the_query->have_posts()) : $the_query->the_post(); ?>
<div class="col-md-12 event_col">
<div class="col-md-2 event_date">
<span><?php echo the_post_thumbnail(null, 'medium');?></span>
</div>
<div class="col-md-7 event_venue">
<div class="titl">
<?php the_title(); ?>
</div>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php __('No News'); ?></p>
<?php endif; ?>

I can not show my product feature image

<?php
$params = array(
'posts_per_page' => 9,
'post_type' => 'product'
);
$wc_query = new WP_Query($params);
if ($wc_query->have_posts()) :
while ($wc_query->have_posts()) : $wc_query->the_post(); ?>
<div class="col-sm-4 nk">
<div class="course">
<a href="<?php the_permalink(); ?>">
<img src="<?php the_post_thumbnail('thumbnail', array('class' => 'img-responsive')); ?>" />
</a>
<h3> <?php the_title(); ?></h3>
<h5><?php the_author(); ?></h5>
<p><?php echo $product->get_rating_html();?></p>
<h4><?php echo $product->get_price_html();?></h4>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else: ?>
<p>
<?php _e( 'No Products' ); ?>
</p>
<?php endif; ?>
First of all,
replace this code
<img src="<?php the_post_thumbnail('thumbnail', array('class' => 'img-responsive')); ?>" />
with
<?php the_post_thumbnail('thumbnail', array('class' => 'img-responsive')); ?>
And you need to add <?php global $product; ?> exactly before it use.
The total correct code is
<?php
$params = array(
'posts_per_page' => 9,
'post_type' => 'product'
);
$wc_query = new WP_Query($params);
if ($wc_query->have_posts()) :
while ($wc_query->have_posts()) : $wc_query->the_post(); ?>
<?php global $product;?>
<div class="col-sm-4 nk">
<div class="course">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('thumbnail', array('class' => 'img-responsive')); ?>
</a>
<h3> <?php the_title(); ?></h3>
<h5><?php the_author(); ?></h5>
<p><?php echo $product->get_rating_html();?></p>
<h4><?php echo $product->get_price_html();?></h4>
</div>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else: ?>
<p>
<?php _e( 'No Products' ); ?>
</p>
<?php endif; ?>
you are doing mistake whenever you use the_post_thumbnail() write with echo the_post_thumbnail();
so instead of the_post_thumbnail() use echo the_post_thumbnail()

How can I display posts side by side?

I created the WordPress loop below to display posts from a certain category in a row side by side. I'm having trouble because they are displayed on top of each other. I'm using Bootstrap 4
<?php
$args = array(
'category_name' => 'featured',
'posts_per_page' => 4
);
$the_query = new WP_Query($args);
?>
<?php if($the_query->have_posts()): while($the_query->have_posts()): $the_query->the_post(); ?>
<div class="row featured-row">
<div class="col-md-3">
<?php the_post_thumbnail( 'fimage', array('class' => 'img-fluid') ); ?>
<h5><?php the_title(); ?></h5>
<em>Posted on - <?php echo get_the_date(); ?></em>
<em>Written by - <?php the_author(); ?></em>
</div>
<?php endwhile; ?>
<?php endif; ?>
<hr>
</div>
<?php wp_reset_postdata(); ?>
Try these :
<?php
$args = array(
'category_name' => 'featured',
'posts_per_page' => 4
);
$the_query = new WP_Query($args);
?>
<?php if($the_query->have_posts()): ?>
<div class="row featured-row">
<?php while($the_query->have_posts()): $the_query->the_post(); ?>
<div class="col-md-3">
<?php the_post_thumbnail( 'fimage', array('class' => 'img-fluid') ); ?>
<h5><?php the_title(); ?></h5>
<em>Posted on - <?php echo get_the_date(); ?></em>
<em>Written by - <?php the_author(); ?></em>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>
<?php wp_reset_postdata(); ?>
Put your div with class row outside the loop. Use below code
<?php
$args = array(
'category_name' => 'featured',
'posts_per_page' => 4
);
$the_query = new WP_Query($args);
if($the_query->have_posts()):
echo ' <div class="row featured-row">';
while($the_query->have_posts()): $the_query->the_post(); ?>
<div class="col-md-3">
<?php the_post_thumbnail( 'fimage', array('class' => 'img-fluid') ); ?>
<h5><?php the_title(); ?></h5>
<em>Posted on - <?php echo get_the_date(); ?></em>
<em>Written by - <?php the_author(); ?></em>
</div>
<?php endwhile;
echo '</div>';
endif; ?>
<hr>
<?php wp_reset_postdata(); ?>

pagination not working on wordpress custom post type

This is the code i did for listing custom post type post in wordpress but it doesn't worked pagination what the mistake i did here can any one help ??
<div id="talent-main">
<?php
global $wp_query;
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$loop = new WP_Query( array('post_type' => 'talent','posts_per_page' => 2,'paged'=>$paged));
?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class('multiple') ?>>
<div class="post-image-talent">
<a class="post-frame <?php the_ID(); ?>" href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"></a>
<?php the_post_thumbnail('video-talent-thumb'); ?>
</div>
<h2><?php the_short_title('', '...', true, '22') ?></h2>
</div>
<?php endwhile;?>
<div class="navigation">
<div class="alignleft"><?php previous_posts_link('« Previous') ?></div>
<div class="alignright"><?php next_posts_link('More »') ?></div>
</div>
</div> <!-- main -->
Can you please check below code?
<?php
global $wp_query;
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$loop = new WP_Query(array(
'post_type'=>'talent',
'posts_per_page' => 2,
'paged' => $paged,
)); ?>
<?php if($loop->have_posts()) : ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<div id="post-<?php the_ID(); ?>" <?php post_class('multiple') ?>>
<div class="post-image-talent">
<a class="post-frame <?php the_ID(); ?>" href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"></a>
<?php the_post_thumbnail('video-talent-thumb'); ?>
</div>
<h2><?php the_short_title('', '...', true, '22') ?></h2>
</div>
<?php endwhile;?>
<?php
$total_pages = $loop->max_num_pages;
if ($total_pages > 1){
$current_page = max(1, get_query_var('paged'));
echo paginate_links(array(
'base' => get_pagenum_link(1) . '%_%',
'format' => '/page/%#%',
'current' => $current_page,
'total' => $total_pages,
'prev_text' => __('« prev'),
'next_text' => __('next »'),
));
}
?>
<?php else :?>
<h3><?php _e('404 Error: Not Found', 'No post found'); ?></h3>
<?php endif; ?>
<?php wp_reset_postdata();?>

Resources