Wordpress时间线显示帖子每月

Question

I am fetching data through custom post type and category. I have added 12 category Jan to Dec and Jan has 1 posts Feb have 2 post

What I am struggling to do on January post the 2 circle is showing on the left I want only one January Circle rest of the January post under the circle.

Can you please how can i put check on category?

here is the site http://novartis.portlandvault.com/timeline/

Thanks

<div id="timeline">
    <?php
        //Define your custom post type name in the arguments

        $args = array('post_type' => 'timeline', 'order' => 'asc' );

        //Define the loop based on arguments

        $loop = new WP_Query( $args );

        //Display the contents

        while ( $loop->have_posts() ) : $loop->the_post();
        $thumb = wp_get_attachment_url( get_post_thumbnail_id($post->ID, 'large') );
        $category = get_the_terms($id, 'timeline_categories'); 
        ?>

    <div class="timeline-item">
        <div class="timeline-icon">
            <div class="timeline-month">
                <?php echo $category[0]->name;?>
            </div>
        </div>
        <div class="timeline-content right">
            <h2>
                <?php the_title(); ?>
            </h2>
            <p>
                <?php echo the_content(); ?>
            </p>
            <div class="timeline_img">
                <img src="<?php echo $thumb; ?>" class="img-responsive">
            </div>
        </div>

    </div>

    <?php endwhile;?>
</div>
<!-- Timeline ends here -->

Answer 1

I am not sure using categories is the best way to do this. You are limiting yourself to one years worth of data. I would suggest actually using the post date to separate the posts, then your code could look something like this.

<div id="timeline">
  <?php
    //Define your custom post type name in the arguments
    $args = array('post_type' => 'timeline', 'order' => 'asc' );

    //Define the loop based on arguments
    $loop = new WP_Query( $args );

    //Display the contents
    while ( $loop->have_posts() ) : $loop->the_post();
    $thumb = wp_get_attachment_url( get_post_thumbnail_id($post->ID, 'large') );
    $category = get_the_terms($post->ID, 'timeline_categories'); 
    ?>
    <section id="<?php echo $post->ID; ?>">

      <?php
        if( $loop->current_post === 0 ) {
          $current_quarter = $category[0]->name; ?>
          <div class="quarterlyheading">
            <?php echo $current_quarter; ?>
            <div class="quarterlinebreak"><hr></div>
          </div>
        <?php } else {      
          $post_quarter = $category[0]->name;
          if($current_quarter != $post_quarter) { ?>
            <div class="quarterlyheading">
              <?php echo $post_quarter; ?>
              <div class="quarterlinebreak"><hr></div>
            </div>
          <?php }
        }
        $current_quarter = $post_quarter;
      ?>

      <div class="timeline-item">
        <?php
          if( $loop->current_post === 0 ) {
            $current_month = get_the_time('M'); ?>
            <div class="timeline-icon">
              <div class="timeline-month">
                <?php echo $current_month; ?>
              </div>
            </div>
          <?php } else {      
            $post_month = get_the_time('M');
            if($current_month != $post_month) { ?>
              <div class="timeline-icon">
                <div class="timeline-month">
                  <?php echo $post_month; ?>
                </div>
              </div>
            <?php }
          }
          $current_month = $post_month;
        ?>        
        <div class="timeline-content right">

          <h2>
            <?php the_title(); ?>
          </h2>
          <p>
            <?php echo the_content(); ?>
          </p>
          <div class="timeline_img">
            <img src="<?php echo $thumb; ?>" class="img-responsive">
          </div>
        </div>

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