Designs & Code

Design, Development and WordPress

Posted by & filed under CSS, Development, HTML, PHP, Plugins, WordPress.

WordPress Search & Filter is a simple search and filtering plugin.  It is essentially an advancement of the WordPress search box, adding taxonomy filters & post filters to really refine your searches.

You can search by Category, Tag, Custom Taxonomy, Post Type or any combination of these easily – you can even remove the search box and simply use it as a filtering system for your posts and pages.

After my own requirements of needing some granular filters applied to my searches I tried a few free plugins online and found none quite did what I need, there are many plugins that enhance the search box, and there are others that allow filtering of taxonomies but none that combine the two and are free (as far as I can tell).

The best free plugin I found was the Query Multiple Taxonomies Plugin – however it did not allow you to search at the same time as applying the filters.

And so the Search & Filter plugin was born:

 

Download Wordpress Search & Filter

Grab the download any of these sources:

WordPress Plugins GitHub

How To Use

To display Search & Filter all you need to do is a use a shortcode:

[searchandfilter fields="search,category,post_tag"]

This will display a search box, a category dropdown and a tag dropdown. You can use the shortcode within posts/pages and widget areas.

To use this within a theme file you simple need to call the `do_shorcode` function with the shortcode above within the theme file:

<?php echo do_shortcode( '[searchandfilter fields="search,category,post_tag"]' ); ?>

Documentation

Official documentation can be found on our docs site which contains usage examples and advanced settings & features.

Screenshots

[metaslider id=946]

Need More?

Get the pro version:

  • Search with Ajax 🙂
  • Filter by Date, Author & Post Meta / Custom Fields
  • Sort results by Post Meta / Custom Fields
  • Range Sliders and Range Fields for Meta Data
  • Drag and Drop user interface – makes it incredibly easy to build a granular search form
  • Works with WooCommerce, Advanced Custom Fields Plugin & more
  • Dedicated Support

Find out more

Links

– Official Documentation
WordPress.org Plugin
Github Project

331 Responses to “WordPress Search & Filter – A Simple Search and Filtering Plugin for Taxonomies”

  1. Way

    Hi Ross!

    1. The 1st link is version 1.2.0, it is working fine.
    http://goo.gl/QzSmIQ

    2. After the update, searching for “All Categories” and “All Tags” will not return any result.
    It works again after I reverted back to version 1.2.0. (For your testing, now it is version 1.2.2).
    http://goo.gl/Spu9nr

    Both sites are still under testing. Thanks.

  2. Way

    Hi Ross!

    Updated with your newest version 1.2.2 this morning. Found one problem. When selecting all categories and all tags without entering any text in the search box, no result will be shown. It will function properly only some text is entered in the search box.

    • Hi Way

      Can you send me a link? This is not happening on my version. The only change I have made here, is that if the search is blank, that it will load the search template, sometimes, depending on the theme it would load the homepage.

      One thing I would try is to clear you cache too, there are some new hidden form elements added so just make sure those are being loaded properly.

      Thanks
      Ross

  3. Way

    Hi Ross! Thanks a million!

    Your suggestion is simple and it works! I have changed the text in the search box using “search_placeholder”. I am able to change “All Tags” and “All Categories” to whatever I want but it took me a long time to figure out what you meant. So, I hope you don’t mind I do a rewrite for those not so technical like me out there.

    Login to Cpanel >>> Click on File Manager >>> Find this file “public_html/XXX…/wp-includes/taxonomy.php” and edit (backup 1st) “All Tags” and “All Categories” to whatever you want and save it.

    ‘all_items’ => array( __( ‘All Tags’ ), __( ‘All Categories’ ) ),

  4. Tracy

    Hi Ross, many thanks for a great plugin! 🙂 I’ve just added the post-types=”” option to your shortcode and it returns all the posts with the post type I’ve specified but it also makes my menu options disappear. If I remove it. searching without selecting any parameters doesn’t bring anything back but the menu remains. Any help would be much appreciated. I have disabled all the plugins I can without the custom post type disappearing.

    • Hi Tracy.. I’ve come across this bug too. The problem is the plugin is overriding all queries and limiting the post types to the ones you have selected (even the query to generate your navigation!). I’m working on a fix for this and should be available hopefully in the next 24hrs 🙂

  5. Way

    Hi Ross!

    I tried the new version, it is working well. Bravo! I tried changing the width of the search box, it is working fine too.

    However, I am not a technical person, I have no idea what is “search_placeholder” and where I can find it and how to change it. Could you please elaborate further on this?

    Also, Could you let me know how to change the default “All Categories” and “All Tags” to something else?

    Thanks in advance.

  6. Way

    Hi Ross!

    1. Can you tell me how to change the default text in the search box “Search…”, “All Categories” and “All Tags” to something else?

    2. How to adjust the width of the search box?

    Many thanks!

    • Hi there I’ve just updated the plugin, please check with the new version 🙂 There is an attribute called `search_placeholder` which will allow you to change the default text in the search box!

      To adjust the search box, you just need to apply some styling to it with css… you can try something like this (untested)

      `
      .searchandfilter input[type=text]
      {
      width:300px;
      }
      `

      Just to note, there are some major changes in the update so please see the changelog before upgrading to see if you need to rewrite any of your shorcode.

      Also, please refer to the docs to see how you can further make customisations – http://docs.designsandcode.com/search-filter/#options

      Thanks

  7. efrat

    I’m getting this error, please advise:

    Warning: Invalid argument supplied for foreach() in xxx/wp-content/plugins/search-filter/search-filter.php on line 335

    Warning: Cannot modify header information – headers already sent by (output started at xxx/wp-content/plugins/search-filter/search-filter.php:335) in xxx/wp-admin/post.php on line 222

    Warning: Cannot modify header information – headers already sent by (output started at /usr/home/lemondraft/public_html/lemondraft.pairserver.com/wp-content/plugins/search-filter/search-filter.php:335) in /usr/home/lemondraft/public_html/lemondraft.pairserver.com/wp-includes/pluggable.php on line 899

    • Hi there I’ve just updated the plugin, please check with the new version 🙂

      Just to note, there are some major changes in the update so please see the changelog before upgrading to see if you need to rewrite any of your shorcode.

      Thanks

  8. Shua

    Great plugin – so far it has saved a ton of time. One question: How can I add custom fields to the search query? Not individually, just search the regular stuff + any custom fields as well?

  9. Francesco G

    Hi There

    I am looking to make a filter for a custom taxonomy I have made in my sites function.php file but the drop down filter does not appear when I put the short code on to the page.

    This is the shortcode I am using
    [searchandfilter taxonomies=”category, post_tag, Manu” type=”select,checkbox”]

    And this is the code for my custom taxonomy

    add_action( ‘init’, ‘create_Manu_taxonomy’, 0 );

    function create_Manu_taxonomy() {

    $labels = array(
    ‘name’ => _x( ‘Manu’, ‘Manu’ ),
    ‘singular_name’ => _x( ‘Manu’, ‘Manu’
    ),
    ‘search_items’ => __( ‘Search Manu’ ),
    ‘all_items’ => __( ‘All Manu’ ),
    ‘parent_item’ => __( ‘Parent Manu’ ),
    ‘parent_item_colon’ => __( ‘Parent Manu:’ ),
    ‘edit_item’ => __( ‘Edit Manu’ ),
    ‘update_item’ => __( ‘Update Manu’ ),
    ‘add_new_item’ => __( ‘Add New Manu’ ),
    ‘new_item_name’ => __( ‘New Manu Name’ ),
    ‘menu_name’ => __( ‘Manu’ ),
    );

    register_taxonomy(‘topics’,array(‘post’), array(
    ‘hierarchical’ => true,
    ‘labels’ => $labels,
    ‘show_ui’ => true,
    ‘show_admin_column’ => true,
    ‘query_var’ => true,
    ‘rewrite’ => array( ‘slug’ => ‘Manu’ ),
    ));

    Please point me in the right direction

    Many thanks
    Fran

    • It looks like you have a typo, in your shortcode you have:
      `
      taxonomies=”category, post_tag, Manu”
      `

      I’m guessing you shouldn’t have a space before “Manu” and “post_tag”, I would also try setting it to use all lowercase so

      `
      taxonomies=”category,post_tag,manu”
      `

      Let me know if this works… If you’re not sure go to your wordpress admin and goto the Search & Filter page, in there it should list your taxonomy and the term to use.

      Thanks

  10. ken N

    Hi.

    Thanks for the great plugin. I am usiing it on a site with WP 3.7 the Bones theme by Eddie Machado.

    I have createed a custom post type “resource” and a custom taxonomy “resource categories”. Additonally I made 2 templates called taxonomy-resource_categories.php, and archive-resource.php to display all categorys and single categories differently.

    The search and Filter dropdowns are hardcoded in the archive-resource.php template.

    All menus are custom menus.

    Since I want all “searches” on that page to use the same template, I had to override the default WP functionality by adding conditional code at the top of my custom taxonomy templates. I simply includes the archive-resource.php file if $_GET[‘post_types’]==’resource’.

    But when I do that the menus disappear when search results are returned. If I deactivate the plugin and refresh the page, the menus re-appear. No PHP warnings or errors are thrown.

    The correct custom posts do show though.

    Any ideas?

    thanks
    Ken Nawrocki

    • Hi Ken, I think this may be a conflict perhaps with another plugin that uses the `post_types` var… try disabling all other plugins and see. Do you have a link I could look at?
      Thanks

  11. Ashish

    Hello,
    Thanks Ross for the help, it works 🙂
    But I am having another problem now, something like a conflict I think, when I log in or log out, I get this error message:
    ‘Warning: Invalid argument supplied for foreach() in C:xampphtdocsmywebsitewp-contentpluginssearch-filtersearch-filter.php on line 335’
    I am working under localhost.
    Any solution for that, why this error.
    Thank you!

    • Hi Ashish, I’ve just updated the plugin to v 1.2.0 so hopefully this problem is resolved.

      Just to note, there are some major changes in the update so please see the changelog before upgrading to see if you need to rewrite any of your shorcode.

      Also, please refer to the docs to see how you can further make customisations – http://docs.designsandcode.com/search-filter/#options

      Let me know how it goes, thanks

  12. clestcruz

    No problem, for the meantime i’ll be playing with it for a little while and try to find a way to achieve the results that i want 🙂

  13. clestcruz

    I managed to find a temporary solution using this –

    $(“.filter ul li:nth-child(1) select option:nth-child(1)”).text(‘Sort Location’);

    $(“.filter ul li:nth-child(2) select option:nth-child(1)”).text(‘Sort Area’);

    My next problem is that whenever i press the submit button

    The 1st select tag will show the default value of the 2nd select tag once the plugin has been executed. Hmmm

    • Hi Clestcruz, unfortunately providing support for that is out of the scope of what I can do, I would try asking in Stackoverflow as it’s mostly as JS related question. I will be adding this functionality at some point to the plugin but no idea when I will be doing this..

      Thanks

  14. clestcruz

    I have tried even using CSS using nth-child but the problem the default is still showing “All Categories”. Looks like i have to do this using javascript. By the way great work on the plugin 😀

    .filter ul li:nth-child(1) select option:nth-child(1){display:none !important}

  15. clestcruz

    Hi is there a way i can customize the dropdown with only a specific number of category.

    The dropdown is showing all the categories but i only want it to show a specific categories

    • Hi Clestcruz, unfortunately you cannot include/exclude categories or taxonomy terms – by default it shows all.. This is something I am looking at bringing to a future version

  16. Ritch

    Hi Ross,

    Thank you for your reply. If you’d like any beta testing doing for this functionality do let me know and I’ll be happy to help in any way I can 🙂

    All the best!

    Ritch

  17. Chris Sloan

    found an easy way to do it…download a plugin called Custom Taxonomies. Once created the Search and Filter plugin finds it and creates the option for creating a label for it.

  18. Chris Sloan

    Ahhh…that’s too bad! No way of me changing it in the plugin editor I guess? In the link you sent me I can’t figure out where to access the Taxonomies in my wordpress theme/install. Do you know about when the update of the plugin that would allow this would be available? Thanks so much for your help Ross!

  19. Chris Sloan

    How do I change the labels of the public taxonomies? I want to change Categories to read Drink Types and Tags to instead read Flavors. Is that possible? Thanks!!

  20. Ashish

    Hello,

    This plugin is really great 🙂

    But I would like to do a little modification concerning the drop down list.

    Well I am running a directory listings website under localhost. The drop down list shows only categories that a listing is assigned to them, but not showing empty categories. I want it to display all categories whether it is empty or not.

    Any help please.

    And I would like to add one more thing, is there any way to customize the submit button, rename the text, add a color to it or an image.

    Thanking you in advance!

    • Hi Ashish, this plugin does not support this option yet but if you want to modify the plugin to do so search for the following line in `search-filter.php` (approx line 779):

      `$taxonomychildren = get_categories(‘name=of’.$taxonomy.’&taxonomy=’.$taxonomy);`

      and change this to (untested):

      `$taxonomychildren = get_categories(‘name=of’.$taxonomy.’&taxonomy=’.$taxonomy.’&hide_empty=0′);`

      To customise the submit button just use standard css and target the submit button (it is a standard input) – you could add a class to the shortcode to make targeting it easier (ie, `class=’searchandfilter-class’` – see docs) and then use css to change the styling:

      `
      .searchandfilter-class input[type=”submit”]
      {
      background-color:#000;
      color:#fff;
      border:1px solid #666;
      }
      `

      To add a label, use the option “submitlabel” as mentioned in the docs also.. Hope that helps