Simplicity and speed are two principles we love when it comes to design at Google. Today, we’re excited to announce the new CSE layout that displays results in an overlay, on top of any content on your page.
What this means for developers:
- Takes seconds to create. We simplified the creation interface to get you going faster.
- One snippet for search box and results. Place it where you want your search box to appear.
- Powerful features now come by default: autocomplete, image thumbnails and results sorting.
What this means for your users:
- Uninterrupted browsing experience.
- Faster, more simple search means more chances for your users to discover great content from your site.
You may visit W3Schools to see the new layout in action or use the CSE below which searches our blog.
Try out the new layout by creating a new search engine. It takes less than a minute. Once you have your search engine snippet ready, simply paste it on your website.
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.
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
As we continue to improve the look and feel
of Google Custom Search Engine (CSE), today we’re announcing a change in how ads are displayed on CSE search results pages.
Currently ads in CSE results are shown in a separate section from organic search results labeled “Ads by Google”. With this latest change, the ads section will also have a distinct background color, in keeping with the visual style of ads on the google.com
search results page.
Because CSE allows you to choose from one of several built-in styles
, the ads background color is different for each style to contrast in a visually appealing way with the default background color. (Note that if you customize the main background color, the ads background color will automatically match it to avoid clashing.)
The following screenshots illustrate what a user performing a custom search on a website might see, for two of the built-in CSE styles.
This change in design provides users another way to distinguish ads in CSE search result pages.
CSE publishers will see these changes effective immediately. As always, please let us know any questions or feedback in our discussion forum
Posted by MyLinh Yang, Product Manager