I want to display 5 images of custom post type 'project' and 1 standard post in the front-page. I have tried to merge both queries in one, however its not working.

FYI: I have set the theme support for thumbnail.

This is what I have so far on my front-page, but its not displaying them:

<div class="content lg-grid">
    <?php

    $query1 = new WP_Query(array(
        'project' => array(
            'posts_per_page' => 5,
            'post_type' => 'project'
        )
    ));
    $query2 = new WP_Query(array(
        'post' => array(
            'posts_per_page' => 1,
            'category' => 'art'
        )
    ));
    $result = new WP_Query();
    $result->posts = array_merge($query1->posts, $query2->posts);

    while ($result->have_posts()) : $result->the_post(); ?>
            <div class="project-item">
                <a href="<?php the_permalink(); ?>">
                    <img src="<?php the_post_thumbnail(); ?>" />
                    <h5 class="title"><?php the_title(); ?></h5>
                </a>
            </div>

    <?php endwhile;
    endif; ?>
</div>

I want to display 5 images of custom post type 'project' and 1 standard post in the front-page. I have tried to merge both queries in one, however its not working.

FYI: I have set the theme support for thumbnail.

This is what I have so far on my front-page, but its not displaying them:

<div class="content lg-grid">
    <?php

    $query1 = new WP_Query(array(
        'project' => array(
            'posts_per_page' => 5,
            'post_type' => 'project'
        )
    ));
    $query2 = new WP_Query(array(
        'post' => array(
            'posts_per_page' => 1,
            'category' => 'art'
        )
    ));
    $result = new WP_Query();
    $result->posts = array_merge($query1->posts, $query2->posts);

    while ($result->have_posts()) : $result->the_post(); ?>
            <div class="project-item">
                <a href="<?php the_permalink(); ?>">
                    <img src="<?php the_post_thumbnail(); ?>" />
                    <h5 class="title"><?php the_title(); ?></h5>
                </a>
            </div>

    <?php endwhile;
    endif; ?>
</div>

• custom-post-types
• wp-query
• post-type

1 Answer 1

Your query args contains a nested array, so it won't work that way — the items like posts_per_page belongs in the main array (e.g. new WP_Query( array( 'posts_per_page' => 5 ) )). So it should be like this:

Note that the 'category' => 'art' won't work. Instead, use the category_name parameter to query posts by the category slug.

$query1 = new WP_Query( array(
    'posts_per_page' => 5,
    'post_type'      => 'project',
) );
$query2 = new WP_Query( array(
    'posts_per_page' => 1,
    'category_name'  => 'art',
) );
$posts = array_merge( $query1->posts, $query2->posts );

Secondly, you don't need the third WP_Query instance (i.e. $result). Instead, you could use a foreach loop in place of while, then use setup_postdata() to setup the global post variable ($post) so that functions like the_permalink() and the_title() would work as expected.

And note that the_post_thumbnail() doesn't return the post thumbnail's URL; instead, it displays the post thumbnail, i.e. echo an <img> tag, hence you can't use the function in the image's src attribute.

foreach ( $posts as $post ) : setup_postdata( $post ); ?>
    <div class="project-item">
        <a href="<?php the_permalink(); ?>">
            <?php the_post_thumbnail(); ?>
            <h5 class="title"><?php the_title(); ?></h5>
        </a>
    </div>
<?php endforeach;

Now that should work.

But I don't think it's necessary to merge the posts, and I would likely use a template part for querying and displaying the standard post, and then load the template part from the front-page.php template:

• front-page.php

  <?php
  // Query 5 "project" posts.
  $projects = new WP_Query( [
      'posts_per_page' => 5,
      'post_type'      => 'project',
  ] );
  
  $i = 0; // post counter
  while ( $projects->have_posts() ) : $projects->the_post();
      // Displays the default post before the first "project".
      if ( 0 === $i ) {
          get_template_part( 'my-template-part' ); // no .php
      }
  ?>
      your code
  <?php
      $i++;
  endwhile;
  
  wp_reset_postdata();
  ?>
  

• my-template-part.php:

  <?php
  // Query 1 standard post.
  $art_posts = new WP_Query( [
      'posts_per_page' => 1,
      'category_name'  => 'art',
  ] );
  
  while ( $art_posts->have_posts() ) : $art_posts->the_post();
  ?>
      your code
  <?php
  endwhile;
  
  wp_reset_postdata();
  ?>