University of Southern California

ITS Information Technology Services

Building a Custom Results Page

ITS Web Services has developed javascript which parses results from USC's Google Site Search (GSS) and and presents them as CSS-tagged XHTML. This script requires jQuery. Site maintainers can design their own results pages and reference the javascript. The CSS tags allow designers to apply custom styles to their search results.

A working demo can be viewed at http://www.usc.edu/test/gss-json.

Procedure

  • Design your custom results page.

  • Create an empty div with the id 'searchResults' in the location where your results should appear:
    <div id="searchResults"></div>
    
  • Include the following script references at the bottom of the results page before the '</body>' tag:
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <script src="http://web-app.usc.edu/webapps/gss/jq.gss.actions.js"></script>
    
    (The jQuery reference is not necessary if you've already included it in the document head.)

  • Create a CSS stylesheet to define how elements of the search results will be displayed. A sample stylesheet is included in the example.
  • Last updated:
    September 5, 2012

    Web Publishing Documentation

    The use of all USC computing resources is governed by the USC Computing Policies.