Applying Styles to Search Results

We have always strongly supported those of you wishing to re-style AJAX search results. Each search result contains a number of properties (like title, visible url, snippet, etc.), as well as a standard .html property. Note: while it's ok to re-style a search result, it is not ok to change the search result values (e.g., its not ok to replace a Google delivered url of http://www.vw.com/gti/ with http://please-click-on-this-virus-url.com).

One way to get the look and feel that you need is to build your own representation of a search result using the result's core properties. This is the technique that we use in the News Bar, the Video Bar, the Map Search Control, etc.

Another very powerful approach is to use the .html property either standalone, or in conjunction with the core Search Control, and then use customized CSS rules to re-style the .html node. Using this approach you can select fonts, colors, spacing, visibility, borders, etc. We stil advocate using Firefox's DOM Inspector or the Firebug Extension to get a feel for the DOM structure of a result. In addition, this morning, we published the skeleton format of each search result type. This should help those of you that are not fluent in DOM Inspector or Firebug.

As always, let us know what you think in the AJAX Search API developer forum. If this documentation style is a helpful way for you to learn about the DOM structure of a search result, we will use the same approach to document the DOM structure of the various search controls.

And finally, I know many of you are working hard to extend the Map Search Control. In an effort to make your attempts at this more robust and reliable, this morning, we published a formal mechanism (and sample) that you can use to gain access to the GMap2 objects that are at the heart of this control.