WordPress

How to Customize the Default Search Form in WordPress

A client whose site we recently rebuilt on WordPress came up with an unusual request: they asked two search forms on each page–one searching the site, the other a catalog on another site.

Fortunately, the Avada theme we used allows you to have a search form in both the header and the footer, so taking care of that part of the request was easy.  It looked to me like the tricky part would be in getting the forms to submit to different locations.

Warning: creating a form that submits data to another site without the site-owner’s knowledge and permission amounts to a cross-site scripting attack.  You’re using your form to inject data into the other site’s code.

Luckily, in the case of the catalog site, the vendor allows customers to create their own off-site search forms and even advises them on how to do it.  Obviously, they’ve taken extra measures to sanitize the posted data, and obviously your form needs extra measures to sanitize the data before it’s posted.  (For this article, I cover only the basics of jQuery, not the extra measures.)  Unless you know you have the blessing of the other site, then you’re attacking the other site, whatever your intentions.

That being said, here’s how you can customize the default WordPress search form action with jQuery.  Download How to Customize the Default Search Form in WordPress

Contact us.

Say Hello.
Call us at 503-577-6905 to schedule a free consultation.

7032 SE 52nd Ave
Portland, OR 97206
Directions

Ask us a question.

Invalid Email
Please check the captcha to verify you are not a robot.