Simple Site Search

  • form
  • google
  • html
  • site search
Jan 21, 2025
How to make a Google Site Search like on deno.com

I recently learned by using the site search on deno.com that you can search specific sites on Google by including site:example.com in your search. For example, I can search for the term “html” on my blog with this search entry.

html site:blog.robino.dev

Their implementation is very simple and can be used on any indexed site. Here’s how you can implement a simple search feature on your site using an HTML form.

Create an HTML form that performs a get request to google.com/search. The <form> will have two <input> elements that have name=q attributes. The first will be input for th user’s search, and the second will be a hidden input with the value attribute set to "site:..." - the site you want to search. These will be used by the browser to create the URL string.

<form action="https://google.com/search" method="get">
	<input type="search" name="q" placeholder="Search blog.robino.dev" />
	<input type="hidden" name="q" value="site:blog.robino.dev" />
</form>

For example, when you search for “html”, the form would create a get request to:

https://www.google.com/search?q=html&q=site%3Ablog.robino.dev

You can try it out below:

Indexed pages only

If you have pages that are not indexed on Google, they will not appear in the search. Be sure to register your site on the Google Search Console to ensure it gets indexed properly. Pages that exist behind authentication will not be able to be searched using this method.

Thanks for reading!


Edit