When your website means business.

Add a custom WP_Query to a Divi page

Recently, I designed a site using Divi because that’s what the client is used to. They didn’t have a lot of technical requirements, so I figured Divi would be OK. And it was OK, until it came to creating a listing of the ‘events’ custom post type: we wanted past events to drop off the list so only upcoming events are shown.

To accomplish this, I needed to compare today’s date (Ymd) with the value of a custom field called ‘event_enddate’ (also Ymd). If the end date is greater than or equal to today’s date, then the event is not past, and the event shows on the listing of upcoming events. Once today’s date is greater than the end date, the event is excluded from the listing. (FYI, custom fields were created with ‘Advanced Custom Fields Pro’, and the value for the date field was configured to Ymd in ACF’s UI when the custom field was created).

I’ve written WP_queries like this hundreds of times, and this one looks like this:

$today = date('Ymd', strtotime('-6 hours'));
$eventslist = new WP_Query(array( 
    'post_type' => 'events', 
    'posts_per_page' => 6,
    'paged' => $paged,
    'meta_key' => 'event_startdate', //custom field (Ymd)
    'orderby' => 'meta_value',
    'order' => 'ASC',
    'meta_query' => array(
        array(
        'key' => 'event_enddate', //custom field (Ymd)
        'meta-value' => $value,
        'value' => $today,
        'compare' => '>=', //compare event_enddate with today's date
        'type' => 'CHAR'
        )
    )
));
if ($eventslist->have_posts()) :
    while ( $eventslist->have_posts() ) : $eventslist->the_post();
    $date = get_field('event_dates'); //custom field
    $place = get_field('national_state'); //custom field
    $title = get_the_title();
    $link = get_the_permalink();
    $excerpt = get_the_excerpt();
    echo '<article class="et_pb_post clearfix events type-events hentry">'; //note use of Divi classes 
    echo '<h2 class="entry-title"><a href="'.$link.'">'.$title.'</a></h2>'; 
    echo '<div class="post-content">'; 
        echo '<div class="post-content-inner">'; 
        echo '<p><span class="date">'.$date.' | '.$place.'</span> – '.$excerpt.'</p>'; 
        echo '</div>'; 
    echo '</div>'; 
    echo '</article>
    endwhile; 
    else :
    echo '<p>No upcoming events are listed at this time.</p>';
endif;

The problem is how to get this query into a Divi page. You can’t just add PHP code to a text module; it will break the page. You can add a ‘blog’ module and specify the ‘Events’ custom post type, but that does not offer a way to make the comparison and add some of the other custom fields to the listing blurb.

Then I learned that Divi had recently introduced custom fields to its blog conditions, allowing me to make ‘event_enddate’ part of a display conditional (so exciting!). Unfortunately, blog conditions still offers no way to compare the custom field to today’s date (so deflating!).

Next I contacted both Divi support, and they were no help.

I finally found a plugin called ‘Insert PHP Code Snippet’ from XYZScripts. It allows you to create shortcodes from PHP code. And that’s what we did with the WP_Query shown above, creating a shortcode we could paste into the Divi text module, in this case:
[xyz-ips snippet="Upcoming-Events"].

Menu
We use cookies in order to give you the best possible experience on our website. By continuing to use this site, you agree to our use of cookies.
Accept
Cookies Notice