How to add filter Posts by Date in WordPress Admin

Are you tired of scrolling endlessly through your WordPress posts trying to find a specific one? Or maybe you need to quickly locate all the posts you published in a certain month? The default WordPress admin interface can be a bit limited when it comes to filtering by date. However, with a little bit of code, you can add a handy date filter and make your content management much easier!

In this article, we’ll guide you through a simple code solution that allows you to filter your WordPress posts by date directly from the admin dashboard. No need to install any extra plugins – we’ll keep it simple and effective.

Why a Date Filter is Essential

As your WordPress website grows, so does the number of posts you publish. Without a date filter, finding specific posts becomes a time-consuming chore. A date filter lets you quickly zero in on content from specific time periods, making your workflow much more efficient.

Adding the Filter Code

Step 1: Create a new folder named “filter-post-date” in your WordPress plugins directory.

Step 2: Create a file named “filter-post-date.php” inside the folder and paste the following code into it:

<?php
/*
Plugin Name: Filer Post By Date
Plugin URI: https://arriveddev.com/
Description: Filter posts or Media by day or month in Admin management page.
Version: 1.0.1
Author: ArrivedDEV
Author URI: https://arriveddev.com/
Network: true
Text Domain: filter-post-date

Copyright 2024 arriveddev.com (email: arriveddev.bz@gmail.com)
*/

class FilterPostByDate
{
    public function __construct()
    {
        add_action('init', array($this, 'filter_post_by_date'), 99);
    }

    public function filter_post_by_date()
    {
        global $pagenow;
        if (is_admin() && in_array($pagenow, array('edit.php', 'upload.php'))) {
            add_filter('months_dropdown_results', '__return_empty_array');
            add_action('admin_enqueue_scripts', array($this, 'jqueryui'));
            add_action('restrict_manage_posts', array($this, 'form'));
            add_action('pre_get_posts', array($this, 'filterQuery'));
        }
    }

    public function jqueryui()
    {
        wp_enqueue_style('jquery-ui', '//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.min.css');
        wp_enqueue_script('jquery-ui-datepicker');
    }

    public function form()
    {

        $from = (isset($_GET['dateFrom']) && $_GET['dateFrom']) ? $_GET['dateFrom'] : '';
        $to = (isset($_GET['dateTo']) && $_GET['dateTo']) ? $_GET['dateTo'] : '';

        echo '<style>
		input[name="dateFrom"], input[name="dateTo"]{
			line-height: 28px;
			height: 28px;
			margin: 0;
			width:125px;
		}
		</style>
		
		<input type="text" name="dateFrom" placeholder="Date From" value="' . esc_attr($from) . '" />
		<input type="text" name="dateTo" placeholder="Date To" value="' . esc_attr($to) . '" />
	
		<script>
		jQuery( function($) {
			var from = $(\'input[name="dateFrom"]\'),
			    to = $(\'input[name="dateTo"]\');

			$( \'input[name="dateFrom"], input[name="dateTo"]\' ).datepicker( {dateFormat : "yy-mm-dd"} );
    			from.on( \'change\', function() {
				to.datepicker( \'option\', \'minDate\', from.val() );
			});
				
			to.on( \'change\', function() {
				from.datepicker( \'option\', \'maxDate\', to.val() );
			});
			
		});
		</script>';

    }

    public function filterQuery($admin_query)
    {
        if ($admin_query->is_main_query()
            && (!empty($_GET['dateFrom']) || !empty($_GET['dateTo']))
        ) {
            $admin_query->set(
                'date_query',
                array(
                    'after' => sanitize_text_field($_GET['dateFrom']),
                    'before' => sanitize_text_field($_GET['dateTo']),
                    'inclusive' => true,
                    'column' => 'post_date'
                )
            );

        }
        return $admin_query;
    }
}

new FilterPostByDate();

Step 3: Go to your WordPress dashboard, navigate to Plugins, and activate the “Filter Post By Date” plugin.

Code Breakdown:

Here’s a simplified explanation of what the code does:

• jQuery UI Datepicker: This part of the code creates the visual calendar interface where you can select your date range.
• Filters: The code hooks into WordPress’s internal systems to modify how the posts are displayed. When you select a date range, it tells WordPress to show only the posts published within that range.

Troubleshooting Tips:

• Date Format: Make sure you enter the dates in the correct format (YYYY-MM-DD).
• Conflicts: If the filter doesn’t seem to work, it might be conflicting with another plugin. Try deactivating other plugins temporarily to see if that resolves the issue.

If you encounter difficulties with the code or are not familiar with programming, you can download and install the ready-made plugin below.