Trong lập trình theme wordpress việc hiển thị next post và previous post cho theme là rất cần thiết, đôi khi chúng ta cảm thấy đau đầu vì phải viết hàm để lấy những post này ra. Thật may mắn khi wordpress đã có sẵn hàm get_previous_post(); và get_next_post(); để chúng ta lấy ra và sử dụng. Cách sử dụng hai hàm này cũng rất đơn giản như sau:
Hàm get_previous_post();
Đầu tiên chúng ta sẽ lấy gọi hàm get_previous_post(); ra và gán nó vào một biến, ở đây mình gán vào biến $prevPost, sau đó sẽ lấy lần lượt thumbnail và title của post ra để sử dụng.
Code:
$prevPost = get_previous_post(); // gán hàm vào biến $prevthumbnail = get_the_post_thumbnail($prevPost->ID,array(80,97)); // lấy thumbnal $prevtitle = get_the_title(); // lấy tiêu đề post
Như vậy là chúng ta đã lấy được 3 giá trị này để show ra html rồi.
Hàm get_previous_post();
Tiếp theo là hàm get_previous_post(); chúng ta gán nó vào biến $nextPost sau đó làm tương tự đối với hàm get_previous_post();
Code:
$nextPost = get_next_post(); // gán hàm vào biến $nexthumbnail = get_the_post_thumbnail($nextPost->ID,array(80,97)); // lấy thumbnal $nexttitle = get_the_title(); // lấy tiêu đề post
Sau đây là toàn bộ code để làm next và previous post trong wordpress.
<div class="navigation-area">
<div class="row">
<div class="col-lg-6 col-md-6 col-12 nav-left flex-row d-flex justify-content-start align-items-center">
<?php
$prevPost = get_previous_post();
$prevthumbnail = get_the_post_thumbnail($prevPost->ID,array(80,97));
$prevtitle = get_the_title();
?>
<div class="thumb">
<?php previous_post_link('%link', $prevthumbnail); ?>
</div>
<div class="arrow">
<a href="<?php echo esc_url( get_permalink( $prevPost->ID ) ); ?>"><span class="lnr text-white lnr-arrow-left"></span></a>
</div>
<div class="detials">
<p>Bài trước</p>
<a href="<?php echo esc_url( get_permalink( $prevPost->ID ) ); ?>"><h4><?php echo $prevtitle; ?></h4></a>
</div>
</div>
<div class="col-lg-6 col-md-6 col-12 nav-right flex-row d-flex justify-content-end align-items-center">
<?php
$nextPost = get_next_post();
$nexthumbnail = get_the_post_thumbnail($nextPost->ID,array(80,97));
$nexttitle = get_the_title();
?>
<div class="detials">
<p>Bài tiếp theo</p>
<a href="<?php echo esc_url( get_permalink( $nextPost->ID ) ); ?>"><h4><?php echo $nexttitle; ?></h4></a>
</div>
<div class="arrow">
<a href="<?php echo esc_url( get_permalink( $nextPost->ID ) ); ?>"><span class="lnr text-white lnr-arrow-right"></span></a>
</div>
<div class="thumb">
<?php previous_post_link('%link', $nexthumbnail); ?>
</div>
</div>
</div>
</div>
Tôi là một freelancer, mọi kiến thức mà tôi chia sẻ cho bạn đều là miễn phí!