Support

Account

Home Forums Front-end Issues Sort custom posts via date picker (month) and then by day

Unread

Sort custom posts via date picker (month) and then by day

  • I’ve created a custom post type called Events and am displaying the 6 earliest dates on the home page with the closest date at the top of the list.

    I want to now create a calendar page with similar code but instead split all events and place them in separate boxes sorted by month with the month name as a header.

    Any ideas?

    This is the code i used for the home page…

    <div class="calendar_box">
              <i class="fal fa-calendar-alt"></i>
              <h3>
                Upcoming Events
              </h3>
    
              <?php
                $today = date('Ymd');
                
                $posts = get_posts(array(
                	'posts_per_page'	=> 6,
                	'post_type'			=> 'events',
                	'order'				=> 'ASC',
                	'orderby'			=> 'meta_value',
                	'meta_key'			=> 'event_date',
                	'meta_type'			=> 'DATETIME',
                  'meta_query' => array(
                  		array(
                  	        'key'		=> 'event_date',
                  	        'compare'	=> '>=',
                  	        'value'		=> $today,
                  	    )),
                ));
    
              if( $posts ): ?>
    
              	<ul class="upEvents">
              		<?php foreach( $posts as $p ):
                    $eventDate = get_field('event_date', $p->ID, false, false);
                    $eventDate = new DateTime($eventDate);
    
                    $Eterms = wp_get_post_terms( $p->ID, 'event-categories');
                    foreach($Eterms as $Eterm) {
                    $taxSlug = $Eterm->slug;
                    }
                  ?>
              			<li>
                      <div class="date_box <?php echo $taxSlug; ?>">
                        <p>
                          <span>
                            <?php echo $eventDate->format('M'); ?>
                          </span>
                          <?php echo $eventDate->format('j'); ?>
                        </p>
                      </div>
              				<div class="eTitle">
                        <p>
                          <?php echo $p->post_title; ?>
                        </p>
                      </div>
              			</li>
              		<?php endforeach; ?>
              	</ul>
              <?php endif; wp_reset_query(); ?>
              <div class="viewEvents">
                <a href="#">View all events</a>
              </div>
            </div>
Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.