How to stylize google search

[pol.bala]

I have used google custom site in website. But i dont want the default design of google custom search bar.i want to design with my custom psd file style. What can i do. Please help me.

[pritaeas]

You can just use CSS to style the form elements.

[pol.bala]

css to which attribute? Which value of css? can you give me an example please?

[EvolutionFallen]

You need to find out which classes/ids to style. Use firebug or some other browser developer tool to inspect the element you want to style, then check the class or ID and use CSS selectors to make the changes.

[JorgeM]

Google's CSE page allows you to do some styling, but as suggested above, when you put your page together, simply run through a search and view the results by looking at the source code (view source) by right clicking somewhere in the page. You'll find all of the elements there, there IDs and Classes. Then, just build your own custom CSS to target these elements with the styles that you choose.

A good example of customizing Google Custom Search Engine is here on this site. Try using at Daniweb's search feature. You will see that the page is customized to fit this site's design.

[pol.bala]

          <script>
  (function() {
    var cx = '016471833128044741709:svp5aakj9fw';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//www.google.com/cse/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>
<gcse:search></gcse:search>

this is the code... i need to make this stylize

[JorgeM]

I do not beleive that you may be understanding the recommendations in this thread. What you are showing in your post is the JavaScript for the CSE. When you integrate this into your page and run it, the page that is displayed will have several more elements that were created due to the response. Just view the source code. Once you see which elements where created and their associated ID and Classes, you can then go back to your source code for the search page you created and add a <style> section to that page, then add your custom styles.

Have you looked at the search page results on this site? That is a good example.

[pol.bala]

i got it. thank you