The example below uses a date picker to select a date range and returns events active within the range. 

The Filters add-on for Ajax Load More can render a calendar date picker that allows users to query posts by custom field date.

Note: The Date Picker field type works for dates stored as custom field values only.


Test the date range functionality by selection a range between February 14, 2021 and March 31st, 2021.

Select Date Range

    The Shortcodes

    The following shortcodes were used in the above example.

    Filters Shortcode[ajax_load_more_filters id="datepickertarget="alm_datepicker"] Ajax Load More Shortcode[ajax_load_more id="alm_datepickerfilters="true" target="datepicker" post_type="events" posts_per_page="3" meta_key="event_date" orderby="meta_value_num" order="ASC" button_label="Load More" no_results_text="Sorry, no events found between those dates."]

    Filter Group

    The screenshot below illustrates how to set up a date picker calendar in the Ajax Load More Filters admin.

    The admin for building date picker filters

    « Go back to Filters Add-on