UNFORTUNATELY Google has change the game plan on everyone. In order to put a google search box on a website it used to go into a <form> tag. You could then use CSS to alter the look of it. NOT ANYMORE. Now you get a generated js script that automatically puts in a search box that looks terrible. You put these tags " <gcse:search></gcse:search
> " where you what the box to appear in your code. Since the code is generated by google it cannot be altered. Simply replacing the cx in the old form tag will not work. Google does not want people to use the form tags anymore, and tried as I did I could not get the form tag format to work with google's new js code.
The only way I can think of to over ride the terrible look of the google box is do so in CSS. HOWEVER...big problem. I looked all over the web and cannot find an example or list of the code/css that is being generated between the google <gcse:search></gcse:search
> " tags. Without knowing the code or class generated in the behind code there is no way to change it to something that looks nice. Google only offers result display choices. They do not offer box choices.
Do you know of any code examples of what is being generated, or where I could get a list of the CSS class or code that I can use to make the box look decent?
Here is the old style form tag that google does not use anymore:
<!-- <label for="search_local_textfield" accesskey="s" class="hidden">Search this site: </label> -->
<input type="text" name="q" id="search_local_textfield" class="search-textfield" size="35" autocomplete="off" value="Search" onfocus="if(this.value=='Search')this.value=''" onblur="if(this.value=='')this.value='Search'" />
<input type="hidden" name="cx" value="017201984285415750805:ypbrseilgxg" /> <!-- Update this value with your search engine unique ID. Submit a request to the OTech Service Desk if you don't already know your unique search engine ID. -->
<input type="hidden" name="ie" value="UTF-8" />
<input type="hidden" name="nojs" value="1" />
Here is the new style of code generated by google that can't be altered:
var cx = '007869872437826671579:4lzit-stmto';
var gcse = document.createElement('script');
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script');