Skip Navigation

[Resolved] Date range between fixed month links

This thread is resolved. Here is a description of the problem and solution.

Problem:
Make a monthpicker and not having to choose start and end date using the picker. For example: When the user click the August button the view should update with August’s posts. And if the user hits the September button it should then load September posts.

Solution:
Solution with screenshots here:
https://toolset.com/forums/topic/date-range-between-fixed-month-links/#post-571500

This support ticket is created 7 years, 2 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.

Sun Mon Tue Wed Thu Fri Sat
- 12:00 – 17:00 12:00 – 17:00 12:00 – 17:00 12:00 – 17:00 12:00 – 17:00 -
- 18:00 – 21:00 18:00 – 21:00 18:00 – 21:00 18:00 – 21:00 18:00 – 21:00 -

Supporter timezone: Asia/Karachi (GMT+05:00)

This topic contains 10 replies, has 2 voices.

Last updated by Noman 7 years, 2 months ago.

Assisted by: Noman.

Author
Posts
#568612

There is a way to filter date range using between query and datepicker. I was thinking of manually listing separate months in the query filter section of the view and passing the min and max date using timestamp codes for each month as parametres.

Is that some how possible or is the only way doing it through the datepicker. So my object is basically to make a easy month picker and not having to choose start and end date using the picker.

#568696

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hi Bob,

Thank you for contacting Toolset support. If you are using Start & End date as custom fields, you can add them in the Custom Search View >> Filter Editor section and you will see appropriate filters in the Query Filter section.

In Query Filter then you can select how you want to pass the dates >> using URL parameter OR Shortcode attribute OR Date OR Constant (in constant you can add timestamp).

If you are asking about something else, please provide us with a basic example of the output and how it will for the end user, so we can provide more info whether its possible.

Thank you

#568798

OK here is my example: The Date is stored as a custom date field. (Timestamp value)

The user should be able to do a month based front end search so in the View filter editor I make buttons for the months. So I make buttons like august, september and so on.

When the user click the august button the view should update with august posts. And if the user hits the September button it should then load september posts.

Since the there are two url_param : min and max to be passed how do I do that by a single month button click?

#568826

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hello,

Thank you for explaining. So basically you only need a month selection option. For this I don’t think we need min or max values.

1. You can add “Months” as a custom field using Types >> use the checkboxes field >> add it in the Custom Search View >> Filter editor section >> it will show all months on frontend for users to search >> then you can style them as button using custom css / js.

For example:
Checkbox Option 1 = January
Checkbox Option 2 = February
Checkbox Option 3 = March

2. OR alternatively, you can create 1 Taxonomy for “Months” and add 12 terms (name of months) >> then you can select terms inside each post >> add it in the Custom Search View >> Filter editor section >> it will show all months on frontend for users to search >> then you can style them as button using custom css / js.

You can use any field type (checkboxes, dropdown, radio, etc). As we are not using date or time, that’s why we really don't need the Date field in this case. Thank you

#570578

Since I have a lot of items in the custom post type with Date Field value already. Making a Month custom field is not really an option. Would take forever to go through and add that...

#570956

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Hello Bob,

We have a URL parameter option in the filters, I am thinking that we can add some code to modify the query and get our results with a month only filter using the existing data.

To debug this further, please provide temporary access (WP-Admin and FTP Login info) to your site (preferably staging site), so that I can look into your setup and check the issue.

Your next answer will be private which means only you and I have access to it.

=== Please backup your database and website ===

✙ I would additionally need your permission to de-activate and re-activate Plugins and the Theme, and to change configurations on the site. This is also a reason the backup is really important.

✙ Please add the backend link for the View and the Page link.

Thank you

#571119

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Thank you for providing login info and more details. I am working on it further and trying to find a way to make it work all together. I will update you with my findings soon.

Thank you for waiting on this

#571400

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

Just wanted to send an update that the first method that I was thinking didnt work out well. Using interface options it is not possible however. I am going to try out with another way, with some more custom code and see how it goes. I will update you accordingly.

Thank you

#571500

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

View settings.png
Results.png

I managed to achieve results for this. Atleast what's possible with current options of Views. I have done this on my local site because discover-wp does not allow to add custom code in it:

1. Please add this code in your theme's or child theme's functions.php file -- make sure to replace your View ID and custom field slug in it (look for comments I have added in the code below):

add_filter( 'wpv_view_settings', 'prefix_modify_filter_view', 5, 2 ); // use a low priority number of 5, so this runs early
function prefix_modify_filter_view( $view_settings, $view_id ) {
    
	if ( $view_id == 4225 ) { // if displaying a View with ID equal to 4225
		static $i = 1;
		global $post_ids;
		
		if(isset($_GET['archive_month']) && $_GET['archive_month'] != '') {
			$required_month = intval($_GET['archive_month']);
		
		//$required_month = 8;
		if( $i == 1 ) {
			
			$args = array( 
  				'post_type' => array('event'), // update post type
				'posts_per_page' => -1, 
			);
			$the_query = new WP_Query( $args );
			// The Loop
			if ( $the_query->have_posts() ) :
				$count = 0;
				while ( $the_query->have_posts() ) : $the_query->the_post();
					$date_value = get_post_meta(get_the_ID(), 'wpcf-eventdate', true);
				  	
				  	if(isset($date_value) && $date_value != '') {
						$current_post_month = date('m', $date_value);
					  	if( $current_post_month == $required_month ) {
							
							if($count == 0) {
						 		$post_ids =  get_the_ID();
							}
							else {
								$post_ids .= ','.get_the_ID();
							}
							 ++$count;
							
					  }
				  }
				
				endwhile;
			endif;
			// Reset Post Data
			wp_reset_postdata();
			
		}
		 $i++;
		 if($post_ids == '') $post_ids = '-1';
		 $view_settings['post_id_ids_list'] = $post_ids;
	   
		}
	}
    return $view_settings;
}

function get_month_list() {
	
	$jan = $feb = $march = $apr = $may = $jun = $jul = $aug = $sep = $oct = $nov = $dec = '';
	
	if(isset($_GET['archive_month']) && $_GET['archive_month'] != '') {
		$required_month = intval($_GET['archive_month']);
		switch($required_month) {
			case 1:
				$jan = 'selected="selected"';
				break;
			case 2:
				$feb = 'selected="selected"';
				break;
			case 3:
				$march = 'selected="selected"';
				break;
			case 4:
				$apr = 'selected="selected"';
				break;
			case 5:
				$may = 'selected="selected"';
				break;
			case 6:
				$jun = 'selected="selected"';
				break;
			case 7:
				$jul = 'selected="selected"';
				break;
			case 8:
				$aug = 'selected="selected"';
				break;
			case 9:
				$sep = 'selected="selected"';
				break;
			case 10:
				$oct = 'selected="selected"';
				break;
			case 11:
				$nov = 'selected="selected"';
				break;
			case 12:
				$dec = 'selected="selected"';
				break;
			
		}
	}
		
	$content = '<form class="custom-dropdown" action="" method="get">
		<select name="archive_month">
		  <option>Select Month...</option>
		  <option value="1" '.$jan.'>January</option>
		  <option value="2" '.$feb.'>February</option>
		  <option value="3" '.$march.'>March</option>
		  <option value="4" '.$apr.'>April</option>
		  <option value="5" '.$may.'>May</option>
		  <option value="6" '.$jun.'>June</option>
		  <option value="7" '.$jul.'>July</option>
		  <option value="8" '.$aug.'>August</option>
		  <option value="9" '.$sep.'>Sep</option>
		  <option value="10" '.$oct.'>October</option>
		  <option value="11" '.$nov.'>November</option>
		  <option value="12" '.$dec.'>December</option>
		</select>
		<input type="submit" value="Submit">
		</form>';
	return $content;
}
add_shortcode( 'get_month_list', 'get_month_list' );

2. View settings will be like I have shown in attached screenshot.

3. Results on the frontpage will look something like attached screenshot.

If you would like more robust feature and like me to submit this as a feature request, please let me know and I will submit this to our team for further consideration. Thank you

#571656

Many thanks. That was beyond what I expected to be required to do this so you provided excellent support. Yes certainly I think you should submit it as a feature request.

#571831

Noman
Supporter

Languages: English (English )

Timezone: Asia/Karachi (GMT+05:00)

NEW View settings.png

Thank you for your feedback. I worked further on this to try making it work with Ajax and I achieved success in doing this, so if you like to use Ajax filtering for this option you can use this updated method below:

1. In above code that I sent, please replace these lines of code:

$content = '<form class="custom-dropdown" action="" method="get">
        <select name="archive_month">
          <option>Select Month...</option>
          <option value="1" '.$jan.'>January</option>
          <option value="2" '.$feb.'>February</option>
          <option value="3" '.$march.'>March</option>
          <option value="4" '.$apr.'>April</option>
          <option value="5" '.$may.'>May</option>
          <option value="6" '.$jun.'>June</option>
          <option value="7" '.$jul.'>July</option>
          <option value="8" '.$aug.'>August</option>
          <option value="9" '.$sep.'>Sep</option>
          <option value="10" '.$oct.'>October</option>
          <option value="11" '.$nov.'>November</option>
          <option value="12" '.$dec.'>December</option>
        </select>
        <input type="submit" value="Submit">
        </form>';

With this Update code:

	$content = '<select name="archive_month" id="archive_month" class="js-wpv-filter-trigger form-control">
		  <option>Select Month...</option>
		  <option value="1" '.$jan.'>January</option>
		  <option value="2" '.$feb.'>February</option>
		  <option value="3" '.$march.'>March</option>
		  <option value="4" '.$apr.'>April</option>
		  <option value="5" '.$may.'>May</option>
		  <option value="6" '.$jun.'>June</option>
		  <option value="7" '.$jul.'>July</option>
		  <option value="8" '.$aug.'>August</option>
		  <option value="9" '.$sep.'>Sep</option>
		  <option value="10" '.$oct.'>October</option>
		  <option value="11" '.$nov.'>November</option>
		  <option value="12" '.$dec.'>December</option>
		</select>';

==> We need to select “AJAX results update when visitors change any filter values” from “Custom Search Settings”.

2. Add our month dropdown shortcode “[get_month_list]” to Filter Editor section.

3. To make ajax work we need to add some field in Filter Editor, for this purpose we can add Event Date field in filter editor and just hide it using css – as show in attached screenshot.

4. Updated View settings are shown in attached screenshot as well.

Thank you