Google CSE:结果页面在其他页面的 div 中?
Google CSE: result page in a div of other page?
我想添加"Google CSE",但我不想添加Google创建的所有html和css,所以在网上查找,我几乎找到了解决方案:
<!-- Google custom search box Start -by BloggerSentral.com -->
<div class='cse' style='color:#000000;float:right;margin:6px 10px 0 0 ;'>
<form action='http://www.google.com/cse' target="_blank" id='cse-search-box'>
<input name='cx' type='hidden' value='015736343358803935205:m2shzyx2lrg'/>
<input type='text' name='q' size='35' />
<input name='ie' type='hidden' value='ISO-8859-1'/>
<input type="submit" name="sa" value="Search" />
</form>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=en"></script>
</div>
<!-- Google custom search box End -->
此代码必须插入已存在的柱中。
在我的控制面板 "google cse" 中,在 "layout" 部分我输入了选项 Only Results
现在,当我在此栏中搜索时,它会打开一个页面:
http://www.google.com/cse+ id google cse +搜索的关键字
而且有效。
但是,我希望在我网站页面的 div (#content) 中看到这些结果。这可能吗?
我做到了! ;)
我真的希望这个提议对很多人有用,也是因为我注意到关于 google cse 的问题得到的答案很少..
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
google.load('search', '1');
google.setOnLoadCallback(googlata);
function googlata(){
var customSearchControl = new google.search.CustomSearchControl('015736343358803935205:m2shzyx2lrg'); // change this to your unique ID
customSearchControl.setResultSetSize(20);
customSearchControl.setLinkTarget(google.search.Search.LINK_TARGET_SELF); // open results in new window
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
options.enableSearchResultsOnly()
customSearchControl.draw('cse',options); // set the results div id
//ottengo keyword searched
var link= self.location.href;
var inizio = link.search("q=")+2;
var fine= link.search("&");
var keyword= (link.slice(inizio,fine)).replace('+',' ');
//
customSearchControl.setNoResultsString("<div style='padding:10px'><h2><b>Nessuno risultato per: "+keyword+" </b></h2><br><h3>Prova a cercare qualcosa di simile, siamo certi che potrai trovare cio' che ti interessa!</h3><br><br><br>Se il problema persiste non esitare a <a href='http://www.mywebsite.com/Contattaci'>contattarci</a>, provvederemo il prima possibile.</div>");
customSearchControl.execute(keyword);
var newlink= link.replace('&sa=Search','');
history.pushState({}, null, newlink);
}
<div id="cse" style="width:100%;">Loading</div>
在我的例子中,结果将绘制在 div id="cse"
使用 options.enableSearchResultsOnly()
我只绘制了结果页面,所以我的搜索栏是一个普通的搜索栏,我在其中使用方法 get 发送了我的数据,事实上在我的函数中 googlata()
我通过 url (关键字)然后我更改了 url 因为我想要一个干净的 url.
了解 API 2.0 的 google 搜索非常重要,我推荐阅读:
https://developers.google.com/custom-search/docs/js/cselement-reference
意大利再见! :D
我想添加"Google CSE",但我不想添加Google创建的所有html和css,所以在网上查找,我几乎找到了解决方案:
<!-- Google custom search box Start -by BloggerSentral.com -->
<div class='cse' style='color:#000000;float:right;margin:6px 10px 0 0 ;'>
<form action='http://www.google.com/cse' target="_blank" id='cse-search-box'>
<input name='cx' type='hidden' value='015736343358803935205:m2shzyx2lrg'/>
<input type='text' name='q' size='35' />
<input name='ie' type='hidden' value='ISO-8859-1'/>
<input type="submit" name="sa" value="Search" />
</form>
<script type="text/javascript" src="http://www.google.com/cse/brand?form=cse-search-box&lang=en"></script>
</div>
<!-- Google custom search box End -->
此代码必须插入已存在的柱中。
在我的控制面板 "google cse" 中,在 "layout" 部分我输入了选项 Only Results
现在,当我在此栏中搜索时,它会打开一个页面:
http://www.google.com/cse+ id google cse +搜索的关键字
而且有效。
但是,我希望在我网站页面的 div (#content) 中看到这些结果。这可能吗?
我做到了! ;) 我真的希望这个提议对很多人有用,也是因为我注意到关于 google cse 的问题得到的答案很少..
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
google.load('search', '1');
google.setOnLoadCallback(googlata);
function googlata(){
var customSearchControl = new google.search.CustomSearchControl('015736343358803935205:m2shzyx2lrg'); // change this to your unique ID
customSearchControl.setResultSetSize(20);
customSearchControl.setLinkTarget(google.search.Search.LINK_TARGET_SELF); // open results in new window
var options = new google.search.DrawOptions();
options.setAutoComplete(true);
options.enableSearchResultsOnly()
customSearchControl.draw('cse',options); // set the results div id
//ottengo keyword searched
var link= self.location.href;
var inizio = link.search("q=")+2;
var fine= link.search("&");
var keyword= (link.slice(inizio,fine)).replace('+',' ');
//
customSearchControl.setNoResultsString("<div style='padding:10px'><h2><b>Nessuno risultato per: "+keyword+" </b></h2><br><h3>Prova a cercare qualcosa di simile, siamo certi che potrai trovare cio' che ti interessa!</h3><br><br><br>Se il problema persiste non esitare a <a href='http://www.mywebsite.com/Contattaci'>contattarci</a>, provvederemo il prima possibile.</div>");
customSearchControl.execute(keyword);
var newlink= link.replace('&sa=Search','');
history.pushState({}, null, newlink);
}
<div id="cse" style="width:100%;">Loading</div>
在我的例子中,结果将绘制在 div id="cse"
使用 options.enableSearchResultsOnly()
我只绘制了结果页面,所以我的搜索栏是一个普通的搜索栏,我在其中使用方法 get 发送了我的数据,事实上在我的函数中 googlata()
我通过 url (关键字)然后我更改了 url 因为我想要一个干净的 url.
了解 API 2.0 的 google 搜索非常重要,我推荐阅读:
https://developers.google.com/custom-search/docs/js/cselement-reference
意大利再见! :D