I need to display all posts on the main page that will vary. That is, they will not repeat on the same page. I display them using WP_Query, but for each column of posts I need to have another 'posts_per_page'. How to do it?
I trying this:
<?php $my_query = new WP_Query($args); ?>
and
this <?php $my_query->set('posts_per_page', 3);
$my_query->query($my_query->query_vars); ?>
Here is my code example one:
<div class="row">
<div class="col-xl-9 col-lg-9 col-md-12 featured-posts">
<?php $my_query->set('posts_per_page', 3); $my_query->query($my_query->query_vars); ?>
<?php while ( $my_query->have_posts() ) : $my_query->the_post(); ?>
<article class="post post-id-<?php echo the_ID(); ?>">
<a class="post-thumbnail" href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_post_thumbnail(); ?></a>
<div class="post-content">
<h3 class="post-title"><?php the_title(); ?></h3>
<?php healthybroom_posted_on(); ?>
<?php healthybroom_entry_footer(); ?>
<p class="post-excerpt"><?php echo get_the_excerpt(); ?></p>
</div>
</article>
<?php endwhile; ?>
</div>
<div class="col-xl-3 col-lg-3 col-md-12 front-random-posts">
<?php $my_query->set('posts_per_page', 5); $my_query->query($my_query->query_vars); ?>
<?php while ( $my_query->have_posts() ) : $my_query->the_post(); ?>
<article class="post post-id-<?php echo the_ID(); ?>">
<a class="post-thumbnail" href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_post_thumbnail(); ?></a>
<div class="post-content">
<?php healthybroom_entry_footer(); ?>
<h3 class="post-title"><?php the_title(); ?></h3>
<?php healthybroom_posted_on(); ?>
</div>
</article>
<?php endwhile; ?>
</div>
</div>
I want the posts to not be repeated simply.
If you have 2 loops with random posts and you want to avoid to have same posts in the 2 loops, you can use the following code :
<!-- We create an array for saving the IDs of the post displaying in the first loop -->
<?php $store_posts_ids = array(); ?>
<div class="row">
<div class="col-xl-9 col-lg-9 col-md-12 featured-posts">
<?php
$my_query->set('posts_per_page', 3);
$my_query->query($my_query->query_vars);
?>
<?php while ( $my_query->have_posts() ) : $my_query->the_post(); ?>
<!-- We store the post id for the second loop -->
<?php array_push( $store_posts_ids, get_the_ID() ); ?>
<!-- Your code here -->
<?php endwhile; ?>
</div>
<div class="col-xl-3 col-lg-3 col-md-12 front-random-posts">
<?php
/*
If you want to display 5 posts, you need to have a loop
of 7 posts because you have 3 posts in your first loop
*/
$number_post = 0;
$my_query->set('posts_per_page', 5);
$my_query->query($my_query->query_vars);
?>
<?php while ( $my_query->have_posts() ) : $my_query->the_post(); ?>
<?php array( $store_posts_ids, get_the_ID() ); ?>
<!-- If we have our 5 posts, no need to display more posts -->
<?php if( $number_post < 5 ): ?>
<!-- If the post is not in the first loop -->
<?php if( !in_array( $store_posts_ids, get_the_ID() ) ): ?>
<?php $number_post = $number_post + 1; ?>
<!-- Your code here -->
<?php endif; ?>
<?php endif; ?>
<?php endwhile; ?>
</div>
</div>
Related
I posted this yesterday but then when I signed up after I couldn't see the question anymore, so apologies if it is now on here twice!
I'm trying to show a grid of thumbnails at the end of a single page. I have the grid working fine on my "work" page which is a category page. They are displayed as a thumbnail grid using the code below. And you can see on the site Here.
<?php
get_header(); ?>
<div class="grid work thumb-wrap clearfix">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post();?>
<a class="thumb" href="<?php the_permalink(); ?>">
<img src="http://www.nathanspence.com/wp-content/uploads/<?php echo get_post_meta($post->ID, 'thumb', true); ?>"/>
<div class="post-excerpt">
<h2><?php echo get_the_title($ID); ?></h2>
<div class="sub-title"><?php echo get_post_meta($post->ID, 'project-name', true); ?></div>
</div>
</a>
<?php endwhile; ?>
<?php endif; ?>
</div><!--end of "thumb-wrap"-->
<div class="push"></div>
</div><!--end of "page-wrap"-->
<?php get_footer(); ?>
I want to duplicate this at the end of each single post. Here.
<?php get_header(); ?>
<div class="page-content">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<article class="work post-content ready-to-column clearfix">
<header class="post-header column-left">
<h1><?php echo get_the_title($ID); ?></h1>
<h2><?php echo get_post_meta($post->ID, 'project-name', true); ?></h2>
<div class="project-info"><?php echo get_post_meta($post->ID, 'project-info', true); ?></div>
</header>
<div class="column-right">
<?php the_content(); ?>
</div><!---end of "right-column flex-column"--->
</article>
<?php endwhile; else: ?>
<p>Sorry, this post does not exist</p>
<?php endif; ?>
<div class="grid work thumb-wrap clearfix">
<?php if ( have_posts() ) : while ( have_posts() ) : the_post();?>
<a class="thumb" href="<?php the_permalink(); ?>">
<img src="http://www.nathanspence.com/wp-content/uploads/<?php echo get_post_meta($post->ID, 'thumb', true); ?>"/>
<div class="post-excerpt">
<h2><?php echo get_the_title($ID); ?></h2>
<div class="sub-title"><?php echo get_post_meta($post->ID, 'project-name', true); ?></div>
</div>
</a>
<?php endwhile; ?>
<?php endif; ?>
</div><!--end of "thumb-wrap"-->
<div class="push"></div>
</div><!--end of "page-wrap"-->
<?php get_footer(); ?>
I want to have this grid show at the end of a single post. I have tried just pasting the same loop in but as you can see, simply pasting it in just shows the current posts thumbnail. Any idea how I can do this? I'm a designer who is just learning to be able to maintain my own site, so I'm a bit lost reading about loops etc. Thanks!
Edit: So to make it clearer. How do I get this code below to output all posts in that category at the end of the single post?
<a class="thumb" href="<?php the_permalink(); ?>">
<img src="http://www.nathanspence.com/wp-content/uploads/<?php echo get_post_meta($post->ID, 'thumb', true); ?>"/>
<div class="post-excerpt">
<h2><?php echo get_the_title($ID); ?></h2>
<div class="sub-title"><?php echo get_post_meta($post->ID, 'project-name', true); ?></div>
</div>
</a>
Try adding this where you want all post
<?php
$wpb_all_query = new WP_Query(array('post_type'=>'post', 'post_status'=>'publish', 'posts_per_page'=>-1)); ?>
<?php if ( $wpb_all_query->have_posts() ) : ?>
<ul>
<!-- the loop -->
<?php while ( $wpb_all_query->have_posts() ) : $wpb_all_query->the_post(); ?>
<li><?php the_title(); ?></li>
<?php endwhile; ?>
<!-- end of the loop -->
</ul>
<?php wp_reset_postdata(); ?>
<?php else : ?>
<p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>
I have a standard wordpress blog here: http://webserver-meetandengage-com.m11e.net/insights/ and I've created a new category called clients.
The clients posts on this archive page will have different meta data that the standard blog post, so I want to get rid of the excerpt, date and author etc.
To achieve this I tried adding a conditional bit of code that said, IF the category of this post area is 'client' then echo style="display:none;" inside the div.
Here's the line of code I'm trying:
<p<?php if ( in_category( 'client' )) { echo 'style="display:none;"' }?>>This is not client</p>
Here's the loop it appears in:
<div class="container blog-card-container">
<div class="row">
<?php if ( have_posts() ) : ?>
<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>
<div class="col-md-4">
<a href="<?php the_permalink(); ?>">
<div class="card">
<div class="blog-thumb-container">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
</div>
<div class="blog-clients-card-block">
<?php if( get_field('quote_name') ): ?><p class="client-name" style="color:<?php the_field('client_brand_colour'); ?>;"><?php the_field('quote_name'); ?></p><?php endif; ?>
<p<?php if ( in_category( 'client' )) { echo 'style="display:none;"' }?>>This is not client</p>
<p class="blog-cat-label"><?php the_category(', '); ?></p>
<h2 class="blog-card-title"><?php the_title(); ?></h2>
<p class="card-text"><?php the_excerpt(__('(more…)')); ?></p>
<p><strong><?php the_author(); ?></strong> | <?php the_date(); ?> </p>
</div>
</div>
</a>
</div>
<?php understrap_pagination(); ?>
<?php endwhile; wp_reset_postdata(); endif; ?>
</div>
</div>
But including it here breaks the loop and the page doesn't load... I'm not sure what I'm doing wrong, or even if there might be a better solution?
I essentially want to show one set of meta for post thumbnails with the category 'client' and then another set for all other categories in the blog.
I guess it could be IF category of container is client then show META1 else show META2.
Any help would be massively appreciated :)
Managed to achieve this with two IF ELSE statements:
<div class="container blog-card-container">
<div class="card-columns">
<?php if ( have_posts() ) : ?>
<?php /* Start the Loop */ ?>
<?php while ( have_posts() ) : the_post(); ?>
<a href="<?php the_permalink(); ?>">
<div class="card">
<!-- Image if loop =========================================== -->
<?php if ( in_category('14') ) : ?>
<div class="client-header-logo-card" style="background-color: <?php the_field('client_brand_colour'); ?>;">
<?php
$image = get_field('client_logo');
if( !empty($image) ): ?>
<img src="<?php echo $image['url']; ?>" alt="<?php echo $image['alt']; ?>" />
<?php endif; ?>
</div>
<?php else: ?>
<div class="blog-thumb-container">
<?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } ?>
</div>
<?php endif ?>
<!-- Meta Data if loop =========================================== -->
<div class="blog-clients-card-block">
<?php if ( in_category('14') ) : ?>
<p class="blog-cat-label"><?php the_category(', '); ?></p>
<h2><?php the_title(); ?></h2>
<?php if( get_field('quote') ): ?><p class="client-quote"><?php echo custom_field_excerpt(); ?></p><?php endif; ?>
<?php if( get_field('quote_name') ): ?><p class="client-name" style="color:<?php the_field('client_brand_colour'); ?>;"><?php the_field('quote_name'); ?></p><?php endif; ?>
<?php if( get_field('quote_position') ): ?><p class="client-position" style="color:<?php the_field('client_brand_colour'); ?>;"><?php the_field('quote_position'); ?></p><?php endif; ?>
<?php if( get_field('button_text') ): ?>
<a class="btn btn-sm btn-client-archive" href="<?php the_permalink(); ?>" style="background-color:<?php the_field('client_brand_colour'); ?>;" role="button"><?php the_field('button_text'); ?></a>
<?php endif; ?>
<?php if( get_field('video_url') ): ?>
<div class="embed-container">
<?php the_field('video_url'); ?>
</div>
<?php endif; ?>
<?php else: ?>
<p class="blog-cat-label"><?php the_category(', '); ?></p>
<h2 class="blog-card-title"><?php the_title(); ?></h2>
<p class="card-text"><?php the_excerpt(__('(more…)')); ?></p>
<p><strong><?php the_author(); ?></strong> | <?php the_date(); ?> </p>
<?php endif ?>
</div>
</a>
</div>
You need to set it up in a Variable and echo the variable. For instance if client display:none is stored in the $style var if not then it doesn't place a style
<?php
if(in_category('client')){$style = 'display:none;';} else {$style = '';}
?>
<p style="<?php echo $style; ?>">This is not client</p>
I am building a WP site, which will have a News and Blog.
They will be in separate pages, One for news and one for Blog, which will be separated by categories.
So for example, I have this code on 'News', which stops the loop getting posts:
<?php
$uncat = get_cat_ID('uncategorised');
$uncat2 = get_cat_ID('blog');
$args = array(
'posts_per_page' => 3,
'category__not_in' => array($uncat, $uncat2)
);
$loop = new WP_Query( $args );
while ($loop->have_posts() ) : $loop->the_post();
?>
<div class="col-md-12 col-sm-12 col-xs-12" style="padding-left:0; padding-right:0;">
<a style="color:#333; text-decoration:none;" href="<?php echo get_permalink(); ?>">
<div class="postsize">
<div class="leftfloat" style="float: left; padding-right:20px;">
<?php echo get_the_post_thumbnail( $page->ID, 'categoryimage', array('class' => 'faqposts')); ?>
</div>
<div class="contentfaq">
<h4><?php the_title(); ?></h3>
<span class="entry-date-blue"><strong><?php echo get_the_date('d/m/y'); ?></strong></span>
<?php $trimexcerpt = get_the_excerpt();
$shortexcerpt = wp_trim_words( $trimexcerpt, $num_words = 10, $more = '… <br/> Read More ...' );
echo '<a style="color:#333; text-decoration:none;" href="' . get_permalink() . '"><p>' . $shortexcerpt . '</p></a>';
?>
</div>
</div>
</div>
</a>
<?php endwhile; ?>
<?php wp_reset_query(); ?>
</div>
This works fine, but I also have 'Archives' on the right hand side, which filters by date posted. The issue is, this will get posts from News AND blog, which defeats the idea of splitting them up.
Is there a way to split these up, so if the user clicks 'March 2015' on the archive, it will only get the posts from this month from NEWS?
Here is my current code for Archive.php
<?php if (have_posts()) : ?>
<!-- First, the loop checks whether any posts were discovered with the have_posts() function. -->
<!-- If there were any posts, a PHP while loop is started. A while loop will continue to execute as long as the condition in the parenthesis is logically true. So, as long as the function have_posts() returns a true value, the while loop will keep looping (repeating). -->
<?php while (have_posts()) : the_post(); ?>
<div class="col-md-12 col-sm-12 col-xs-12">
<a href="<?php echo get_permalink(); ?>">
<div class="postsize">
<div style="float: left; padding-right:20px;">
<?php echo get_the_post_thumbnail( $page->ID, 'categoryimage', array('class' => 'faqposts')); ?>
</div>
<h5 class="captext"><?php the_title(); ?></h5>
<span class="entry-date-orange"><?php echo get_the_date(); ?></span>
<?php
foreach((get_the_category()) as $category) {
echo ' | ' . $category->cat_name;
}
?>
<p style="margin-top:10px";><?php the_excerpt(); ?></p>
</div>
</a>
</div>
<?php endwhile; else: ?>
<p><?php _e('Sorry, no posts matched your criteria.'); ?></p>
<?php endif; ?>
Try this , it will echo list
<h2>Archives by Month:</h2>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
<h2>Archives by Subject:</h2>
<ul>
<?php wp_list_categories(); ?>
</ul>
full example code
<?php
/*
Template Name: Archives
*/
get_header(); ?>
<div id="container">
<div id="content" role="main">
<?php the_post(); ?>
<h1 class="entry-title"><?php the_title(); ?></h1>
<?php get_search_form(); ?>
<h2>Archives by Month:</h2>
<ul>
<?php wp_get_archives('type=monthly'); ?>
</ul>
<h2>Archives by Subject:</h2>
<ul>
<?php wp_list_categories(); ?>
</ul>
</div><!-- #content -->
</div><!-- #container -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>
I have extra field in my template, it looks like:
" >
<div class="entry-content clearfix">
<div class="col-left">
<?php the_content(); ?>
</div>
<div class="col-right">
<?php
if(function_exists('get_field')) {
$sc = get_field('second_column');
echo apply_filters( the_post_thumbnail( 'thumbnail' ), $sc );
}
?>
</div>
</div><!-- .entry-content -->
</div><!-- #post-## -->
It should be like that: col-left displaying posts (recent 10) and in col-right displaying thumnail to each post.
How I should put while, to have all content inside this template? Sitting a while on it, and no idea for it. The best, but not working as I need, is:
<?php if ( $category_posts->have_posts() ) ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="entry-content clearfix">
<div class="col-left">
<?php while ( $category_posts->have_posts() ) : $category_posts->the_post(); ?>
<?php the_content(); ?>
<?php endwhile; ?>
</div>
<div class="col-right">
<?php
while ( $category_posts->have_posts() ) : $category_posts->the_post();
if(function_exists('get_field')) {
$sc = get_field('second_column');
echo apply_filters( the_post_thumbnail( 'thumbnail' ), $sc );
}
?>
</div>
</div><!-- .entry-content -->
</div><!-- #post-## -->
Tomu, if you want to run loop twice on same page than you have to use <?php rewind_posts(); ?>. You can try below code.
<?php if ( $category_posts->have_posts() ) ?>
<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<div class="entry-content clearfix">
<div class="col-left">
<?php while ( $category_posts->have_posts() ) : $category_posts->the_post(); ?>
<?php the_content(); ?>
<?php endwhile; ?>
</div>
<div class="col-right">
<?php rewind_posts(); ?>
<?php
while ( $category_posts->have_posts() ) : $category_posts->the_post();
if(function_exists('get_field')) {
$sc = get_field('second_column');
echo apply_filters( the_post_thumbnail( 'thumbnail' ), $sc );
}
?>
</div>
</div><!-- .entry-content -->
So I managed to query my posts however they break/not aligned properly underneath after the first 2 columns. So I want to insert 2 posts per row, sorry if my explanation is really bad.
$loop = new WP_Query( array( 'post_type' => 'team') ); ?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); ?>
<!-- <div class="large-6 columns"> -->
<div class="row">
<div class="large-3 columns">
<?php if ( has_post_thumbnail()) : // Check if thumbnail exists ?>
<?php echo get_the_post_thumbnail($page->ID, 'medium'); ?>
<?php else: // use this image to fill the thumbnail ?>
<img src="http://placehold.it/350x150">
<?php endif; ?>
</div>
<div class="large-9 columns">
<div class="panel radius">
<h3><?php the_title(); ?></h3>
<p><?php the_content(); ?></p>
<?php edit_post_link(); // Always handy to have Edit Post Links available ?>
</div>
</div>
</div>
<!-- </div> -->
<?php endwhile; ?>
Not a zurb user, but i expect you need to start a new row every 2 posts:
$loop = new WP_Query( array( 'post_type' => 'team') );
$counter=0;
?>
<?php while ( $loop->have_posts() ) : $loop->the_post(); $counter++;?>
<div class="row">
<div class="large-3 columns">
<?php if ( has_post_thumbnail()) : // Check if thumbnail exists ?>
<?php echo get_the_post_thumbnail($page->ID, 'medium'); ?>
<?php else: // use this image to fill the thumbnail ?>
<img src="http://placehold.it/350x150">
<?php endif; ?>
</div>
<div class="large-9 columns">
<div class="panel radius">
<h3><?php the_title(); ?></h3>
<p><?php the_content(); ?></p>
<?php edit_post_link(); // Always handy to have Edit Post Links available ?>
</div>
</div>
</div>
<?php
//close row div and start another every 2 posts
if ($counter%2==0):?>
</div><div class="row">
<?php endif;?>
<?php endwhile; ?>