I am able to display next and previous post in worspress but unable to show second-previous or third-previous || second-next or third-next like
1 - I want to show this too
2 - this is showing
3 - My Current post
4 - This is showing
5 - I want to show this too
any help would be appreciated.
In the and I am showing you my code so you can judge.
CODE:
<?php $next = get_permalink(get_adjacent_post(false,'',false)); if
($next != get_permalink()) { ?><a href="<?php echo $next; ?>">
<li class="col-xs-12 col-md-4">
<div class="article">
<div class="contain-image">
<?php $nextPost = get_next_post(true); $nextthumbnail = get_the_post_thumbnail($nextPost->ID); echo $nextthumbnail; ?>
</div>
<div class="content">
<div class="double-content">
<div class="information">
<span class="category"><?php echo get_cat_name(1);?></span>
<span class="time"><?php the_time('M j, Y') ?></span>
</div>
<div class="title">
<?php next_post_link('%link', "%title", TRUE); ?>
</div>
<p>
<?php
$Nextpost = get_next_post($id);
echo apply_filters(‘the_content’, $Nextpost->post_content);
?>
</p>
</div>
</div>
</div>
</li>
</a>
<?php } ?>
<?php $prev = get_permalink(get_adjacent_post(true,'',true)); if
($prev != get_permalink()) { ?><a href="<?php echo $prev; ?>">
<li class="col-xs-12 col-md-4">
<div class="article">
<div class="contain-image">
<?php $prevPost = get_previous_post(true); $prevThumbnail = get_the_post_thumbnail($prevPost->ID); echo $prevThumbnail; ?>
</div>
<div class="content">
<div class="double-content">
<div class="information">
<span class="category"><?php echo get_cat_name(1);?></span>
<span class="time"><?php the_time('M j, Y') ?></span>
</div>
<div class="title">
<?php previous_post_link('%link', "%title", TRUE); ?>
</div>
<p>
<?php
$Prevpost = get_previous_post($id);
echo apply_filters(‘the_content’, $Prevpost->post_content);
?>
</p>
</div>
</div>
</div>
</li>
</a>
<?php } ?>
WordPress provides several navigational template tags to make it easy for visitors to surf your pages. There are basically two different types of template tags used for chronological post navigation:
posts_nav_link() – for navigating various archive (non-single) pages
previous_post_link() & next_post_link() – for navigating single-post pages
<?php $posts = query_posts($query_string); if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php previous_post_link(); ?> | <?php next_post_link(); ?>
<?php endwhile; endif; ?>
try this:
global $post;
$post_curr = $post;
//get last post
$post_last1 = get_previous_post();
setup_postdata($post_last1);
//get second last post
$post_last2 = get_previous_post();
setup_postdata($post_curr);
//get next post now
$post_next1 = get_next_post();
setup_postdata($post_next1);
//get second next post
$post_next2 = get_next_post();
//reset current post data
setup_postdata($post_curr);
Related
Very new Wordpress apprentice here. Trying to get my archive page to display posts in two columns going like:
Post 1 Post 2
Post 3 Post 4
Here is an example from a figma we were working on: https://ibb.co/N3XwtwD
My question is, what code can I add to my files to allow this? I currently have some bootstrap classes on the html portion I inserted here and it is displaying as one column, so I don't know if those classes will interfere with anything. Here is my archive.php code below:
<?php
get_header();
?>
<div class="container mt-5 mb-5">
<p class="font-size"><?php the_archive_title(); ?></p>
<hr>
</div>
<div class="container">
<?php
while(have_posts()) {
the_post(); ?>
<div class="row">
<div class="col-lg-6">
<p class="font-size text-center"><?php the_title();?></p>
<img class="img-fluid mb-3"<?php
the_post_thumbnail();
?>
<p class="category-font">Published on <?php the_time('n.j.y');?></p>
<p>Posted by <?php the_author_posts_link() ?></p>
</div>
</div>
<?php }
echo paginate_links();
?>
</div>
<?php
get_footer();
?>
First time posting here so apologies if I left anything important out. Really appreciate this place!
Thanks!
You need to create a row every two posts and you have to add <div class="col-lg-6"> two times in a row. check below code.
<?php get_header(); ?>
<div class="container mt-5 mb-5">
<p class="font-size"><?php the_archive_title(); ?></p>
<hr>
</div>
<div class="container">
<?php
$count = 1;
while( have_posts() ) { the_post();
if ( $count % 2 == 1){ ?>
<div class="row">
<?php } ?>
<div class="col-lg-6">
<p class="font-size text-center"><?php the_title();?></p>
<?php the_post_thumbnail(); ?>
<p class="category-font">Published on <?php the_time('n.j.y');?></p>
<p>Posted by <?php the_author_posts_link() ?></p>
</div>
<?php if ( $count % 2 == 0 ){ ?>
</div>
<?php } $count++; ?>
<?php }
if ( $count % 2 != 1 ) echo "</div>";
echo paginate_links(); ?>
</div>
Please replace with the below code that helps you.
<?php
get_header();
?>
<div class="container mt-5 mb-5">
<p class="font-size"><?php the_archive_title(); ?></p>
<hr>
</div>
<div class="container">
<?php
$counterval = 0;
while(have_posts()) {
the_post();
$counterval++;
if($counterval % 2 != 0)
{ ?>
<div class="row">
<?php } ?>
<div class="col-lg-6">
<p class="font-size text-center"><?php the_title();?></p>
<?php $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'full');
if(!empty($featured_img_url)){ ?>
<img class="img-fluid mb-3" src="<?php echo esc_url($featured_img_url); ?>" />
<?php } ?>
<p class="category-font">Published on <?php the_time('n.j.y');?></p>
<p>Posted by <?php the_author_posts_link() ?></p>
</div>
<?php
if($counterval % 2 == 0)
{ ?>
</div>
<?php } ?>
<?php } ?>
<?php echo paginate_links();
?>
</div>
<?php
get_footer();
?>
I have a 'while' statement on my WordPress website which grabs the latest posts. I want to group every 6 posts in an ordered list. Is it possible to wrap the <li> elements in a <ul> for every 6 items?
I haven't tried anything to do this yet as not sure if possible. My code below is.
<?php elseif(get_row_layout() == 'posts_section'): ?>
<section class="content posts">
<div class="row">
<div class="columns medium-12">
<ul class="medium-block-grid-3 small-block-grid-2" data-equalizer>
<?php
$catquery = new WP_Query('cat='. get_sub_field('category') .'');
?>
<?php
while($catquery->have_posts()) : $catquery->the_post();
?>
<li data-equalizer-watch>
<a href="<?php the_permalink() ?>" rel="bookmark">
<div class="overlay"></div>
<div class="content">
<p><?php the_title(); ?></p>
<div class="text-center"><?php echo get_the_post_thumbnail($page->ID, 'thumbnail'); ?></div>
</div>
</a>
</li>
<?php
endwhile;
wp_reset_postdata();
?>
</ul>
</div>
</div>
</section>
I cant test the following bit of code since you dont provide any other information, but this is how I would solve this:
<?php elseif(get_row_layout() == 'posts_section'): ?>
<section class="content posts">
<div class="row">
<div class="columns medium-12">
<ul class="medium-block-grid-3 small-block-grid-2" data-equalizer>
<?php
$catquery = new WP_Query('cat='. get_sub_field('category') .'');
?>
<?php
$n = 0; //setting a count
while($catquery->have_posts()) : $catquery->the_post();
if ($n % 6 != 0) {
$n += 1 //keep on increasing till its divisble by 6
?>
<li data-equalizer-watch>
<a href="<?php the_permalink() ?>" rel="bookmark">
<div class="overlay"></div>
<div class="content">
<p><?php the_title(); ?></p>
<div class="text-center"><?php echo get_the_post_thumbnail($page->ID, 'thumbnail'); ?></div>
</div>
</a>
</li>
<?php
}
if ($n % 6 = 0) {
?>
//end the ul tag here and start a new one
</ul>
<ul class="medium-block-grid-3 small-block-grid-2" data-equalizer>
<?php
}
endwhile;
wp_reset_postdata();
?>
</ul>
</div>
</div>
</section>
My current blog page shows all my blog posts in a grid of 3 by 'x'. However at the top I want to display the latest blog post as some sort of a featured post and thus style it a bit different (i.e full width). I tried doing it through css with :first-child but that didn't really work well. So now I'm trying the php approach. I however have no clue how to approach this. Can anyone show me where to start? This is my current code.
<section id="blogs" class="cards-list">
<div class="container cards">
<div class="row center-xs">
<?php
if(get_post_type() == 'post') {
$currentBlog = get_the_ID();
} else {
$currentBlog = '';
}
$loopBlog = new WP_Query(array(
'post_type' => 'post',
'posts_per_page' => -1,
'post__not_in' => array($currentBlog)
));
while ( $loopBlog->have_posts() ) : $loopBlog->the_post();
$blogIntro = get_field('blog_intro');
$blogImage = get_field('blog_image');
$blogImageUrl = $blogImage['sizes']['large'];
?>
<div class="col col-xs-12 col-md-4">
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="card card-event">
<figure style="<?php if($blogImageUrl != '') { echo "background-image:url('".$blogImageUrl."');"; } ?>"></figure>
<div class="content">
<span class="tag"><?php the_time('M d Y'); ?></span>
<div class="link"><h3><span><?php the_title(); ?></span></h3></div>
</div>
</a>
</div>
<?php
endwhile; wp_reset_query();
?>
</div>
</div>
You should be able to use current_post inside the loop and output different markup for the first post:
while ( $loopBlog->have_posts() ) : $loopBlog->the_post();
$blogIntro = get_field('blog_intro');
$blogImage = get_field('blog_image');
$blogImageUrl = $blogImage['sizes']['large'];
?>
<?php if ($loopBlog->current_post == 0): ?>
<!-- Output some other markup for the first post here -->
<div class="container-fluid">
</div>
<?php else: ?>
<div class="col col-xs-12 col-md-4">
<a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>" class="card card-event">
<figure style="<?php if($blogImageUrl != '') { echo "background-image:url('".$blogImageUrl."');"; } ?>"></figure>
<div class="content">
<span class="tag"><?php the_time('M d Y'); ?></span>
<div class="link"><h3><span><?php the_title(); ?></span></h3></div>
</div>
</a>
</div>
<?php endif; ?>
<?php endwhile; wp_reset_query(); ?>
to learn wordpress development, I'm building a wordpress theme from scratch .
Now i want to add pagination on my category page but the problem is:
when i click on older-post-link the url change from "http://localhost/wordpress4/category/bloc1/" to "http://localhost/wordpress4/category/bloc1/page/2/" but it take me to a blank page instead of showing the other posts.
this is the code on the category.php
<?php get_header(); ?>
<div class="container">
<?php
$counter = 1; //start counter
$grids = 3; //Grids per row
global $query_string; //Need this to make pagination work
/*Setting up our custom query (In here we are setting it to show 12 posts per page and eliminate all sticky posts) */
query_posts($query_string . '&caller_get_posts=1&posts_per_page=4');
if(have_posts()) : while(have_posts()) : the_post();
?>
<?php
//Show the left hand side column
if($counter == 1) :
?>
<div class="row">
<div class="col-md-4">
<div class="center">
<div class="postimage">
<?php the_custom_logo(); ?>
</div>
<h2><?php the_title(); ?></h2>
<h4><?php the_category(); ?></h4>
</div>
</div>
<?php
elseif($counter == 2) :
?>
<div class="col-md-4 border2">
<div class="center">
<div class="postimage">
<?php the_custom_logo(); ?>
</div>
<h2><?php the_title(); ?></h2>
<h4><?php the_category(); ?></h4>
</div>
</div>
<?php
elseif($counter == $grids) :
?>
<div class="col-md-4">
<div class="center">
<div class="postimage">
<?php the_custom_logo(); ?>
</div>
<h2><?php the_title(); ?></h2>
<h4><?php the_category(); ?></h4>
</div>
</div>
</div>
<div class="clear"></div>
<?php
$counter = 0;
endif;
$counter++;
endwhile;
?>
<div class="row">
<div class="col-xs-6 text-left">
<?php next_posts_link('<< Older post'); ?>
</div>
<div class="col-xs-6 text-right">
<?php previous_posts_link('Newer post >>'); ?>
</div>
<?php
endif;
?>
</div>
</div>
<?php get_footer(); ?>
I noticed that if i add the code below to my index.php the pagination work also on the category page.
but the second category page("http://localhost/wordpress4/category/bloc1/page/2/") will take the markup of index.php so the posts will not be in a grid format like the first category page.
global $query_string; //Need this to make pagination work
/*Setting up our custom query (In here we are setting it to show 12 posts per page and eliminate all sticky posts) */
query_posts($query_string . '&caller_get_posts=1&posts_per_page=4');
also on the category page the older post-link show up between rows instead of showing at the bottom of the pages.
finally this is the code on my index.php
<?php get_header(); ?>
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-8">
<?php
if(have_posts()):
while(have_posts()): the_post(); ?>
<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>">
<h3><?php the_title(); ?></h3>
<small><?php the_category(); ?></small>
</a>
<p><?php the_content(); ?></p>
<hr/>
<?php endwhile;
endif;
?>
</div>
<div class="col-xs-12 col-sm-4">
<?php get_sidebar(); ?>
</div>
</div>
</div>
<?php get_footer(); ?>
Thank You.
Use this code, may be it will solve your problem
<?php
// the query to set the posts per page to 3
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
$args = array('posts_per_page' => 3, 'paged' => $paged );
query_posts($args); ?>
<!-- the loop -->
<?php if ( have_posts() ) : while (have_posts()) : the_post(); ?>
<!-- rest of the loop -->
<!-- the title, the content etc.. -->
<?php endwhile; ?>
<!-- pagination -->
<div class="row">
<div class="col-xs-12>"
<div class="col-xs-6 text-left"><?php next_posts_link(); ?></div>
<div class="col-xs-6 text-right"><?php previous_posts_link(); ?></div>
</div>
</div>
<?php else : ?>
<!-- No posts found -->
<?php endif; wp_reset_postdata(); ?>
for more details, check this link https://codex.wordpress.org/Pagination
After a lot of searching i was able to find a solution .
The problem was that the The "Blog pages show at most" in the wordpress reading settings was interfering with the "posts_per_page=4" that i declared through the query_posts().
The solution :
I deleted the "query_posts()" because it is best to use the WP_Query() or the pre_get_posts filter.
for me even with using wp_query i couldnt get the pagination to work so i tried using the pre_get_posts filter and it worked .
so in the category.php i deleted the query_posts and used just the normal loop.
this is my new code in the category.php
<?php get_header(); ?>
<div class="container">
<?php
$counter = 1; //start counter
$grids = 3; //Grids per row
if(have_posts()) :
while(have_posts()) : the_post();
?>
<?php
//Show the left hand side column
if($counter == 1) :
?>
<div class="row">
<div class="col-md-4">
<div class="center">
<div class="postimage">
<?php the_custom_logo(); ?>
</div>
<h2><?php the_title(); ?></h2>
<h4><?php the_category(' '); ?></h4>
</div>
</div>
<?php
elseif($counter == 2) :
?>
<div class="col-md-4 border2">
<div class="center">
<div class="postimage">
<?php the_custom_logo(); ?>
</div>
<h2><?php the_title(); ?></h2>
<h4><?php the_category(' '); ?></h4>
</div>
</div>
<?php
elseif($counter == $grids) :
?>
<div class="col-md-4">
<div class="center">
<div class="postimage">
<?php the_custom_logo(); ?>
</div>
<h2><?php the_title(); ?></h2>
<h4><?php the_category(' '); ?></h4>
</div>
</div>
</div>
<div class="clear"></div>
<?php
$counter = 0;
endif;
?>
<?php
$counter++;
endwhile;
?>
<div class="row">
<div class="col-xs-12 text-left ">
<?php next_posts_link('<< Older post'); ?>
</div>
<div class="col-xs-12 text-right ">
<?php previous_posts_link('Newer post >>'); ?>
</div>
</div>
<?php
endif;
?>
</div>
<?php get_footer(); ?>
Then I added the pre_get_posts action on my function.php
this is the code:
add_action( 'pre_get_posts', function ( $q )
{
if ( !is_admin() // Very important, otherwise back end queries will be affected as well
&& $q->is_main_query() // Very important, we just need to modify the main query
&& $q->is_category() // Only target category pages
) {
$q->set( 'posts_per_page', 2 );
}
});
I hope my answer will help someone who have the same problem i had even if my answer is not so well explained.
for more info search for something like this:
using pagination with the wp_query
using pre_get_posts to set pagination for a custom page.
It will be so nice if a developer could explain my solution in more details and give us more information about using pre_get_posts to set pagination for a custom page.
I need some help trying to figure this out, but currently, when I post a post on the Manhusay Theme on my Wordpress Site, it repeats it 3 times and replaces the other posts. The site is www.pcrmj.com. Here is the script that is currently in there if anyone has any suggestions or ways of correcting this.
<?php get_header(); ?>
<div id="content">
<div class="postgroup">
<?php for($i=1;$i<4;$i++) : ?>
<?php
$latest = get_option('mahusay_category_' . $i);
$latcat = (empty($latest)) ? 1 : get_category_by_slug($latest);
query_posts('showposts=1&cat='.$latcat->cat_ID);
?>
<?php while (have_posts()) : the_post(); ?>
<div class="post indexpost" id="post-<?php the_ID(); ?>">
<?php
$customfields = get_post_custom();
$scrp = get_bloginfo('wpurl') . '/tt-scripts/timthumb.php?';
if (empty($customfields['paddimage'][0])) {
$imgpath = $scrp . 'src=' . get_bloginfo('wpurl') . '/wp-content/themes/mahusay/images/thumbnail.png' . '&w=125&h=125&zc=1';
} else {
$imgpath = $scrp . 'src=' . get_bloginfo('wpurl') . $customfields['paddimage'][0] . '&w=125&h=125&zc=1';
}
?>
<div class="title">
<p>
<span class="date"><?php the_time('F j, Y'); ?></span>
<span class="nodisplay">|</span>
<span class="comments"><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?></span>
<span class="nodisplay">|</span>
<span class="categories"><?php echo $latcat->cat_name; ?></span>
</p>
</div>
<img class="header" src="<?php echo $imgpath; ?>" alt="<?php the_title(); ?>" />
<div class="entry">
<h2 class="title"><?php the_title(); ?></h2>
<?php themefunction_content(400,'');?>
</div>
</div>
<?php endwhile; ?>
<?php endfor; ?>
</div>
<div class="extra">
<div class="box box-popular">
<h2>Popular</h2>
<div class="interior">
<ul>
<?php akpc_most_popular(5,'<li><span>','</span></li>'); ?>
</ul>
</div>
</div>
<div class="box box-recent">
<h2>Recent</h2>
<div class="interior">
<?php themefunction_recent_post(); ?>
</div>
</div>
<div class="clearer"></div>
</div>
</div>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
Also, Thumbnail.png is not appearing. If anybody can help, that would be great.
First thing to do is after the following line...
<?php endfor; ?>
Add...
<?php wp_reset_query(); ?>
This resets the query back to what the query for that page should be and will stop any query_posts functions effecting other loops on the page.