So I have a date filter for my view which filters the view by post date(year). I already used BEF(Better Exposed Filters) but the only available options there is Default select list or jQuery Date Picker. I've attached some pics here, the first one is what's the filter looks like currently and the second one is how it should look. Need to convert the dropdown to look like the second pic. Thanks!

Current exposed filter

Expected result

2 Answers 2


You can use something like this:

Add a contextual filter to your view for 'Content:created year"

Add a Header Global Text Area (Full HTML) with this in it:

<li><a href="by-date/2012">2012</a></li>
<li><a href="by-date/2013">2013</a></li>
<li><a href="by-date/2014">2014</a></li>
<li><a href="by-date/2015">2015</a></li>

by-date is my view's path. Yours will be different.

Style it.

Looks like this without styling:

enter image description here

If you don't want a contextual filter you could create your date links with a query parameter like this:


Then use a views hook to read the query paramter and add the filter in code.

Please go through the following steps to display the select list as year links 
function mymodule_theme($existing, $type, $theme, $path){
    return array(
        'list_items' => array(
            'template' => 'list_items', //tpl to display them as list
            'path' => $path . '/templates', 
            'type' => 'module',
            'variables' => array(
                'list' => NULL,
                'current' => NULL
function mymodule_form_alter(&$form, &$form_state, $form_id) {
    if($form_id == 'views_exposed_form') {
     $current = '';
     $ranges = explode(':',$form['date_filter']['value']['#date_year_range']);
    foreach($ranges as $key => $range) {
       $ranges[$key] = date('Y', strtotime($range.' years', strtotime(date('Y-m-d H:i:s'))));
    $startYear = $ranges[0];
    $endYear = $ranges[1];    
    if($ranges[0] > $ranges[1]) {
        $endYear = $ranges[0];
        $startYear = $ranges[1];
    $items = array();
    $endYear = (int)$endYear;
    $startYear = (int)$startYear;
    if(empty($_REQUEST['date_filter']['value']['year'])) {
    $items[] = 'All years';
    } else {
       $items[] = l('All years', current_path(),array('query' => array("date_filter[value][year]" => '')) );
for($i=$endYear; $i>=$startYear; $i--) {
        if($_REQUEST['date_filter']['value']['year'] == $i) {
         $items[$i] = $i;
        } else {
         $items[$i] = l($i, current_path(), array('query' => array("date_filter[value][year]" => $i)));
$list = theme('list_items', array('list' => $items, 'current' => $_REQUEST['date_filter']['value']['year']));
       $form['html'] = array(
        '#type' => 'markup',
        '#markup' => $list,
<ol><?php foreach($list as $key => $value) { if($current == $key || empty($current)) { ?><li class="active"><?php print $value; ?></li>
<?php } else { ?>  <li><?php print $value; ?></li>
 <?php } } ?></ol>
name = Filters customization
description = Filters customization
version = VERSION
core = 7.x
dependencies[] = date
  • You should add some text describing what this is doing and why. It will help this be a more useful answer. Dec 29, 2015 at 17:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.