How to Redirect a Search Form to a Site-Scoped Google Search

Avatar of Chris Coyier
Chris Coyier on

This is just a tiny little trick that might be helpful on a site where you don’t have the time or desire to build out a really good on-site search solution. itself can perform searches scoped to one particular site. The trick is getting people there using that special syntax without them even knowing it.

Make a search form:

<form action="" target="_blank" type="GET">

     Search CSS-Tricks on Google: 
     <input type="search" name="q">

  <input type="submit" value="Go">


When that form is submitted, we’ll intercept it and change the value to include the special syntax:

var form = document.querySelector("form");

form.addEventListener("submit", function (e) {
  var search = form.querySelector("input[type=search]");
  search.value = " " + search.value;

That’s all.