954,600 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

Passing Seach Queries to Google Custom Search

Hello Everyone,

I have chosen to use Google Custom Search with my website and was given the following code, my question is, how can i pass a search query from my homepage which has a standard form on there to the search page which holds this code?

I am given a search box within this code but would prefer to use my own on the homepage...

Thanks

<div id="cse" 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('001427157132748787903:rmvstkwg_s4');
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    customSearchControl.draw('cse');
  }, 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: Verdana, sans-serif;
    border-color: #070707;
    background-color: #070707;
  }
  input.gsc-input {
    border-color: #2A2A2A;
  }
  input.gsc-search-button {
    border-color: #63D03B;
    background-color: #37831C;
  }
  .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: #37831C;
  }
  .gsc-tabsArea {
    border-color: #E9E9E9;
  }
  .gsc-webResult.gsc-result {
    border-color: #070707;
    background-color: #070707;
  }
  .gsc-webResult.gsc-result:hover {
    border-color: #070707;
    background-color: #070707;
  }
  .gs-webResult.gs-result a.gs-title:link,
  .gs-webResult.gs-result a.gs-title:link b {
    color: #237F03;
  }
  .gs-webResult.gs-result a.gs-title:visited,
  .gs-webResult.gs-result a.gs-title:visited b {
    color: #237F03;
  }
  .gs-webResult.gs-result a.gs-title:hover,
  .gs-webResult.gs-result a.gs-title:hover b {
    color: #FFFFFF;
  }
  .gs-webResult.gs-result a.gs-title:active,
  .gs-webResult.gs-result a.gs-title:active b {
    color: #237F03;
  }
  .gsc-cursor-page {
    color: #237F03;
  }
  a.gsc-trailing-more-results:link {
    color: #237F03;
  }
  .gs-webResult .gs-snippet {
    color: #FFFFFF;
  }
  .gs-webResult div.gs-visibleUrl {
    color: #237F03;
  }
  .gs-webResult div.gs-visibleUrl-short {
    color: #237F03;
  }
  .gs-webResult div.gs-visibleUrl-short {
    display: none;
  }
  .gs-webResult div.gs-visibleUrl-long {
    display: block;
  }
  .gsc-cursor-box {
    border-color: #070707;
  }
  .gsc-results .gsc-cursor-page {
    border-color: #E9E9E9;
    background-color: #070707;
  }
  .gsc-results .gsc-cursor-page.gsc-cursor-current-page {
    border-color: #FF9900;
    background-color: #37831C;
  }
  .gs-promotion {
    border-color: #336699;
    background-color: #FFFFFF;
  }
  .gs-promotion a.gs-title:link,
  .gs-promotion a.gs-title:link *,
  .gs-promotion .gs-snippet a:link {
    color: #237F03;
  }
  .gs-promotion a.gs-title:visited,
  .gs-promotion a.gs-title:visited *,
  .gs-promotion .gs-snippet a:visited {
    color: #237F03;
  }
  .gs-promotion a.gs-title:hover,
  .gs-promotion a.gs-title:hover *,
  .gs-promotion .gs-snippet a:hover {
    color: #FFFFFF;
  }
  .gs-promotion a.gs-title:active,
  .gs-promotion a.gs-title:active *,
  .gs-promotion .gs-snippet a:active {
    color: #237F03;
  }
  .gs-promotion .gs-snippet,
  .gs-promotion .gs-title .gs-promotion-title-right,
  .gs-promotion .gs-title .gs-promotion-title-right *  {
    color: #FFFFFF;
  }
  .gs-promotion .gs-visibleUrl,
  .gs-promotion .gs-visibleUrl-short {
    color: #237F03;
  }
</style>
BlueCharge
Light Poster
47 posts since Jan 2010
Reputation Points: 10
Solved Threads: 1
 

the google search is "google search api"

almostbob
Posting Sensei
3,149 posts since Jan 2009
Reputation Points: 571
Solved Threads: 376
 

I can't see that you would want the Google control to be part of your own form, which will submit to a different (non-Google) server.

In fact, as far as I can tell, you positively shouldn't try to merge the two.

However, you can adapt the code you were given to incorporate it into your layout:Change <div id="cse" ...>Loading</div> to an HTML element of your choice eg. table cell <td id="cse">Loading</td> or paragraph <p id="cse">Loading</p> . It may also work with an inline span <span id="cse">Loading</span> . Make sure there is only ever one element with id="cse" .
Adapt the CSS to give the control the appearance you desire.
But always with the Google control outside your own form.

Airshow

Airshow
WiFi Lounge Lizard
Moderator
2,683 posts since Apr 2009
Reputation Points: 321
Solved Threads: 372
 

I can't see that you would want the Google control to be part of your own form, which will submit to a different (non-Google) server.

In fact, as far as I can tell, you positively shouldn't try to merge the two.

However, you can adapt the code you were given to incorporate it into your layout:

  • Change <div id="cse" ...>Loading</div> to an HTML element of your choice eg. table cell <td id="cse">Loading</td> or paragraph <p id="cse">Loading</p> . It may also work with an inline span <span id="cse">Loading</span> . Make sure there is only ever one element with id="cse" .
  • Adapt the CSS to give the control the appearance you desire.

But always with the Google control outside your own form.

Airshow


Thank you all for your replies but I dont think you get what i mean. I have one search form on my homepage which fits with my site template. I want what ever is types into here passed to the search.php page by maybe using the GET method and then for the google search code (Posted above) to search for what ever is in the GET method however, if there is not anything in the GET method then it will just display the seach box on the search page which it does already.

Thank you,

Also sorry if my English is not great.

BlueCharge
Light Poster
47 posts since Jan 2010
Reputation Points: 10
Solved Threads: 1
 

This article has been dead for over three months

Post: Markdown Syntax: Formatting Help
You
View similar articles that have also been tagged: