如何在Weebly网站中添加搜索框

每个 Weebly 站点所有者都喜欢在站点中添加站点搜索框，以便为访问者提供易于搜索的功能。搜索框是一个非常有用的功能，尤其是当您拥有大量产品或网站内容丰富时。由于导航菜单中不可能包含所有页面，因此搜索框是用户在您的网站中查找相关内容的唯一选项。在本文中，我们将解释如何在 Weebly 网站中添加搜索框以及它是如何工作的。

推荐：WooCommerce付款计划插件SUMO WooCommerce Payment

Weebly 提供了一个搜索框作为应用程序或元素，您可以将其添加到您网站的任何位置。但是，这是一项高级功能，您需要升级到其中一个高级计划才能使用您网站上的默认搜索框元素。

您可以在内容、页眉和页脚区域拖放“搜索框”元素。
从“主题”下的主题选项设置中启用或禁用“搜索框”。这适用于受支持的主题，以在标题导航菜单中显示搜索镜头图标。

当您在 Weebly 编辑器中时，转到“构建”部分并选择要添加搜索框的页面。您可以在“更多”元素组下找到“搜索框”。只需将元素拖放到内容区域即可查看搜索框。

添加搜索框后，单击元素以查看可用的自定义选项。

输入将显示在搜索框中的占位符文本，您可以保留默认的“搜索站点”文本。
将搜索框对齐方式更改为左、中或右。您还可以将搜索放在任何现有元素的右侧或左侧，以在布局上对齐。
通过增加或减少值来调整顶部和底部边距。
您可以使用 Color Block 等应用程序创建带有边框半径的漂亮背景颜色框，并将搜索框放在里面。以下是使用 Color Block 应用程序创建的自定义搜索框的外观：

.wsite-search-element-outer {
    background: #d8aaf6;
    border-radius: 30px;
    border: 1px solid rgb(144 238 144);
}

与内容区域类似，您可以在页眉和页脚区域拖放搜索框元素。请记住，拖放页脚是 Weebly 中的一项高级功能，您可以与搜索框功能一起使用。因此，如果您想要一个搜索框，最好的选择是升级您的免费 Weebly 计划并为您的网站购买一项高级 Weebly 计划。

在标题导航中显示搜索图标是一个不错的选择，这样用户可以在他们想要在您的网站上搜索某些内容时轻松找到它。这特别适用于当用户在页面上向下滚动时浮动的棒状导航。不幸的是，并非所有 Weebly 主题都允许在导航菜单中添加搜索框元素。如果您真的想在导航菜单的右端显示搜索镜头图标，那么最好的选择是使用 Dusk2、Edison 或 Paper 等主题。您可以在选择之前预览主题以确认它是否在导航中具有搜索框。当您的主题支持导航中的搜索框时，您可以通过悬停并选择该选项来显示或隐藏图标。或者，导航到“主题 > 主题选项”部分并启用或禁用“搜索框”选项。

如果您的主题不支持，请查看我们关于如何在 Weebly 标题导航区域中添加电话文本、社交图标和搜索框的文章。