Customizing Search Results

  • Customize search results element with additional options likedefaultToImageSearch.

  • To usedefaultToImageSearch, enable Image Search in the Control Panel and add the attribute to the search results div.

  • Settingdata-defaultToImageSearch="true" makes the image search tab the default when searching.

  • More search results customization options are available in the Programmable Search Element Control API documentation.

In a similar way to customizing search box, you can add additional options to the search results element.

For example, in order to change our search engine from webresults-basedto image-based, we can utilize thedefaultToImageSearch attribute.

First of all, you need to enable Image Search in theControl Panel for your search engine. In theSetup section, inBasics tab, click theImage search option into the "on" position. After that, add thedefaultToImageSearch attribute to the<div class="gcse-searchresults"></div> element on your website.

<!-- Insert your own Programmable Search Engine ID here --><script async src="https://cse.google.com/cse.js?cx=017643444788069204610:4gvhea_mvga"></script><!-- Try switching the attribute value to "true" or "false" -->
<div></div><div data-defaultToImageSearch="true"></div>

Now, when you search for something, the image search tab is showing as a default.

There are many more options available. You can read about other search results customization options inProgrammable Search Element Control API section.

Next...

Continue toNext steps.

Except as otherwise noted, the content of this page is licensed under theCreative Commons Attribution 4.0 License, and code samples are licensed under theApache 2.0 License. For details, see theGoogle Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.

Last updated 2024-08-21 UTC.