[WP] | Add a WordPress Custom Search Form

In this article, we will see how you can create a custom search form in wordpress using two different methods- by adding code, and not adding code.

Add wordpress search form

Method 1- WordPress custom search form by adding code.

All wordpress sites come with a default search form. Given that you are here, you want to edit the look and feel of your search form- The placeholder, the submit button, size of the search box, etc.

You can add a search form by including

<?php get_search_form(); ?>

 in your wordpress template. 

For creating a custom search form, create a new PHP file called searchform.php and save it to your themes folder. You can add the following form code to this file.

<form role="search" method="get" class="searchform group" action="<?php echo home_url( '/' ); ?>"> <label> <span class="offscreen"><?php echo _x( 'Search for:', 'label' ) ?></span> <input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'Search', 'placeholder' ) ?>" value="<?php echo get_search_query() ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" /> </label> <input type="image" alt="Submit search query" src="<?php echo get_template_directory_uri(); ?>/images/search-icon.png"> </form>

Method 2- Using WP custom search form wordpress plugin

Add wordpress custom search form

• Install the custom search form wordpress plugin from here.
• Go to https://cse.expertrec.com/newuser?platform=wordpress
• Enter your website URL and initiate a crawl.
• Wait till all your site pages of your website have been crawled.
• Download expertrec’s search plugin from here
• In your wordpress admin panel, go to Plugins-> Add New-> Upload plugin
• Upload expertrec wordpress zip and click install. 
• Click on the Activate plugin.
• In your left panel you must be able to see expertrec’s logo, click on that.
• Go to https://cse.expertrec.com/csedashboard/home/Status and copy your site ID.
• Paste your site ID inside your expertrec plugin page
• Subscribe to a paid plan (9 USD per month).
• That’s it, you have added a search form to your website. here is a snapshot.
• Now you can go to https://cse.expertrec.com/csedashboard/looknfeel/inputbox and here you will be able to style your wordpress search form the way you want it to look.

Add wordpress search form