A couple UI changes

August 17, 2006

One thing that's been on our list for a while now is changing the current UI for switching between one search result, more search results, and all search results. The new treatment uses three buttons that let you quickly select one, more, or all search results. Each button has "tool tip" style text that shows up on hover to help everyone learn the meaning of the buttons (note the tool tips are in English, but are in the localization queue).



We're still a v0.1 API and very much a work in progress. So these buttons may change again -- let us know what you think.



Another change you may have noticed is the little "x" next to the default search button that gives users a way to quickly clear results. Hopefully this will make things easier for those who have been writing custom UIs for clearing results.



Like most pieces of the API, you can use CSS if you'd prefer that these buttons not appear in your search control:


/* turn off the new results selector buttons */
#mySearchControl .gsc-results-selector { display : none; }


/* turn off the new clear results button */
#mySearchControl .gsc-clear-button { display : none; }

On a related note, I'd strongly recommend learning how to develop on Firefox and make use of DOM Inspector. With it you can "inspect" any page, and then "inspect" a node (like a button or piece of text). DOM Inspector will allow you to see where the element sits in the page's DOM Tree, what CSS rules apply to the element, the computed style for the element, etc.