Selecting archives by month

I have a couple sites with legacy material that goes back many years. In addition to other navigation aids (such as selecting any given month of the archive), I wanted to include a way for visitors to skip to any given year.

Here is the code I used to accomplish this.

<h4>
  Issues by month 
</h4>
<label class="screen-reader-text" for="archives-dropdown-2">Issues by month</label> 
<select id="archives-dropdown-2" name="archive-dropdown" onchange="document.location.href=this.options[this.selectedIndex].value;">
  <option value="">Select Month</option>
  <option value="/2018/11/"> November 2018 (3)</option>
  <option value="/2018/10/"> October 2018 (9)</option>
  <option value="/2018/09/"> September 2018 (5)</option>
  <option value="/2018/08/"> August 2018 (11)</option>
  <option value="/2018/07/"> July 2018 (13)</option>
  <option value="/2018/06/"> June 2018 (9)</option>
  <option value="/2018/05/"> May 2018 (8)</option>
  <option value="/2018/04/"> April 2018 (2)</option>
  <option value="/2018/02/"> February 2018 (3)</option>
  <option value="/2018/01/"> January 2018 (3)</option>
</select>

The magic happens due to this code in the tag:

onchange="document.location.href=this.options[this.selectedIndex].value;"

I added this code to a sidebar widget, and for all appearances, it is just another built-in WordPress navigation scheme.

Advertisement