Como adicionar o Live Ajax Search ao seu site WordPress (da maneira mais fácil)

Falamos muito sobre como ter um formulário de pesquisa é importante para ajudar os visitantes a encontrar conteúdo em seu site. Mas também descobrimos que a pesquisa padrão do WordPress pode ser um pouco lenta e desajeitada, muitas vezes exigindo que os usuários carreguem uma nova página para ver os resultados.

A pesquisa instantânea, que mostra os resultados à medida que o visitante digita na barra de pesquisa, semelhante ao funcionamento do Google, pode melhorar significativamente a experiência do usuário. Essa pesquisa Ajax ao vivo ajuda os visitantes a encontrar rapidamente páginas, posts, produtos e muito mais, sem a necessidade de recarregar a página.

Neste artigo, mostraremos como adicionar a pesquisa Ajax ao vivo ao seu site WordPress.

Por que adicionar o Live Ajax Search ao WordPress?

A pesquisa Live Ajax, também chamada de pesquisa instantânea, aprimora a pesquisa integrada do WordPress adicionando um recurso de menu suspenso e preenchimento automático comum em mecanismos de pesquisa como o Google.

Veja um exemplo de uma pesquisa Ajax ao vivo em ação:

A pesquisa em tempo real adivinha o que os usuários estão procurando à medida que digitam, o que os ajuda a encontrar conteúdo relevante mais rapidamente. Isso geralmente melhora a experiência do usuário, aumenta as visualizações de página e reduz a taxa de rejeição.

Com a pesquisa ao vivo do Ajax, você pode mostrar resultados relevantes sem sequer recarregar a página. Isso a torna uma ótima opção para lojas de comércio eletrônico, pois os compradores podem ver instantaneamente os produtos que correspondem à consulta de pesquisa. Dessa forma, a pesquisa instantânea pode ajudá-lo a criar uma pesquisa de produtos mais inteligente.

Dito isso, vamos dar uma olhada em como você pode adicionar uma funcionalidade de pesquisa ao vivo com tecnologia Ajax ao WordPress.

Etapa 1: Ativar a pesquisa Ajax com um plug-in do WordPress

A maneira mais fácil de adicionar a pesquisa ao vivo do Ajax ao WordPress é usar o SearchWP Live Ajax Lite Search. Esse plug-in gratuito adiciona automaticamente a pesquisa instantânea em tempo real ao seu site e funciona perfeitamente com qualquer tema do WordPress.

A primeira coisa que você precisa fazer é instalar e ativar o plug-in. Para obter mais detalhes, consulte nosso guia passo a passo sobre como instalar um plug-in do WordPress.

Após a ativação, você pode ir para SearchWP “ Settings. Em seguida, clique no botão de alternância “Enable Live Search” (Ativar Live Search).

Feito isso, clique em “Save” (Salvar) para armazenar suas alterações.

Agora, seu bloco de pesquisa padrão do WordPress terá a pesquisa Ajax ativa ativada.

Etapa 2: Adicione o formulário Ajax Live Search em seu site WordPress

Após a ativação do plug-in, todas as barras de pesquisa em seu site usarão automaticamente a pesquisa Ajax em tempo real, inclusive qualquer formulário de pesquisa personalizado no WordPress que você tenha criado.

A maioria dos temas do WordPress tem uma barra de pesquisa integrada. No entanto, depois de ativar a pesquisa Ajax ao vivo, talvez você queira adicionar uma barra de pesquisa a outras áreas do seu site WordPress.

Adição de Live Ajax Search às páginas do WordPress

Talvez você queira adicionar uma caixa de pesquisa Ajax ao vivo a páginas específicas do seu site. Por exemplo, você pode adicionar uma barra à sua página de arquivo personalizada para que os visitantes possam pesquisar facilmente nos arquivos.

Para fazer isso, você precisará abrir o post ou a página em que deseja adicionar a barra de pesquisa. Para este exemplo, mostraremos como adicionar a pesquisa ao vivo a uma página do WordPress, mas as etapas serão semelhantes para as publicações.

Primeiro, vá para Pages ” All Pages e selecione a página que você deseja editar.

No editor do WordPress Gutenberg, clique no ícone “+”.

Isso abrirá o menu de blocos.

Aqui, digite “Search” na caixa e clique no ícone “Search” para adicioná-lo à sua página.

O WordPress colocará automaticamente a barra de pesquisa para você.

Por padrão, a caixa tem um título “Pesquisar”. Você pode alterar isso digitando no campo de rótulo ou pode excluir completamente o texto do título.

Você também pode digitar um espaço reservado opcional, que é o texto que o WordPress mostrará antes de os visitantes começarem a digitar a consulta de pesquisa. Por exemplo, se você tiver uma loja on-line, talvez queira usar algo como “Pesquisar produtos” ou “Encontrar ótimas ofertas”.

Quando você estiver satisfeito com a configuração da barra de pesquisa, clique no botão “Update” (Atualizar).

Agora, seus visitantes podem usar a barra de pesquisa ativa para encontrar rapidamente o que estão procurando.

Você pode usar o mesmo processo para adicionar uma barra de pesquisa a qualquer post ou página.

Adição de Live Ajax Search à barra lateral do WordPress

Muitos proprietários de sites adicionam uma barra de pesquisa à barra lateral do site.

Isso permite que os visitantes realizem uma pesquisa independentemente de onde estejam em seu site.

Para adicionar o widget de pesquisa ao WordPress, basta acessar Appearance ” Widgets.

Esta página mostra todas as diferentes áreas prontas para widgets de seu tema do WordPress. As opções que você vê podem variar, mas a maioria dos temas terá uma barra lateral, uma barra lateral direita, uma barra lateral esquerda ou uma seção semelhante.

Basta clicar para expandir a área em que você deseja adicionar a barra de pesquisa Ajax ao vivo. Em seguida, clique no ícone “+”.

Na janela pop-up que aparece, localize e selecione o bloco “Search” (Pesquisar) quando ele aparecer.

Isso adicionará automaticamente o widget de pesquisa Ajax ao vivo à barra lateral ou a uma seção semelhante.

Quando terminar, clique no botão “Update” (Atualizar) para salvar as alterações e ativar a barra de pesquisa Ajax em seu blog ou site do WordPress.

Agora, se você visitar seu site, verá uma barra de pesquisa Ajax ativa na barra lateral ou em uma seção semelhante.

Você pode seguir o mesmo processo para adicionar a barra de pesquisa a qualquer outra área pronta para widgets.

Observação: para adicionar uma barra de pesquisa ao menu de navegação, consulte nosso guia sobre como adicionar uma barra de pesquisa ao menu do WordPress.

Como adicionar o Live Search à barra lateral do WordPress usando o Full Site Editor

Se você estiver usando um tema baseado em blocos, como o ThemeIsle Hestia Pro, poderá adicionar uma pesquisa Ajax em tempo real a qualquer área do tema usando o editor completo do site.

Você pode até mesmo adicionar uma barra de pesquisa a áreas que não podem ser editadas usando o editor de conteúdo padrão do WordPress. Por exemplo, você pode adicionar um campo de pesquisa ao seu modelo de página 404.

Para começar, vá para Appearance ” Editor no painel do WordPress.

Por padrão, o editor de site completo mostra o modelo inicial do seu tema, mas você pode adicionar um bloco de pesquisa a qualquer modelo.

Para ver todas as opções disponíveis, selecione “Templates” no menu à esquerda.

Agora você pode clicar no modelo em que deseja adicionar a pesquisa Ajax ao vivo.

O WordPress mostrará uma visualização do design e de todas as configurações de página que você pode editar. Para prosseguir e editar esse modelo, clique no pequeno ícone de lápis e abra o editor de blocos.

Feito isso, clique no ícone azul “+”.

No painel que aparece, digite “Search” (Pesquisar).

Quando o bloco “Search” for exibido, arraste-o para a área em que você deseja exibir o campo.

Para personalizar o título do bloco ou o texto do espaço reservado, basta digitar a nova mensagem no bloco de pesquisa.

Quando você estiver satisfeito com a aparência do bloco, clique em “Save” (Salvar) para ativar a barra de pesquisa Ajax.

Dica bônus: Personalize seu mecanismo de busca instantânea do WordPress

O SearchWP Live Ajax Search se integra perfeitamente à pesquisa integrada do WordPress. No entanto, essa pesquisa padrão é bastante limitada e não é boa em mostrar resultados de pesquisa precisos.

É aí que entra o SearchWP. Ele é o melhor plug-in de pesquisa do WordPress no mercado, usado por mais de 30.000 sites.

Esse plug-in permite que os visitantes pesquisem conteúdo que o WordPress ignora por padrão, incluindo campos personalizados, arquivos de texto, documentos PDF, produtos do WooCommerce, tipos de post personalizados e muito mais.

Ao instalar o SearchWP, você pode personalizar completamente o novo recurso instantâneo do seu site sem escrever nenhum código.

O SearchWP também tem análises e estatísticas avançadas que permitem ver o que os visitantes estão pesquisando.

Você pode usar esse insight para ajustar a configuração da pesquisa do seu site e identificar o conteúdo mais popular do seu site. Isso pode ajudá-lo a gerar novas ideias de posts de blog com base no que os visitantes já estão pesquisando.

Para obter mais informações, consulte estes guias:

• Como melhorar a pesquisa no WordPress com o SearchWP (rápido e fácil)
• Como personalizar a página de resultados de pesquisa no WordPress

Esperamos que este artigo tenha ajudado você a aprender como adicionar a pesquisa Ajax ao vivo ao seu site WordPress. Talvez você também queira consultar nosso guia sobre como excluir páginas dos resultados de pesquisa do WordPress e nosso artigo sobre o uso de vários formulários de pesquisa no WordPress.

Se você gostou deste artigo, inscreva-se em nosso canal do YouTube para receber tutoriais em vídeo sobre o WordPress. Você também pode nos encontrar no Twitter e no Facebook.