一次显示多个GCSE. [英] Multiple GCSE's on page at one time.

问题描述

使用新的GCSE代码，如下所示:

Using the new GCSE code like so:

                    // google custom search engine for the whole site
                (function() {
                    var cx = '*****************';
                    var gcse = document.createElement('script');
                    gcse.type = 'text/javascript';
                    gcse.async = true;
                    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
                            '//cse.google.com/cse.js?cx=' + cx + '&gname=sitesearch';
                    var s = document.getElementsByTagName('script')[0];
                    s.parentNode.insertBefore(gcse, s);
                })();

以及类似的元素:

            <gcse:searchbox gname="sitesearch"></gcse:searchbox>
            <gcse:searchresults gname="sitesearch"></gcse:searchresults>

我该如何在页面上添加第二个gcse标记并将其分配为新的CX: 我尝试过将每个gname传递给url，如下所示:

How do I go about including a second gcse tag on page and Assiging it a new CX: I've tried passing the gname for each to the url like so :

'//cse.google.com/cse.js?cx=' + cx + '&gname=sitesearch';

但无济于事... 我已经阅读了说明文件；

but to no avail... I've read the documentation where it says;

(可选)CSE元素对象的名称.名称用于按名称检索关联的组件，或将搜索框组件与searchresults组件配对.如果未提供，则定制搜索"将根据网页上组件的顺序自动生成一个gname.例如，第一个未命名的searchbox-only的gname为"searchbox-only0"，第二个未命名的searchbox的gname为"seachbox-only1"，依此类推.请注意，自动为两列布局中的组件生成的gname将为两列.以下示例使用gname storesearch将searchbox组件与searchresults组件链接: 这使将搜索框分配给搜索结果变得很容易，我似乎无法将cx代码附加到实际标签上.

(Optional) A name for the CSE element object. A name is used to retrieve an associated component by name, or to pair a searchbox component with a searchresults component. If not supplied, Custom Search will automatically generate a gname, based on the order of components on the webpage. For example, the first unnamed searchbox-only has the gname "searchbox-only0" and the second has the gname "seachbox-only1", and so on. Note that the automatically generated gname for a component in two-column layout will be two-column. The following example uses the gname storesearch to link a searchbox component with a searchresults component: which makes it easy to assign the searchbox to the search results I just can't seem to attach the cx code to the actual tag.

我已阅读以下内容: 同一页上的多个Google CSE(自定义搜索引擎)框 但这是指旧版的GCSE 而其中一个可接受的答案是使用iframe: 如何具有多个Google自定义搜索字段在同一页面上

I've read this: Multiple Google CSE (Custom Search Engine) Boxes on Same Page but that refers to an older version of GCSE and this one where the accepted answer is use an iframe: How to have multiple Google Custom Search field on the same page

使用iframe似乎很笨拙，而不是正确的方法... ?

Using an iframe just seems cludgy and not the right way to do it... ?

推荐答案

使用自定义搜索元素v1，可以相对容易地完成该操作:

With Custom Search Element v1 it can be done relatively easy:

<script src='//www.google.com/jsapi' type='text/javascript'></script>
<script type='text/javascript'>
google.load('search', '1', {style: google.loader.themes.V2_DEFAULT});
google.setOnLoadCallback(function () {
  new google.search.CustomSearchControl('CSE_USER_ID:CDE_ID1').draw('cse');
  new google.search.CustomSearchControl('CSE_USER_ID:CDE_ID2').draw('cse2');
});
</script>

<div id='cse' style="width: 100%;">Loading</div>

<div id='cse2' style="width: 100%;">Loading</div>

演示:同一页面上有多个Google CSE
http://box.galeksic.com/cse.multiple-on-same-页面/

Demo: Multiple Google CSE on the same page
http://box.galeksic.com/cse.multiple-on-same-page/

JavaScript API参考(v1)
https://developers.google.com/custom-search/docs/js /cselement-reference

JavaScript API Reference (v1)
https://developers.google.com/custom-search/docs/js/cselement-reference

我尝试过使用v2，但是效果不是很好.

I've tried with v2, but wasn't very successful.

这篇关于一次显示多个GCSE.的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！