wp query - Order posts inside bootstrap card columns

admin管理员组

文章数量:1023803

I have a bootstrap 4 card columns masonry like grid. I want to show six posts form my articles and I'm using a custom query to retrieve the posts. All works fine, but the posts aren't showed with the order I want. I don't know if it's because the card columns bootstrap settings or because the wordpress query. Is there a simple way to order the loaded posts with a custom order?

here is the example of my wp query

<?php
$clients = ['199','168','86','291','113','229'];

$portfolio = new WP_Query(array(
    'post_type'     => 'post',
    'status'        => 'published',
  'category_name' => 'Portfolio',
    'posts_per_page'=> 6,
    'post__in' => $clients
));
?>

<div class="card-columns">
<?php if( $portfolio->have_posts() ): while( $portfolio->have_posts() ): $portfolio->the_post();  ?>
    <div class="card hide">
      <a href="<?php the_permalink(); ?>">
          <img class="card-img-top w-100" src="<?php the_post_thumbnail_url('full'); ?>" id="case-studies">
          <div class="overlay"><h4 class="text-center" id="client-name"><?php the_title(); ?></h4></div>
      </a>
    </div>
<?php endwhile; ?>
<?php endif; wp_reset_postdata(); ?>
</div>

I have a bootstrap 4 card columns masonry like grid. I want to show six posts form my articles and I'm using a custom query to retrieve the posts. All works fine, but the posts aren't showed with the order I want. I don't know if it's because the card columns bootstrap settings or because the wordpress query. Is there a simple way to order the loaded posts with a custom order?

here is the example of my wp query

<?php
$clients = ['199','168','86','291','113','229'];

$portfolio = new WP_Query(array(
    'post_type'     => 'post',
    'status'        => 'published',
  'category_name' => 'Portfolio',
    'posts_per_page'=> 6,
    'post__in' => $clients
));
?>

<div class="card-columns">
<?php if( $portfolio->have_posts() ): while( $portfolio->have_posts() ): $portfolio->the_post();  ?>
    <div class="card hide">
      <a href="<?php the_permalink(); ?>">
          <img class="card-img-top w-100" src="<?php the_post_thumbnail_url('full'); ?>" id="case-studies">
          <div class="overlay"><h4 class="text-center" id="client-name"><?php the_title(); ?></h4></div>
      </a>
    </div>
<?php endwhile; ?>
<?php endif; wp_reset_postdata(); ?>
</div>

• posts
• wp-query
• twitter-bootstrap

Share Improve this question asked Apr 16, 2019 at 15:11 gogoDollgogoDoll 111 bronze badge 3

• 1 Take a look at the order and orderby parameters of WP_Query. codex.wordpress/Class_Reference/… – MikeNGarrett Commented Apr 16, 2019 at 15:17
• "I don't know if it's because the card columns bootstrap settings or because the wordpress query" figure that out and then you will know which path to investigate on sorting – RiddleMeThis Commented Apr 16, 2019 at 15:18
• 1 @MikeNGarrett Solved by using the orderby param in WP_Query() Thanks for the suggestion – gogoDoll Commented Apr 16, 2019 at 16:13

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

Take a look at the order and orderby parameters of WP_Query.

I have a bootstrap 4 card columns masonry like grid. I want to show six posts form my articles and I'm using a custom query to retrieve the posts. All works fine, but the posts aren't showed with the order I want. I don't know if it's because the card columns bootstrap settings or because the wordpress query. Is there a simple way to order the loaded posts with a custom order?

here is the example of my wp query

<?php
$clients = ['199','168','86','291','113','229'];

$portfolio = new WP_Query(array(
    'post_type'     => 'post',
    'status'        => 'published',
  'category_name' => 'Portfolio',
    'posts_per_page'=> 6,
    'post__in' => $clients
));
?>

<div class="card-columns">
<?php if( $portfolio->have_posts() ): while( $portfolio->have_posts() ): $portfolio->the_post();  ?>
    <div class="card hide">
      <a href="<?php the_permalink(); ?>">
          <img class="card-img-top w-100" src="<?php the_post_thumbnail_url('full'); ?>" id="case-studies">
          <div class="overlay"><h4 class="text-center" id="client-name"><?php the_title(); ?></h4></div>
      </a>
    </div>
<?php endwhile; ?>
<?php endif; wp_reset_postdata(); ?>
</div>

I have a bootstrap 4 card columns masonry like grid. I want to show six posts form my articles and I'm using a custom query to retrieve the posts. All works fine, but the posts aren't showed with the order I want. I don't know if it's because the card columns bootstrap settings or because the wordpress query. Is there a simple way to order the loaded posts with a custom order?

here is the example of my wp query

<?php
$clients = ['199','168','86','291','113','229'];

$portfolio = new WP_Query(array(
    'post_type'     => 'post',
    'status'        => 'published',
  'category_name' => 'Portfolio',
    'posts_per_page'=> 6,
    'post__in' => $clients
));
?>

<div class="card-columns">
<?php if( $portfolio->have_posts() ): while( $portfolio->have_posts() ): $portfolio->the_post();  ?>
    <div class="card hide">
      <a href="<?php the_permalink(); ?>">
          <img class="card-img-top w-100" src="<?php the_post_thumbnail_url('full'); ?>" id="case-studies">
          <div class="overlay"><h4 class="text-center" id="client-name"><?php the_title(); ?></h4></div>
      </a>
    </div>
<?php endwhile; ?>
<?php endif; wp_reset_postdata(); ?>
</div>

• posts
• wp-query
• twitter-bootstrap

Share Improve this question asked Apr 16, 2019 at 15:11 gogoDollgogoDoll 111 bronze badge 3

• 1 Take a look at the order and orderby parameters of WP_Query. codex.wordpress/Class_Reference/… – MikeNGarrett Commented Apr 16, 2019 at 15:17
• "I don't know if it's because the card columns bootstrap settings or because the wordpress query" figure that out and then you will know which path to investigate on sorting – RiddleMeThis Commented Apr 16, 2019 at 15:18
• 1 @MikeNGarrett Solved by using the orderby param in WP_Query() Thanks for the suggestion – gogoDoll Commented Apr 16, 2019 at 16:13

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 0

Take a look at the order and orderby parameters of WP_Query.

本文标签： wp queryOrder posts inside bootstrap card columns