Hello, this is a question about installing the custom google search form on my child theme. I know there is a plugin for this, but I'd really rather learn a full-fledged install. The sandbox website is http://www.tod7.com
I've inserted the search form in the primary widget, but I can't get the results to post regardless of the current page. Right now, it only works in the 'google search' page (created at the direction of this tutorial. Any idea on how to post results on all pages?
These are the steps I took:
1) created the empty files: googlesearch.php & searchform.php in my child theme.
2) copied the 'google search form script' & pasted it into searchform.php.
I named this template -------> /* Template Name: google search */
3) created a page called 'google search'. (I'll figure out how to hide this page from the menu later.) From the page attributes, I selected the 'google search' template I created and published the page.
4) copied the 'google search results code' & pasted it into googlesearch.php.
--- searchform.php looks like this:
<?php
/**
* Search Form Template
*
* The search form template displays the search form.
*
* @package Hybrid
* @subpackage Template
*/
global $search_num;
++$search_num;
?>
<!-- begin google search form script -->
<div id="cse-search-form" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
google.load('search', '1', {language : 'en'});
google.setOnLoadCallback(function(){
var customSearchControl = new google.search.CustomSearchControl('004434025131216544725:bdr6-epupe8');
customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
var options = new google.search.DrawOptions();
options.setSearchFormRoot('cse-search-form');
customSearchControl.draw('cse', options);
}, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />
<style type="text/css">
.gsc-control-cse {
font-family: Arial, sans-serif;
border-color: #336699;
background-color: #FFFFFF;
}
input.gsc-input {
border-color: #BCCDF0;
}
input.gsc-search-button {
border-color: #666666;
background-color: #CECECE;
}
.gsc-tabHeader.gsc-tabhInactive {
border-color: #E9E9E9;
background-color: #E9E9E9;
}
.gsc-tabHeader.gsc-tabhActive {
border-top-color: #FF9900;
border-left-color: #E9E9E9;
border-right-color: #E9E9E9;
background-color: #FFFFFF;
}
.gsc-tabsArea {
border-color: #E9E9E9;
}
.gsc-webResult.gsc-result {
border-color: #FFFFFF;
background-color: #FFFFFF;
}
.gsc-webResult.gsc-result:hover {
border-color: #FFFFFF;
background-color: #FFFFFF;
}
.gs-webResult.gs-result a.gs-title:link,
.gs-webResult.gs-result a.gs-title:link b {
color: #0000CC;
}
.gs-webResult.gs-result a.gs-title:visited,
.gs-webResult.gs-result a.gs-title:visited b {
color: #0000CC;
}
.gs-webResult.gs-result a.gs-title:hover,
.gs-webResult.gs-result a.gs-title:hover b {
color: #0000CC;
}
.gs-webResult.gs-result a.gs-title:active,
.gs-webResult.gs-result a.gs-title:active b {
color: #0000CC;
}
.gsc-cursor-page {
color: #0000CC;
}
a.gsc-trailing-more-results:link {
color: #0000CC;
}
.gs-webResult.gs-result .gs-snippet {
color: #000000;
}
.gs-webResult.gs-result .gs-visibleUrl {
color: #008000;
}
.gs-webResult.gs-result .gs-visibleUrl-short {
color: #008000;
}
.gsc-cursor-box {
border-color: #FFFFFF;
}
.gsc-results .gsc-cursor-page {
border-color: #E9E9E9;
background-color: #FFFFFF;
}
.gsc-results .gsc-cursor-page.gsc-cursor-current-page {
border-color: #FF9900;
background-color: #FFFFFF;
}
.gs-promotion.gs-result {
border-color: #336699;
background-color: #FFFFFF;
}
.gs-promotion.gs-result a.gs-title:link {
color: #0000CC;
}
.gs-promotion.gs-result a.gs-title:visited {
color: #0000CC;
}
.gs-promotion.gs-result a.gs-title:hover {
color: #0000CC;
}
.gs-promotion.gs-result a.gs-title:active {
color: #0000CC;
}
.gs-promotion.gs-result .gs-snippet {
color: #000000;
}
.gs-promotion.gs-result .gs-visibleUrl,
.gs-promotion.gs-result .gs-visibleUrl-short {
color: #008000;
}
</style>
<!-- end google search form script -->
And googlesearch.php looks like this:
<?php
/*
Template Name: google search
*/
get_header(); ?>
<div class="hfeed content">
<?php hybrid_before_content(); // Before content hook ?>
<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
<div id="post-<?php the_ID(); ?>" class="<?php hybrid_entry_class(); ?>">
<?php hybrid_before_entry(); // Before entry hook ?>
<div class="entry-content">
<!-- begin google search results code -->
<div id="cse" style="width:100%;"></div>
<!-- end google search results code -->
</div><!-- .entry-content -->
<?php hybrid_after_entry(); // After entry hook ?>
</div><!-- .hentry -->
<?php hybrid_after_singular(); // After singular hook ?>
<?php comments_template( '', true ); ?>
<?php endwhile; ?>
<?php else: ?>
<p class="no-data">
<?php _e( 'Sorry, no page matched your criteria.', 'hybrid' ); ?>
</p><!-- .no-data -->
<?php endif; ?>
<?php hybrid_after_content(); // After content hook ?>
</div><!-- .content .hfeed -->
<?php get_footer(); ?>
Thank you.