2

I'm messing around with my code. My goal is to display 4 custom post type on the homepage in the HTML layout I've created. Here's my code. Actually I can get the href but I can't loop the code not even achieve my scope.

<div class="roundedframe ">
<div class="container-fluid">
         <div class="row"> 
 <div class="col-lg-4 col-sm-6">
                        <a  class="portfolio-box" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
                                <div class="portfolio-box-caption">


 <div class="portfolio-box-caption-content">
                                        <div class="project-category text-faded">
                                        Category
                                        </div> 
<div style="background-image: url('<?php the_post_thumbnail_url(); ?>');">
                                          <div class="project-name"> <?php // WP_Query arguments
$args = array(
    'name'               => 'case-studies',
    'nopaging'               => true,
    'posts_per_page'         => '4',
);

// The Query
$query = new WP_Query( $args );
while ( $query->have_posts() ) :  $query->the_post();
?>
                                            Project Name
                                           </div>
                             </div>
                          </div>
                    </a>

                </div>
            </div>
    </div>

</div>

4
  • 4 custom post type or posts from custom post type 'case-studies' ? Commented Aug 1, 2018 at 11:18
  • Also you should write the your scope between the loop. Commented Aug 1, 2018 at 11:20
  • Thanks for the question. I've some projects in the "case-studies" and I want to display the last 4 in homepage Commented Aug 1, 2018 at 11:20
  • Thanks for you suggestion, but sadly I'm a totally newbie and I don't know exactly where to put my hands Commented Aug 1, 2018 at 11:24

2 Answers 2

3

Assuming the post type you want is case-studies you should name the key post_type and not name. You also have to place the column inside the loop and close it afterwards. You also missed a </div> tag.

<?php $query = new WP_Query( [
    'post_type'      => 'case-studies',
    'nopaging'       => true,
    'posts_per_page' => '4',
] ); ?>

<?php if ( $query->have_posts() ) : ?>
    <div class="roundedframe ">
        <div class="container-fluid">
            <div class="row">

                <?php while ( $query->have_posts() ) : $query->the_post(); ?>

                    <div class="col-lg-4 col-sm-6">
                        <a class="portfolio-box" href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
                            <div class="portfolio-box-caption">
                                <div class="portfolio-box-caption-content">
                                    <div class="project-category text-faded">
                                        Category
                                    </div>
                                    <div style="background-image: url('<?php the_post_thumbnail_url(); ?>');">
                                        <div class="project-name">
                                            <h2><?php the_title(); ?></h2>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </a>
                    </div>

                <?php endwhile; ?>

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

<?php wp_reset_postdata(); ?>
Sign up to request clarification or add additional context in comments.

Comments

0

You should put your code in the looping area. What i can see, you missed the endwhile also.

<div class="roundedframe ">
<div class="container-fluid">
         <div class="row"> 

<?php // WP_Query arguments
$args = array(
    'name' => 'case-studies',
    'nopaging' => true,
    'posts_per_page' => '4'
);

    // The Query
    $query = new WP_Query($args);
    while ($query->have_posts()):
        $query->the_post(); ?>
        <div class="col-lg-4 col-sm-6">
          <a  class="portfolio-box" href="<?php
    get_the_permalink();
    ?>" title="<?php
    get_the_title();
    ?>">
          <div class="project-category text-faded">
          Category
          </div> 
          <div style="background-image: url('<?php
    the_post_thumbnail_url();
    ?>');">
            <div class="project-name"> 
              Project Name
            </div>
          </div>
          </a>
        </div>
    <?php
    endwhile;
    ?>
    </div>
  </div>
</div><!--.roundedframe-->

Try this and let me know. It may help you. Before that you should learn about wp_query

https://codex.wordpress.org/Class_Reference/WP_Query

4 Comments

Thanks to all guys, but sadly the output coming from the code is this: <div id="primary" class="content-area"><main id="main" class="site-main"></main></div>
Did you go throw the link ?
Did you go throw the link ?
Sorry, my bad. The custom post type was "cases" not "case-studies" :) Many thanks!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.