Thank you for the help!
I found this tutorial:
http://www.newtechie.com/2011/11/how-to-add-google-custom-search-to.html#axzz1fmuG5yr5
Which uses the Two Page layout method. I get a 404'd when I tried getting it to work.
Here is my latest attempt, that isn't working, at removing the Thematic loop and adding the google code within the functions.
// remove the standard search loop
function remove_search_loop() {
remove_action('thematic_searchloop', 'thematic_search_loop');
}
add_action('wp', 'remove_search_loop');
// create your own search loop
function my_search_loop() {
// Your content goes in here
<?php if ( have_posts() ) : ?>
<div id="cse" style="width: 100%;">Loading</div>
<script src="//www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
function parseQueryFromUrl () {
var queryParamName = "s";
var search = window.location.search.substr(1);
var parts = search.split('&');
for (var i = 0; i < parts.length; i++) {
var keyvaluepair = parts[i].split('=');
if (decodeURIComponent(keyvaluepair[0]) == queryParamName) {
return decodeURIComponent(keyvaluepair[1].replace(/\+/g, ' '));
}
}
return '';
}
google.load('search', '1', {language : 'en', style : google.loader.themes.MINIMALIST});
google.setOnLoadCallback(function() {
var customSearchControl = new google.search.CustomSearchControl(
'XXXXXXXXXXXXXXXXXXXXXX');
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
customSearchControl.draw('cse');
var queryFromUrl = parseQueryFromUrl();
if (queryFromUrl) {
customSearchControl.execute(queryFromUrl);
}
}, true);
</script>
<?php endif; ?>
add_action('thematic_searchloop', 'my_search_loop');