Set up a Google Custom Search Engine for your IU website
On this page:
- Overview
- Request a Google Custom Search Engine
- Set up your Custom Search Engine
- Add your Custom Search Engine to your website
- Edit your Custom Search Engine
- Delete a Custom Search Engine
Overview
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 without fee as part of the Google at IU service.
Request a Google Custom Search Engine
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 (for example,
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
box, and then select . The Google at IU administrator will notify you when your Custom Search Engine is ready.Set up your Custom Search Engine
- Go to Google Custom Search Engine. If you're not already logged into Google at IU with your department's shared Google account, select , and then log in through IU Login and Two-Step Login (Duo) using the group account credentials associated with your department's shared Google account.
- Under "Edit search engines", find the search engine you created, and select its name.
- On the page, on the 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, select .
- From the menu on the left, choose
- On the tab, you can select one of the provided design themes.
- On the tab, you can choose the fonts and colors that are used in search engine elements (for example, search box, search button, and search results).
- On the 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.
and use the provided tabs to customize your search engine's appearance:
- When you're finished with changes, select .
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 selecting
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
cx
will be a unique ID specific to your search engine):<script> (function() { var cx = 'your_search_engine_ID'; var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true; gcse.src = 'https://cse.google.com/cse.js?cx=' + cx; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s); })(); </script> <gcse:search></gcse:search>
Copy the generated code, and then paste it into a single <div> element in the body of your web page(s).
layout and selecting 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 - Two page: Choosing the
cx
will be a unique ID specific to your search engine):<script> (function() { var cx = 'your_search_engine_ID'; var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true; gcse.src = 'https://cse.google.com/cse.js?cx=' + cx; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s); })(); </script> <gcse:searchbox-only></gcse:searchbox-only>
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:
<gcse:searchbox-only resultsUrl="search_results_url"></gcse:searchbox-only>
Back on the "Get code for search box" page, select
(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:
- On either the "Get code for search box" or "Get code for search results" page, select (above the text/code box).
- 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 toquery
.) - Select .
layout and selecting 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
For more about Custom Search elements, see Google's Custom Search Element Control API page.
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 Google Custom Search Engine 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 at edshelp@iu.edu.
Delete a Custom Search Engine
To delete a Google Custom Search Engine, email the Google@IU administrator at edshelp@iu.edu.
This is document bckj in the Knowledge Base.
Last modified on 2023-11-29 14:15:03.