In June 2011, Google's Custom Search team announced some new options for displaying search results. Overall these are a step forward, but they do include removing the "iframe" option which, until now, has been the only way that Blogger users who implemented a custom-search could display the search-results inside their blog.
As a result, Blogger users who used the CSE i-frame display option need to upgrade to one of the new displays. This can be done now - it's not clear how much longer the iframe-based code will work for.
Also, Blogger users who don't currently have a custom-search in their blog but want to install one have some new options to choose from, as described in the New CSE Display Options.
What's happened for existing Custom Search Engines
If you already have a Custom Search Engine (CSE), you manage it by logging in to the CSE control panel. If you have been using the iframe option and you go to the look-and-feel tab now, there is a new message like this:
It says:
Deprecation warning: The Iframe option is deprecated. We recommend the "Two page" or "Results only" layouts in the Search element as the new options. Please refer to our developer guide for a complete list of layout options."Depreciated" is web-developer speak for "we don't like this, and one day we will stop supporting it and wll do some new feature that makes it break". In short, "we don't apprecaite this any more".
In short, the new message is saying that the iframe option will work for now, but you will need to change to use something else sooner or later.
New CSE results display options
Instead of the iframe option, Blogger users need to choose one of the options that are based on Google web-elements. Choose Search-element under Hosting Options and you will be shown the new display options, which are:
- Full-width - The search box and search results take up the whole width of the place(post, page or gadget) where you put the Search element.
- Compact - Like the full-width option, this takes up the the entire width of the page or column, but the results section shows fewer results, so it takes up less vertical space. Google say that "this option is optimized for mobile devices, so it works well on Android, iPhone, or Palm webOS devices."
- Two Column - The search box and the search results section are in places in your webpage, and to leave the search results section, a user must click on the X icon next to the search box.
- Two Page - The search box and the search results are placed in two different places (posts, pages or gadgets). In this option, the search results section also has search box, so visitors can submit further queries directly in the search results page.
- Results Only - Search results are shown in the place (post or gadget) where you put them - but Google CSE doesn't give you a search box, you need to make your own.
- Google-Hosted - CSE gives you the code for a search-box, and you put this into a post or gadget. But then someone clicks search, they are taken to a Google-hosted webpage outside fo your blog, which can be opened either in the same window or in a new window.
How to install these into blogger
Follow these steps to choose one of the new display options, for either a new or existing Google Custom Search Element that is used in Blogger:
1) From the Custom-Search-Elements, choose Control Panel, and then choose Look and Feel.
3) Scroll to the bottom of the page, and click Save and Get Code
4) Install the code into your blog in the way specified by the option you chose: some options have code for place where you want the search box and where you want the resutls, while others only have code for one of these.
How well do each of the options work with Blogger:
Full-width and Compact:
These options both display their results well inside blogger. However the search-box is only shown on the same page as the results, so either
- You need to put the search-element into a gadget that is visible the whole time, or
- Searching your site becomes a two click process (on click to get to the search box, one to run the search), which will confuse some users.
But the search results look good - although the ads at the top blend very strongly into the results.
Two-column:
This option does not currently appear to work with Blogger (at least not when I tested it under Firefox 4 / MS Windows XP)
Two-page:
Inside Blogger, this appears very similar to the way that the iframe-results display worked: to install the code, you need to say what page or post the results will appear on, and then you are given specific code to put into each of:
- The place (gadget or page or post) where the search-box goes. and
- The place (gadget, post or page) where the results go.
Results only:
Again, inside Blogger, the results-only option is very similar to the Two-page option, with some key differences:- There is no search-query bar at the top of the place (post, page, gadet) where the results are displayed, and
- You need to make your own search query form and to call the search from it.
NB Having to make your own search-query may seem difficult, but there is a very simple way to do this, by using CSE itself to build the search-box code for you:
- Choose the two-page option
- Enter the URL of the post or page where you want the results to appear
- Click Save and get code
- Copy the code that you are told to install into where you'd like the search box to appear.
- Paste that code into the appropriate gadget, post or page
- Go back to the Look and Feel tab in CSE
- Choose the results-only option
- Click Save and get code
- Copy the code that you are told to install into where you'd like the results to appear.
- Paste that code into the gadget, post or page where you want to put the search results
Google-hosted
I have not investigated this option, because I want to have the search-results right inside my blog.
Related Articles:
Putting a Google Search Engine into your blog
Setting up AdSense for your Blog
Blogger-Helpers-Search-Tool - a customised search of high-quality sites
Installing HTML into your blog
