Magento: Select Box / Dropdown List on Layered Navigation

You have plain text and link to those text in Magento Layered Navigation section. You can easily change the display of Layered Navigation links into a selection box / dropdown list. To do so, you need to edit the following file:

app/design/frontend/YOUR_PACKAGE/YOUR_THEME/template/catalog/layer/filter.phtml

filter.phtml file contains code something like below:


<ol>
<?php foreach ($this->getItems() as $_item): ?>
    <li>		
        <?php if ($_item->getCount() > 0): ?>
			<a href="<?php echo $this->urlEscape($_item->getUrl()) ?>"><?php echo $_item->getLabel() ?></a>
		<?php else: 
			echo $_item->getLabel() ?>
		<?php endif; ?>
		<?php if ($this->shouldDisplayProductCount()): ?>
			(<?php echo $_item->getCount() ?>)
        <?php endif; ?>
    </li>
<?php endforeach ?>
</ol>

Here is the edit to filter.phtml that will display selection box / dropdown list in layered navigation. You just need to replace the code of your filter.phtml file with the code shown below:


<select name="layered-nav-select" onChange="setLocation(this.value)">
	<option selected="selected" value="#">Please Select</option>
	<?php foreach ($this->getItems() as $_item): ?>				
			<?php if ($_item->getCount() > 0): ?>
				<option value="<?php echo $this->urlEscape($_item->getUrl()) ?>">
					<?php
					echo $_item->getLabel();
					if ($this->shouldDisplayProductCount()):
						echo '(' . $_item->getCount() . ')';
					endif; 
					?>
				</option>				
			<?php else: ?>
				<option value="#">
					<?php
					echo $_item->getLabel();
					if ($this->shouldDisplayProductCount()):
						echo '(' . $_item->getCount() . ')';
					endif; 
					?>
				</option>
			<?php endif; ?>		
	<?php endforeach ?>
</select>

Now, you should be able to view selection list in your layered navigation section in frontend.

Hope this helps. Thanks.