wordpress custom search form

[WP] | Add a WordPress Custom Search Form

Rate this article

Share this article

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.wordpress custom search form
  • Go to https://cse.expertrec.com/newuser?platform=wordpress
  • Enter your website URL and initiate a crawl.wordpress custom search form
  • Wait till all your site pages of your website have been crawled.wordpress custom search form
  • Download expertrec’s search plugin from here
  • In your wordpress admin panel, go to Plugins-> Add New-> Upload pluginwordpress custom search form
  • Upload expertrec wordpress zip and click install. wordpress custom search form
  • Click on the Activate plugin.wordpress custom search form
  • In your left panel you must be able to see expertrec’s logo, click on that.wordpress custom search form
  • Go to https://cse.expertrec.com/csedashboard/home/Status and copy your site ID.wordpress custom search form
  • Paste your site ID inside your expertrec plugin pagewordpress custom search form
  • 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.wordpress custom search form
  • 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.

wordpress custom search form

Add wordpress search form

Are you showing the right products, to the right shoppers, at the right time? Contact us to know more.
You may also like