Introducing Custom Search Element v2

Custom Search Engine (CSE) allows you to incorporate rich search functionality into your website. You do this by adding specific HTML markup - known as the Custom Search element - to web pages on your site. The Custom Search element renders a search experience (search boxes and results pages) on your site’s pages. By controlling the placement of the Custom Search element on your pages and configuring your CSE settings, you can create customized layouts that are tuned for the look-and-feel of your website.

We’re happy to announce today a new, improved version of the Custom Search element. Here are some of the key highlights and improvements of what we call Custom Search element v2.

• Search UI is rendered based on the settings stored on the Google CSE servers. This means that any configuration changes you make in the CSE control panel will automatically be reflected on your web pages the next time they reload. You no longer need to copy-and-paste new element code into your website when you modify your CSE using the control panel.


• All element code is loaded asynchronously for reduced page load times.


• Client-side customization allows you to overwrite global CSE settings on a per-page basis. For example, you can enable search history, disable auto search on page load, configure different Google Analytics parameters, and more. Customization is done through an easy-to-use HTML syntax which does not require any Javascript knowledge.

To start using Custom Search element v2 on your website, go to the “Get code” section of the CSE control panel and follow the instructions shown there.

We’ll continue to support older versions of the Custom Search element for the time being but encourage you to update your CSE implementation to take advantage of the improvements.

Posted by Ying Huang, Software Engineer