div的高度基于高级自定义字段日期条目

Question

I'm building a timeline page in Wordpress with Advanced Custom Fields. I have an event start date and end date and I need to adjust the height of a div based on the duration of the event.

The code I have so far is below. <div class="span"></div> is the div that needs the height. A guestimate of the height ratio I need is about 100px per 30.5 days. The field names of the start/end dates are timeline_datespan_start and timeline_datespan_end and the field type is Date Picker.

<?php 
  $custom_args = array(
      'post_type'       => 'timeline',
      'post_status'     => 'publish',
      'posts_per_page'  => -1,
      'meta_key'        => 'timeline_date',
      'orderby'         => 'meta_value_num',
      'order'           => 'ASC'
    );

  $custom_query = new WP_Query( $custom_args ); ?>

<?php if ( $custom_query->have_posts() ) : ?>

<!-- the loop -->
<?php while ( $custom_query->have_posts() ) : $custom_query->the_post(); ?>

    <!-- event span -->
    <?php 
        $timeline_span = get_field('timeline_datespan_start');
        if( !empty($timeline_span) ): ?>
        <div class="event <?php the_field('timeline_datespan_start'); ?>">
            <div class="timeline-event-span">
                <div class="span"></div><div class="line"></div>
                <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> <span class="timeline-date">(<?php the_field('timeline_datespan_start'); ?> - <?php the_field('timeline_datespan_end'); ?>)</span>
            </div>
        </div>
    <?php endif; ?>
    <!-- /event span -->

    <?php // endif; ?>
<?php endwhile; ?>
<!-- end of the loop -->

<?php wp_reset_postdata(); ?>

<?php else:  ?>
    <p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>

Answer 1

Try with this:

  $startDate = the_field('timeline_datespan_start');
  $endDate   = the_field('timeline_datespan_end');

  $datetime1 = date_create($startDate);
  $datetime2 = date_create($endDate);

  $dDiff = $datetime1->diff($datetime2);
  $height = ($dDiff->days) / 0.305;