Set up a Google Custom Search Engine for your IU website

At Indiana University, you can use Google Custom Search to help people find the information they need on your website(s). You can add a Google Custom Search Engine to your web page(s) by copying and pasting a few lines of HTML, CSS, and JavaScript. You can configure your Custom Search Engine to search whatever site(s) you want, even sites you don't own. People who use the Google Custom Search box on your website will see search results from only the site(s) you choose.

At IU, you can use Google Custom Search on your website free of charge as part of the Google at IU service.

On this page:


Request a Google Custom Search Engine

Note:
To create and administer your department's Google Custom Search Engine(s), UITS recommends using one of your department's group accounts to create a shared Google at IU account. Using a single shared Google at IU account to create, own, and manage your department's Custom Search Engine(s) saves you the inconvenience of managing multiple Google accounts, and simplifies the reassignment of search engine duties whenever staff and roles change within your department.

To request a Google Custom Search Engine for use with your IU website, fill out and submit the Google@IU Custom Search Engine Request form.

On the form, you must provide the following information:

  • Name: Enter your full name (first and last name).
  • Email address: Enter the IU group account email address used to create your department's shared Google at IU account.
  • Phone number: Enter the phone number of a contact person whom the Google at IU administrator can call if any questions or problems arise.
  • Username(s) of CSE administrator(s): Enter the IU username (or usernames, comma-separated) of the individual(s) to whom you want to grant administrative rights to your Custom Search Engine.
  • "Friendly" name for CSE: Enter a name to identify this search engine (e.g., Deathstar.org search) from others your department has created or may create in the future.
  • URL of search site: Enter the URL of an initial website to add to the Custom Search Engine (you can add more websites later).

When you're finished, enter your name in the SIGN HERE box, and then click Submit. The Google at IU administrator will notify you when your Custom Search Engine is ready.

Set up your Custom Search Engine

  1. Go to Google's Custom Search page. If you're not already logged into Google at IU with your department's shared Google account, click Sign in To Custom Search Engine, and then log in via CAS and Two Step Login (Duo) using the group account credentials associated with your department's shared Google account.
  2. Under "Edit search engines", find the search engine you created, and click its name.
  3. On the Setup page, on the Basics tab, you can change the name of your search engine, add a description and keywords, and list the URLs of the websites you want the search engine to search. When you're finished making changes, at the bottom of the page, click Update.
  4. From the menu on the left, click Look and feel and use the provided tabs to customize your search engine's appearance:
    • On the Themes tab, you can select one of the provided design themes.
    • On the Customize tab, you can choose the fonts and colors that are used in search engine elements (e.g., search box, search button, and search results).
    • On the Layout tab, you can choose one of several layouts that display the search box and search results on the same web page, or choose the layout for displaying the search box and search results on separate pages.
  5. When you're finished with Look and feel changes, click Save & Get Code.
Important:
Once you add your Custom Search Engine to your website, you can apply your site's CSS rules to customize it further. However, to comply with the university's agreement with Google, do not use CSS to remove/hide Google branding from your search results. The light gray "powered by Google Custom Search" text is a standard component that cannot be altered in the search engine's control panel. Although the text can be hidden using CSS, UITS requests that you honor its agreement with Google and refrain from doing so. Also, UITS recommends not using a gray background for your search pages (most IU-affiliated search pages have white backgrounds). The Google logo is an image, and its appearance cannot be changed.

Add your Custom Search Engine to your website

The process of embedding Custom Search components (your search box and search results) in your web page(s) involves copying the code you generated by clicking Save & Get Code at the end of the previous section, and pasting it into the HTML of your web page(s). The exact steps you take will depend on the layout you choose. Following are instructions for one of the one-page layouts and the two-page layout.

  • Overlay: Choosing the Overlay layout and clicking Save & Get Code generates code for displaying the search results as an overlay on the same page as the search box. The generated code will look similar to this (the value for cx will be a unique ID specific to your search engine):

    Copy the generated code, and then paste it into a single <div> element in the body of your web page(s).

  • Two page: Choosing the Two page layout and clicking Save & Get Code generates code for displaying your search box and search results on separate pages. The generated search box code will look similar to this (the value for cx will be a unique ID specific to your search engine):

    Copy the generated code and paste it into a <div> element in the body of the web page(s) where you want your search box to be displayed. To specify the URL of your search results page, add the resultsUrl argument to the <gcse:searchbox-only> element; for example:

    Back on the "Get code for search box" page, click Next: Get code for search results (beneath the text/code box). On the resulting "Get code for search results" page, copy the generated code and paste it into a <div> element in the body of your search results page.

    Note:

    Alternatively, you can specify the URL of your search results page without manually adding it to your search box code:

    1. On either the "Get code for search box" or "Get code for search results" page, click Search Results Details (above the text/code box).
    2. In the resulting window, enter the complete URL of your search results page. (In the "Specify the query parameter name embedded in the URL" field, either leave the default q or, optionally, change it to query.)
    3. Click Save.

For more about Custom Search elements, see Google's Custom Search Element Control API page.

Note:
Google Custom Search also has a JSON/Atom API you can use to develop websites and applications that query your Custom Search Engine and retrieve search results in JSON or Atom format. Use of the JSON/Atom Custom Search API is free for up to 100 queries per day, but any usage beyond the free quota will result in charges being assessed. For this reason, UITS recommends using the JavaScript API.

Edit your Custom Search Engine

To edit the name, description, websites to search, and/or the look and feel options of your Custom Search Engine, return to the Google Custom Search page and follow the steps (as needed) from the Set up your Custom Search Engine section, above.

To add or remove search engine administrators, email the Google@IU administrator.

Delete a Custom Search Engine

To delete a Google Custom Search Engine, email the Google@IU administrator.

This is document bckj in the Knowledge Base.
Last modified on 2018-08-21 12:20:30.

Contact us

For help or to comment, email the UITS Support Center.