Open Source Ecology Forums

elifarley

We have a Google custom search field at the right bottom corner of the forum pages, so that people can search for content from our sites (wiki, forum, blog) and related sites.

When you type your query and click "Search", you're taken to another page. Example:

- Type "biomimicry" (without quotes) and click the search button at the far bottom right corner;

- You'll be taken to http://opensourceecology.org/wiki/Open_Source_Ecology:GoogleSearch?q=biomimicry

On the page that loaded, you should see your query on the new search form (at the top) and the search results below it.

However, the search form is empty, and no results are shown.

How can I fix this?

(This has been added as a card on the Open Source Ecology IT board on Trello: https://trello.com/card/board/google-custom-search-how-to-make-it-work/4f073a648bf75f63070500bc/4f1016a9a403b306191080fc)

griffordson

Is there a public repo for the OSE Forum code somewhere? I honestly haven't looked very hard for it, so I'm sorry if this has been made obvious somewhere.

elifarley

To make it more convenient to read, I've copied the source code below:

<div id="cse-search-form" style="width: 100%;">Loading</div>

google.load('search', '1', {language : 'en'});

google.setOnLoadCallback(function() {

var customSearchOptions = {};

var imageSearchOptions = {};

imageSearchOptions['layout'] = google.search.ImageSearch.LAYOUT_POPUP;

customSearchOptions['enableImageSearch'] = true;

customSearchOptions['imageSearchOptions'] = imageSearchOptions;

var customSearchControl = new google.search.CustomSearchControl(

'010823241464583136657:h3lzpyuunqm', customSearchOptions);

customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);

var options = new google.search.DrawOptions();

options.setAutoComplete(true);

options.enableSearchboxOnly("http://opensourceecology.org/wiki/Open_Source_Ecology:GoogleSearch");

customSearchControl.draw('cse-search-form', options);

}, true);

</script>

The code above creates the custom search box you see at the bottom right of this page.

elifarley

The results page is located at http://opensourceecology.org/wiki/Open_Source_Ecology:GoogleSearch

The code in that page is created by this MediaWiki extension:

http://www.mediawiki.org/wiki/Extension:Google_Custom_Search_Engine

Here's the configuration for that extension:

$output='<div id="cse-search-form" style="width: 100%;">Loading</div><script src="http://www.google.com/jsapi" type="text/javascript"></script><script type="text/javascript">google.load("search", "1", {language : "en"});

google.setOnLoadCallback(function() {

var customSearchOptions = {};

var imageSearchOptions = {};

imageSearchOptions["layout"] = google.search.ImageSearch.LAYOUT_POPUP;

customSearchOptions["enableImageSearch"] = true;

customSearchOptions["imageSearchOptions"] = imageSearchOptions; var customSearchControl = new google.search.CustomSearchControl(

"010823241464583136657:h3lzpyuunqm", customSearchOptions);

customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);

var options = new google.search.DrawOptions();

options.setAutoComplete(true);

options.enableSearchboxOnly("http://");

customSearchControl.draw("cse-search-form", options);

}, true);

</script><link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />

<div id="cse" style="width: 100%;">Loading</div><script src="http://www.google.com/jsapi" type="text/javascript"></script><script type="text/javascript">google.load("search", "1", {language : "en"});

google.setOnLoadCallback(function() {

var customSearchOptions = {};

var imageSearchOptions = {};

imageSearchOptions["layout"] = google.search.ImageSearch.LAYOUT_POPUP;

customSearchOptions["enableImageSearch"] = true;

customSearchOptions["imageSearchOptions"] = imageSearchOptions; var customSearchControl = new google.search.CustomSearchControl(

"010823241464583136657:h3lzpyuunqm", customSearchOptions);

customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);

var options = new google.search.DrawOptions();

//options.setSearchFormRoot("cse-search-form");

options.setAutoComplete(true);

customSearchControl.draw("cse", options);

function parseParamsFromUrl() {

var params = {};

var parts = window.location.search.substr(1).split("\x26");

for (var i = 0; i < parts.length; i++) {

var keyValuePair = parts[i].split("=");

var key = decodeURIComponent(keyValuePair[0]);

params[key] = keyValuePair[1] ?

decodeURIComponent(keyValuePair[1].replace(/\+/g, " ")) :

keyValuePair[1];

}

return params;

}

var urlParams = parseParamsFromUrl();

var queryParamName = "q";

if (urlParams[queryParamName]) {

customSearchControl.execute(urlParams[queryParamName]);

}

}, true);

</script><link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" />

';//google code end here

elifarley

Fixed. You can see the diff - I have adapted the Javascript code provided by Google and added it directly to the page (so we're not using the MediaWiki extension anymore).

Howdy, Stranger!

Categories

In this Discussion

Tagged

Open Source Ecology Forums