Google AJAX search API integration

Just in case…

I subscribed to get an API key

Then I struggled a little bit, from the “Hello World” example they give, and came up with this:

<div id="gajax">
			   <script src="https://www.google.com/jsapi?key=MY-KEY-XXXXXXXXXX"></script>

    <script language="Javascript" type="text/javascript">
      google.load('search', '1.0');

      function OnLoad() {

        // create a tabbed mode search control
        var tabbed = new google.search.SearchControl();

			tabbed.addSearcher(new google.search.VideoSearch());
 			tabbed.addSearcher(new google.search.WebSearch());
			tabbed.addSearcher(new google.search.NewsSearch());
			tabbed.addSearcher(new google.search.ImageSearch());

        // draw in tabbed layout mode
        var drawOptions = new google.search.DrawOptions();
        drawOptions.setDrawMode(google.search.SearchControl.DRAW_MODE_TABBED);
        tabbed.draw(document.getElementById("search_control_tabbed"), drawOptions);

        tabbed.execute("<?php the_title(); ?>");
      }
      google.setOnLoadCallback(OnLoad, true);

    </script>
    <div style="float: right;" class="search-control" id="search_control_tabbed">Loading</div>
</div>

In a custom NextGen gallry template (gallery-gs.php) that I can call with “template=gs” as a parameter to my gallery tag.

This can be used within a page or post template I guess.

…which displays something close to this:
https://www.google.com/uds/samples/apidocs/tabbed.html
With different search options, that I display kinda like a sidebar to my gallery, based on the page title (an actor name in this case).

I’m still struggling with styling; didn’t really get how you overwrite Google’s default css styling.

Also I wanted to hide the search box, and found this:
https://googleajaxsearchapi.blogspot.com/

…but I couldn’t really find where/how to throw these lines into the above code without breaking the whole thing.