带有Google自定义搜索的自定义搜索框

Question

我正在向我的网站添加搜索框。我当前的解决方案只是对我所输入的内容进行Google搜索，但这是我发现让我看起来像我想要的那样的唯一方法。

这是我目前所拥有的

<div id="custom-search-input">
    <form method="get" action="https://www.google.com/search">
        <input type="text" class="form-control input-lg" placeholder=" Search" name="q">
        <button class="btn btn-info btn-lg" type="search" style="position:absolute; top:30px; right: 5px;">
            <i class="fas fa-search fa-lg" aria-hidden="true"></i>
        </button>
    </form>
</div>

我希望它具有所需的外观，但它仅在我的网站上进行自定义Google搜索。

我该怎么做？

Answer 1

您可以使用CSS重写默认的Google自定义搜索框主题。只需将Google自定义搜索javascript放到您的页面中，然后使用CSS。

https://getsitethemes.com/snippets/custom-google-custom-search-box-new-theme-2535