Date Field – change div class based by date

• GDdesign

• September 3, 2020 at 5:15 am

Hello ,

In the site that i develop i was try to change a class to a div by the date that choose in the date field in the admin, the page is events page, and i am using with a repeater field, the date field is a sub-field.

What in the end i want to achieve – When the date is far from the date event or it is the day – add class to a div “webinar-holder”.
When the date of the event has passed – add class “old-event”

i was try as follow

                        <?php if( $webinarDate <= date('dmY') ) { ?>
                        <div class="webinar-holder old-event">
                         <?php } elseif ( $webinarDate >= date('dmY') ) { ?>
                         <div class="webinar-holder">
                         <?php } ?>

And this is the long code (with the repeater):

           <div class="webinars-container">
            <?php if( have_rows('webinars-repeater') ){ ?>
                    <?php while( have_rows('webinars-repeater') ) { the_row();                                           
                        // vars
                        $webinarTitle = get_sub_field('webinar-title');                                          
                        $webinarDate = get_sub_field('webinar-date');                                           
                        $webinarStartTime = get_sub_field('webinar-time-start');                                           
                        $webinarEndTime = get_sub_field('webinar-time-end');                                           
                        $webinarLecturerImg = get_sub_field('webinar-lecturer');                                           
                        $webinarAboutLecturer = get_sub_field('webinar-about-lecturer');                                           
                        $webinarLink = get_sub_field('webinar-link');                                           
                        $webinarLinkText = get_sub_field('webinar-link-text');                                                                                     
                        ?>
                        
                        <?php if( $webinarDate <= date('dmY') ) { ?>
                        <div class="webinar-holder old-event">
                         <?php } elseif ( $webinarDate >= date('dmY') ) { ?>
                         <div class="webinar-holder">
                         <?php } ?>
                           <!-- details -->
                           <div class="webinar-details">
                               <div class="webinar-subject">
                                  <?php if (get_locale() == 'he_IL')  {  ?>
                                      <div class="title">על מה נדבר?</div>
                                  <?php } elseif (get_locale() == 'en_US') { ?>
                                      <div class="title">What will we talk about?</div>
                                  <?php } ?>      
                                   <?php echo $webinarTitle; ?>
                               </div>
                               <div class="webinar-date">
                                  <?php if (get_locale() == 'he_IL')  {  ?>
                                      <div class="title">בתאריך</div>
                                  <?php } elseif (get_locale() == 'en_US') { ?>
                                      <div class="title">Date</div>
                                  <?php } ?>  
                                   <?php echo $webinarDate; ?>
                               </div>
                               <div class="webinar-time">
                                  <?php if (get_locale() == 'he_IL')  {  ?>
                                      <div class="title">בין השעות</div>
                                  <?php } elseif (get_locale() == 'en_US') { ?>
                                      <div class="title">Time</div>
                                  <?php } ?>   
                                   <?php echo $webinarStartTime; ?>&nbsp;-&nbsp;<?php echo $webinarEndTime; ?>
                               </div>
                           </div>
                           <!-- end details -->
                           <div class="webinar-about-lecturer-container">
                                   <div class="lecturer-image">
                                         <img src="<?php echo $webinarLecturerImg['url']; ?>" alt="<?php echo $webinarLecturerImg['alt'] ?>" />
                                   </div>
                              <div class="about-lecturer-text"><?php echo $webinarAboutLecturer; ?></div>
                               <a href="<?php echo $webinarLink; ?>" target="_blank" class="webinar-link" rel="nofollow"><?php echo $webinarLinkText; ?></a>
                           </div>
                        </div>

                    <?php } ?>
            <?php } ?>     
           </div>

I don’t now what i missed that isn’t working.

I will very appreciat for every Instruction what to do to fix this….

• John Huebner

• September 3, 2020 at 5:43 am

What is the date format of the date field?

In order to compare 2 dates the dates must be in the same format and that format must have the year first, month second and day last (“Ymd” or “Y-m-d” or “Y/m/d”). in the format you are using dmY 12-30-1900 (Dec 30, 1900) will always be greater than any other date combination for example 01-01-2021 (Jan 1, 2021), “01” is less than “12”

// unformatted date
$webinarDateUnformatted = get_sub_field('webinar-date', false, false);
$now = date('Ymd');
if ($webinarDateUnformatted < $now) {
  // date is less than now
}

• GDdesign

• September 8, 2020 at 4:23 pm

Thank you for your reply John Huebner…

i set the date format as i Used to write the date, like this – 08/09/2020
this is day-month-year.
However – i try to set the format (‘Ymd’) as you say and this is worked – Thank you.