Archived topic
Change the default query loop
9 replies · Started by Saurabh on July 30, 2022
Hey David/Leo,
I am new with GP, working on a news site design for a client using GP Premium and GB.
Just wanted to understand how to change the default blog page along with all the archive pages.
I am trying to club and then display posts on blog pages based on the published date on all the archive pages. i.e. if blog pages show 9 posts
<main class="site-main" id="main">
<div class="03012022">
<span>03012022</span>
<article class="post-1 03012022">....</article>
<article class="post-2 03012022">....</article>
<article class="post-3 03012022">....</article>
</div>
<div class="02012022">
<span>02012022</span>
<article class="post-1 02012022">....</article>
<article class="post-2 02012022">....</article>
<article class="post-3 02012022">....</article>
</div>
<div class="01012022">
<span>01012022</span>
<article class="post-1 01012022">....</article>
<article class="post-2 01012022">....</article>
<article class="post-3 01012022">....</article>
</div>
</main>
Can you help me with that?
Hi there,
Thats really quite complicated and the you may need to custom develop your own archive templates so you can create a nested loop for that.
Without rewriting templates this is about all i can think of, which is to use a PHP Snippet to hook in a global date variable into generate_before_loop:
And if the current post in the loop has a different date to hook in our wrapper using generate_before_do_template_part hook:
And this is what that looks like:
add_action('generate_before_loop', function(){
// If not single template load our global date variable
if (!is_singular()) {
// Load global date variable
global $date;
$date = '';
}
});
add_action('generate_before_do_template_part', function(){
if (is_singular()) {
// Abort if on singular post template
return;
}
global $date;
$current_date = get_the_date();
// if not the first post and not the current date
// close the last group
if ( '' !== $date && $date != $current_date ) {
echo '</div>';
}
// If we have a new date open our our group
if ( $date != $current_date ) {
// print out date headline
echo '<div class="archive-date-group"><span class="group-date">'.$current_date.'</span>';
$date = get_the_date();
}
});
Hi David,
Thanks a lot for the quick response. I was also thinking of creating custom archive templates that will give much more room for customization.
However, your snippets also seem to be working on the archives with pagination. But on the archives with infinite scrolling, the <div class="archive-date-group"> does not close on date change. Neither new one starts.
Any idea if it can work on the archives with infinite scrolling?
Infinite scroll looks for an article element on the next page and then loads it. We would need to see the live page so we can check out the markup. It may be possible to filter the infinite scroll args to look for the element you're targeting.
Hey Tom,
Thank you for the response. Pl, check out the live page here.
It only seems to work on the archive page (with infinite scroll) where
- The No. of posts (on one date) < No. of posts to show on the blog pages i.e 8 posts are set in this case.
Hey Tom,
Did you have a chance to look at the live page? Please let me know if it can be done without using the custom archive page.
Hi there,
Sorry for the delay here. I think this would require a custom infinite scroll solution, unfortunately. The grouping of posts makes it very difficult.
If you can turn off the current infinite scroll and showcase how standard pagination works with the grouping it may (or may not) give me an idea I can point you in the right direction with.
Thanks!
Hey Tom,
I have made the changes and activated the pagination instead of infinite scrolling. Pl, take a look.
If it does not work, pl guide me to create a custom archive page with such functionality.
You can try something like this:
add_filter( 'generate_blog_infinite_scroll_init', function( $args ) {
$args['append'] = '.archive-date-group';
return $args;
} );
If it does not work, pl guide me to create a custom archive page with such functionality.
Unfortunately we're not able to help with detailed custom solutions like this. You'll need to hire a developer (codeable.io is helpful for this).
Thanks!
Thanks a lot, Tom for your help. I have developed a custom archive page, and it is working fine.