WordPress Search Box

Add WordPress Search Box Code in 5 Minutes Flat

Have you ever been off doing a task and gotten totally side-barred by a different idea? Happens to me all the time!

Crap. What was I talking about?

Oh yeah, so I got sidetracked this morning, but I made a cool discovery and thought I’d share it with you:

I’ll show you how to add a WordPress search box to a post or page.

Include a WordPress search box on a page or post in any theme

My original task was to update a post I wrote awhile back on creating a custom 404 page with an html sitemap. There are lots ways to skin that cat, so to speak, and part of my research had me poking around the code for Bill Erickson’s Genesis 404 Page plugin.

Using that as inspiration, here’s some code you can use to achieve the effect, but without a plugin.

Place this in your theme’s functions.php file (or wherever you add customized code to your theme – Genesis Extender is a great option if you’re using the Genesis Framework):

TADA!

That’s it! Now you can insert [404-search] into your post or page and a search form will magically appear. Thanks Bill for the inspiration!

33 thoughts on “Add WordPress Search Box Code in 5 Minutes Flat”

  1. Hmmm. It doesn’t work for me.

    I had the get the plugin, as no matter what I tried I couldn’t get the functions.php code to work.

    (on the Agency Pro them, by the way)

  2. Ajaypal Bhoreriya

    Hello,

    You can also try this trick.

    <form method="get" id="searchform" action="/”>

    <input type="text" value="” name=”s” id=”s” />

    Select a Category
    <?php
    $allcategories= get_categories();
    foreach ($allcategories as $c) {
    $option = 'cat_ID.'”‘;
    $option .= ‘>’;
    $option .= $c->name;
    $option .= ”;
    echo $option;
    }
    ?>

  3. Suzanne Broadhurst

    Thank you! That was very helpful! I had to fiddle with the css to get the style right for in-page placement, but easy peasy!

  4. Pingback: Customize Your 404 Page • Pretty Darn Cute Design

    1. I’ve been using this great snippet of code for a while, and wondering if there’s an easy way to add a “Search again?” link to the search results, since my client’s site doesn’t have a sidebar, and it would be super handy to have a link like that either above or below the search result… Any thoughts? Thanks in advance! 🙂

      1. Heya! What theme are you using? The general concept (I think from what you said) is to place another search box above the search results in order to search again. You’d need to “hook” an area with the search form above the page with the search results.

        1. Hi Carrie: We’re using a highly modified Genesis/Lifestyle Pro Theme… Thinking that I might use Genesis Simple Hooks (which I use a lot), I activated Genesis Visual Hook Guide > action hooks and found these hooks above and below the search result for a bogus search string:

          genesis_before_loop

          Home > Search results for ‘bogus-search-term’

          Search Results for: ‘bogus-search-term

          genesis_loop

          … So, I added a “Try another search” link (adding to your PHP code), and that works great…

          “No content matched your criteria. Try another search…”

          For the case where there is a valid search result, I just used the Genesis after_content hook … It’s a bit of scrolling to get to when there are multiple (or long) results, but I think it will work…

          THANKS! 🙂

Leave a Comment

Your email address will not be published. Required fields are marked *

Carrie Dils uses Accessibility Checker to monitor our website's accessibility.