如何将Ajax实时搜索添加到您的WordPress

将即时搜索添加到WordPress可改进默认站点搜索,并使访问者更容易找到他们正在寻找的页面和文章。在本教程中,我们将向您展示如何将Ajax实时搜索添加到您的WordPress网站。Ajax实时搜索(也称为即时搜索)通过添加在Google等搜索引擎中很常见的下拉菜单和自动完成功能来改善默认的WordPress搜索体验。这是一个实际的

将即时搜索添加到WordPress可改进默认站点搜索,并使访问者更容易找到他们正在寻找的页面和文章。

在本教程中,我们将向您展示如何将Ajax实时搜索添加到您的WordPress网站。

add-ajax-search-to-wordpress-site-og.pngo_

Ajax实时搜索(也称为即时搜索)通过添加在Google等搜索引擎中很常见的下拉菜单和自动完成功能来改善默认的WordPress搜索体验。

这是一个实际的例子:

即时搜索效果展示

实时搜索会在用户键入时猜测他们正在搜索的内容,并帮助他们更快地找到相关内容。这是对默认WordPress搜索的巨大改进。

通过帮助用户快速找到他们正在寻找的内容,实时搜索将帮助他们在您的网站上停留更长时间,从而增加综合浏览量并降低跳出率。

话虽如此,让我们来看看如何简单地将Ajax实时搜索添加到您的WordPress博客或网站。

将Ajax实时搜索添加到WordPress的最简单方法是使用SearchWP插件。它是市场上最好的WordPress搜索插件,被30,000多个网站使用。

searchwp.pngo_

该插件超越了为文章内容编制索引,并将为您网站上的所有内容编制索引,例如自定义字段、PDF文档、文本文件、WooCommerce产品等。

对于本教程,您可以使用免费的SearchWP Live Ajax Lite搜索插件,因为它会自动启用Ajax实时搜索。

您需要做的第一件事是安装并激活插件。激活后,默认的WordPress搜索表单现在将自动包含Ajax实时搜索功能。

由于任何活动搜索栏现在都有实时搜索,您所要做的就是决定您希望它们显示的位置。

下面您将了解如何将实时搜索栏添加到WordPress网站上的常见位置。

将Ajax实时搜索添加到WordPress侧边栏

添加搜索栏的最受欢迎的区域之一是WordPress侧边栏。这使您的访问者无论在您网站上的哪个位置都可以轻松进行搜索。

要将搜索小工具添加到WordPress,只需转到外观 ? 小工具以调出基于块的小工具编辑器。

customize-widget-blocks.pngo_

WordPress主题的每个小工具区域在块编辑器中都有一个单独的选项卡。

在我们的测试站点上,我们的侧边栏小部件区域称为“Right Sidebar”,但根据您的主题,您的可能有不同的名称。

只需单击侧边栏部分下方的“+”图标。

add-sidebar-widget-block.pngo_

然后,在搜索栏中键入“SearchWP”并单击“SearchWP Live Search”图标。

这将自动将Ajax实时搜索小工具插入您的侧边栏中。

add-searchwp-live-widget.pngo_

您可以自定义标题部分以更改搜索框的标题。完成后,单击“更新”按钮保存更改并使搜索栏生效。

save-search-widget.pngo_

现在,您的所有网站访问者都可以使用您的实时搜索栏。

live-widget-search-example.pngo_

您可以按照相同的过程将实时搜索栏添加到您网站的任何其他小部件区域。要将其添加到您的导航菜单区域,请参阅我们关于如何将搜索栏添加到WordPress菜单的教程。

将Ajax实时搜索添加到WordPress页面

您可能还想向网站的其他页面添加Ajax实时搜索框。例如,您可以有一个存档页面,让访问者可以搜索您的内容。

为此,您需要导航到要编辑的文章或页面。对于此示例,我们将向您展示如何将实时搜索栏添加到WordPress页面。

首先,转到页面?所有页面,然后单击要编辑的页面。

open-up-wordpress-page.pngo_

打开页面后,单击页面编辑器屏幕上的“+”图标。

这将调出区块菜单。

add-new-age-block.pngo_

接下来,在框中键入“Search”,然后单击“Search”图标将其添加到您的页面。

它会自动为您放置搜索栏。

select-search-block.pngo_

您还可以在搜索框中自定义搜索标题和占位符文本。

之后,请务必点击页面右上角的“更新”按钮。

save-live-search-on-page.pngo_

现在,您的访问者可以使用您网站上的实时搜索栏快速找到他们正在寻找的内容。

您可以使用相同的过程向任何文章或页面添加搜索栏。

live-search-page-example.pngo_

SearchWP是一个非常通用的搜索插件,它不仅仅是发布内容并索引您网站上的所有内容,包括自定义字段、ACF字段、文本文件、PDF文档内容、自定义表格、自定义分类法、WooCommerce产品属性等。

SearchWP插件的专业版可让您通过创建自己的相关性比例和调整算法来完全自定义您的搜索结果,而无需编写任何代码。

searchwp-engines.pngo_

您还可以获得指标功能,可让您查看访问者正在搜索的内容,以及许多其他强大的功能,可进一步改进您的现场搜索功能。

我们希望本教程能帮助您了解如何将Ajax实时搜索添加到您的WordPress网站。

本文内容来源于公开网络,出于传递信息之目的整理发布。原文版权归原作者所有,若涉及侵权请先提供版权后联系我们删除

(0)
WP之家WP之家
上一篇 2025年3月13日 下午5:20
下一篇 2025年3月13日 下午5:20

相关推荐

  • WordPress用户枚举漏洞修复加固方法

    近期陆续有几个客户反馈收到网安关于WordPress用户枚举漏洞的通报,涉及的地址为:/wp-json/wp/v2/users,经核实这是WordPress内置的REST API接口,这个接口默认情况下可以暴露网站上所有用户的信息,包括用户名、I…

    2025年3月13日
  • WordPress文章、页面自定义字段创建与管理

    作为最受欢迎的内容管理系统(CMS)之一,WordPress以其各种功能和自定义选项而广为人知。一种这样的选择是扩展元数据,它指的是页面或文章的关键信息,包括作者姓名、标题和描述。用户可以通过在WordPress中启

    2025年3月13日
  • 如何创建自定义WordPress页面模板

    设计网站可能很耗时。即使您使用功能强大的WordPress主题或页面构建器,您仍可能会花费数小时来构建和编辑您的页面。此外,您可能更喜欢创建自定义WordPress页面模板,而不是使用通用的预制布局。通过创建WordPress模板,您可以将它们应用到您网站上的任何页面。因此,您还可以调整整体网页设计,而

    2025年3月13日
  • WordPress终极SEO优化方案: 60+站长必须掌握的SEO小技巧

    1.安装WordPress SEO插件 开箱即用的WordPress本身的SEO还算不错的了,尤其现在WordPress还加入了Sitemap功能。但是,要把网站SEO做得更好,还是建议安装SEO插件。 就受欢迎程度而言,免费的Yoast SEO插件无疑是赢…

    2025年3月23日
  • 什么是WordPress标签以及如何正确地使用

    WordPress标签是您可以用来根据类似详细信息对文章进行分组的工具之一。通常,标签位于文章下方或侧边栏中。当访问者单击特定标签时,WordPress将打开一个存档页面(标签页面)——索引所有具有相同标签的文章和自定义文章类型。标签在组织内容方面起

    2025年3月13日
  • 如何在WordPress中实现Google AMP

    网络在不断发展,对于许多企业主来说,这意味着需要跟上Google的所有变化。如果您不适应,则意味着您可能会落后。GoogleAMP是他们加速网络的移动计划,本文将分享有关如何在WordPress中开始使用GoogleAMP的一些步骤的好时机,以及一些利弊新平台。什么是GoogleAMP?GoogleAMP的优点GoogleAMP的缺点如何在WordPress中设置Googl

    2025年3月13日
  • 翻译wordpress主题或者插件的2种方法

    翻译 WordPress 主题或插件通常涉及对语言文件(.po/.mo)的本地化处理。以下是详细步骤: 方法 1:通过 PO/MO 文件翻译 1. 定位语言文件 主题/插件目录中寻找 languages 或 lang 文件夹。 查找 .pot(模板文件)或…

    WP教程 2025年3月18日
  • 65+ 用于WordPress写作的键盘快捷键

    看起来似乎不需要很长时间,但是每次您需要将手从键盘上移开以使用鼠标时,都会浪费一小段时间。经过一整天的工作,时间可以加起来!这就是WordPress键盘快捷键可以提供帮助的地方。我们可以使用其中的许多来加快我们的

    2025年3月13日