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

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

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

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

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

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

在 Weebly 中添加搜索框

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

如何在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 搜索框
导航中的 Weebly 搜索框

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

推荐:WordPress专业干净现代布局主题Framer主题

Weebly 搜索框如何工作?

在已发布的站点上,您可以在搜索框中输入关键字进行搜索,并在同一浏览器窗口中获得相关结果。 结果页面将根据内容类型显示不同类别下的项目以及过滤结果的选项。

  • 输入框——您可以在其中再次输入新的搜索关键字或词组进行站点搜索。
  • 产品搜索 – 您网站中的所有相关产品元素与描述和价格一起显示在网站搜索结果中。 这有助于用户轻松搜索和购买产品。
  • 博客文章 – 显示您网站博客文章中所有匹配的关键字。
  • 过滤器 – 显示找到关键字的所有位置。 您可以根据需要过滤内容类型。
Weebly 搜索结果页面
Weebly 搜索结果页面

以下是您在 Weebly 网站中使用搜索框时会发现的优点和问题。

优点

  • 在文件、博客文章和产品中搜索关键字。 产品显示在类别下,可帮助用户更轻松有效地过滤结果。
  • 您可以拖放搜索框元素以在站点的任何位置启用它。
  • 在支持的主题上,您可以通过在站点的页眉或页脚区域中启用它来在整个站点上显示。 如果您有很多博客文章,最好在侧边栏中添加站点搜索选项,以便用户可以轻松搜索您的内容。
  • 您可以鼓励用户使用您的 Weebly 搜索应用程序作为 Web 浏览器中的默认搜索引擎。 Weebly 搜索应用程序的 URL 将类似于“https://www.yoursite.com/apps/search?q=%s”,用户可以在浏览器的设置中添加它。

缺点

  • Weebly 搜索选项有时会显示不完整的搜索结果,这意味着搜索关键字的含义在结果中显示时没有完全掌握。
  • 搜索结果不包括页面。
  • 没有可用于选择 Web 搜索或站点特定搜索的自定义选项。
  • 除非您使用任何其他元素旁边的间隔和步调来调整搜索框的大小,否则无法自定义搜索框的大小。
  • 与监控流量统计不同,Weebly 不提供网站搜索使用分析。

免费用户的 Weebly 搜索框

如前所述,Weebly 站点搜索选项是一项高级功能。 如果您尝试在免费的 Weebly 网站中添加搜索框,您将看到一个弹出窗口,要求您升级您的计划。

Weebly 搜索框高级功能
Weebly 搜索框高级功能

但是,免费用户可以使用更好的替代方案,例如 谷歌自定义搜索. 它使用谷歌搜索引擎提供了更好的结果,也可以通过 AdSense 搜索广告。 如果您有目标中国受众,那么您还可以从百度搜索引擎添加自定义搜索框。

推荐:如何修复FPS下降提高Windows Valorant性能


发表评论