从 2021 年 3 月 13 日起。我为我的网站制作了这个非常简单的代码https://neculaifantanaru.com/en/how-can-i-integrate-google-search-box-to-my-website-by-implementing-custom-代码.html
第一步。这是搜索框。将此代码复制到 html/php 页面中所需的位置。人们会在这里搜索信息。此表单会将搜索结果发送到另一个名为search.html
<form action="https://YOUR-WEBSITE.com/search.html" method="get" id="site-search">
<fieldset>
<!-- <label for="search">Search in website</label> -->
<input type="text" name="q" id="q" value="" />
<button type="submit" class="btn btn-inverse">search</button>
</fieldset>
</form>
第二步。创建一个名为 的新 html 页面search.html
。并在该部分中添加此代码<head>
,更有可能在之前</head>
:
<script>
(function() {
var cx = 'YOUR-NUMBER-CODE';
var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//www.google.com/cse/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
})();
</script>
您可以从此链接获取您的号码代码 https://cse.google.com/cse/all(在这里您必须添加新的搜索引擎。此外,按顺序关闭“搜索整个网络”选项仅在您的网站上而不是整个网络上查找结果)
第三步。将此代码复制<body>
到同一页面上的部分中: search.html
<div class="main-content">
<h1>Search the site</h1><p>If you want to search for our articles on a specific topic, write the search term in the form below.</p>
<gcse:searchbox-only></gcse:searchbox-only>
<gcse:searchresults-only></gcse:searchresults-only>
</div>
就这样。