How to Create a Site Search on a Website
One of the most important navigation elements a website should have is a search field. Usability studies have confirmed that a significant portion of users will use search as the primary means of navigating through a site--so called "search-oriented users." Implementing a search on your website is very simple if you take advantage of existing tools, and it takes very little technical knowledge. Google's proven search engine is popular because of its functionality, but there are also some alternative tools that can be used just as easily.
Instructions
-
Sign up for a Google Account
- 1
-
2
Go to google.com/coop/manage/cse/create/1. From here you will be able to sign up for Google's Custom Search. Fill out the form by creating a name and description for the search engine, entering the name and the web address of the website you want to be searched. This service is ad-supported, so if you want an ad-free search you need to upgrade to a $100-a-year business account.
-
-
3
Once you've submitted the form, you will be taken to a screen where you can test the search. You can then go and manage your search engine you just created by clicking "finish," which will take you to the account management page. Next to the Custom Search engine you just created, click the "control panel" link to find the code you need to add to your website to implement search.
-
4
Decide where to place the search field on your website. The traditional placement is in the upper right-hand corner of the page, and most users will expect to find it here.
-
5
Depending on how your site has been built, you may need to only edit one file or you may need to edit many. The most important page to add search to, however, is the home page, so open the index.html file at the root of your web server with a text editor or website editing program.
- 6
An Alternative Search Tool
-
7
If you want to use a search tool that feels a bit more integrated into your system and don't care for Google's brand appeal, there are other free search code alternatives to consider. Sikbox allows you to add search functionality much like that found on apple.com to your website. Go to sikbox.com to get started
- 8
-
9
You will be prompted for your name and email. Upon entering this information, you will be taken to a screen where you can customize the look and feel of your search box.
-
10
Copy the code snippet and open your website's index.html file (the home page) and add the snippet to the HTML element you want the search field to appear in.
Tips & Warnings
Having well-formed titles and header tags on your website will ensure that the Google Custom Search engine can index your site better. Make sure that every page has a different title in the <title> HTML element to ensure this. This will also increase your website's visibility on the main google.com search engine, so it is well worth it. Google's Custom Search is but one of many free search tools out there, but it is probably the most familiar and one of the most powerful options available.
This guide requires that you have a basic knowledge of HTML and access to a website as an administrator. Google's Custom Search is ad-supported unless you pay for the business version. This means you will see ads in line with other search results much like you do on a traditional Google search. Google has a user license agreement that you may want to look over before using Custom Search.
Resources
- Photo Credit Google Inc.