Como adicionar uma barra de pesquisa no WordPress (4 maneiras)

Publicados: 2022-01-25

Gostaria de adicionar uma barra de pesquisa ao seu site WordPress?

Esse é um recurso útil que permite que os visitantes do site encontrem o conteúdo que estão procurando em alguns segundos.

Infelizmente, nem todos os temas do WordPress possuem uma barra de pesquisa por padrão. E pode ser um desafio descobrir como adicioná-lo se você for iniciante.

Mas não se preocupe, pois neste artigo, mostraremos como adicionar uma barra de pesquisa ao seu site WordPress sem nenhum código.

Como este artigo contém um conjunto de guias passo a passo para algumas maneiras de adicionar uma barra de pesquisa, aqui está um índice para ajudá-lo a navegar:

  • Adicionar uma barra de pesquisa como um widget
  • Adicionar uma barra de pesquisa manualmente
  • Adicione uma barra de pesquisa compatível com seu tema
  • Como adicionar uma barra de pesquisa ao menu do WordPress

Vamos mergulhar nisso!

Por que adicionar uma barra de pesquisa ao seu site?

Uma barra de pesquisa não apenas permite que os visitantes do seu site encontrem o conteúdo mais rapidamente. Ele também traz muitas vantagens ocultas que aumentam significativamente o desempenho do seu site.

Aqui estão apenas alguns exemplos de por que você precisa de uma barra de pesquisa em seu site:

  • Aumente a taxa de conversão: quanto mais fácil for para as pessoas encontrarem o produto que desejam em seu site, maiores são as chances de que elas comprem de você.
  • Aumente a capacidade de descoberta de conteúdo: criar conteúdo de qualidade exige muito trabalho e muito tempo. A barra de pesquisa permite maximizar seus esforços e aumentar o engajamento dos visitantes.
  • Melhore a experiência do usuário: se os visitantes se divertiram muito explorando seu site, isso os fará retornar várias vezes. Um público fiel é precioso, pois eles desejam consumir o máximo possível do seu conteúdo.
  • Skyrocket SEO: fique tranquilo, todos os itens acima não escaparão da atenção do Google. Essas coisas reduzem a taxa de rejeição, um dos fatores essenciais de classificação. Você deseja mantê-lo o mais baixo possível para obter uma melhor classificação e atrair mais visitantes dos mecanismos de pesquisa.

Agora que conhecemos os benefícios de ter uma barra de pesquisa, vamos adicioná-la ao seu site WordPress.

Como adicionar uma barra de pesquisa no WordPress

Existem várias maneiras de adicionar uma barra de pesquisa a um site WordPress.

Neste artigo, vamos dar uma olhada nas formas mais populares, comparar suas vantagens e desvantagens e ajudá-lo a ver a maneira mais fácil de fazer isso.

Adicionar uma barra de pesquisa como um widget

Provavelmente, a maneira mais popular de adicionar a barra de pesquisa é adicioná-la como um widget. Para fazer isso, você só precisa arrastar e soltar o widget apropriado na área em que deseja que ele apareça.

No entanto, esta forma tem uma desvantagem notável. O problema é que nem todo tema suporta widgets.

Mesmo que seja o caso, o conjunto de áreas de widgets disponíveis geralmente é bastante limitado. Por exemplo, você pode querer adicionar um widget ao cabeçalho, mas seu tema tem apenas áreas de widget no rodapé e na barra lateral.

Tenha isso em mente e vamos dar uma olhada em como adicionar um widget de pesquisa ao site WordPress.

1. Vá para a guia Widgets

O primeiro passo é abrir o painel do WordPress e navegar até a guia Widgets em Aparência .

go to widgets tab

Em seguida, você precisa decidir em qual área de widget deseja adicionar seu widget. Por exemplo, apenas 2 áreas estão disponíveis no tema oficial gratuito do WordPress Twenty Twenty.

footer section

2. Adicione um novo widget

Para adicionar um widget de pesquisa à área desejada, pressione o botão Mais no canto superior esquerdo.

Encontre o widget de pesquisa e arraste-o para a área em que deseja que apareça em seu site.

find the search widget

Aqui está como deve ficar:

drag and drop the search widget

Não se esqueça de pressionar o botão Atualizar no canto superior direito para salvar as alterações.

press the update button

Agora precisamos ter certeza de que a barra de pesquisa realmente começa a ser exibida na área do widget de rodapé onde a adicionamos.

3. Confira sua nova barra de pesquisa em seu site

A maneira mais rápida de fazer isso é pressionar o botão Visitar o site abaixo do nome do site no canto superior esquerdo.

visit your website

Como você pode ver, a barra de pesquisa funciona perfeitamente.

the search bar works

Portanto, essa foi uma das maneiras de adicionar uma barra de pesquisa ao site WordPress. Vamos seguir em frente e falar sobre a próxima maneira de fazer isso manualmente abaixo.

Adicionar uma barra de pesquisa manualmente

A próxima maneira que veremos é como adicionar uma barra de pesquisa manualmente editando o código do tema WordPress.

Há uma enorme desvantagem para este método. Você precisa ser experiente em tecnologia o suficiente para saber como editar o código do tema WordPress.

Mas não é tão difícil quanto parece, e mostraremos como fazer isso passo a passo abaixo.

Antes de editar manualmente o código do seu tema, há algumas coisas que você precisa ter em mente:

  • O processo a seguir depende inteiramente do tema específico que você está usando: embora cada tema tenha seu próprio conjunto exclusivo de arquivos, a maioria deles contém arquivos típicos como cabeçalho, rodapé e sidebar.php.
  • Evite fazer alterações no tema pai: o problema é que você perderá todas as alterações depois de atualizá-lo. É muito melhor criar um tema filho e adicionar alterações a ele. Você pode aprender sobre como criar um tema filho do WordPress aqui.

Para os propósitos deste tutorial, usaremos o tema Twenty Twenty-One, pois é um dos temas gratuitos mais populares do WordPress. O processo pode ser um pouco diferente, dependendo do seu tema.

Como a grande maioria dos proprietários de sites costuma adicionar uma caixa de pesquisa ao cabeçalho, faremos o mesmo.

Por exemplo, vamos adicionar uma barra de pesquisa ao lado da barra de navegação, pois é o local mais comum.

1. Vá para o editor de temas

O primeiro passo é ir ao Editor de Temas em Aparência .

go to the theme editor

No painel direito, você pode encontrar a lista completa de arquivos de temas editáveis.

Vamos adicionar uma barra de pesquisa ao cabeçalho, então clique no arquivo header.php .

find the theme header

2. Adicione o código do formulário de pesquisa

Encontre a linha de código:

<?php get_template_part( 'template-parts/header/site-header' ); ?>

E coloque o seguinte código logo após:

<?php get_search_form(); ?>

Aqui está como deve ficar:

paste the search form code

Pressione o botão Atualizar arquivo na parte inferior quando terminar.

press update file

Clique no botão Visitar site abaixo do nome do seu site para ver o resultado.

go back to your website

3. Confira sua barra de pesquisa recém-adicionada

Como você pode ver, uma barra de pesquisa agora aparece ao lado da barra de navegação:

Adicione uma barra de pesquisa compatível com seu tema

Alguns temas do WordPress suportam a ativação ou desativação de uma barra de pesquisa.

Por exemplo, um dos populares temas gratuitos do WordPress chamado GeneratePress tem esse recurso.

Normalmente, você pode verificar se o seu tema tem essa configuração na guia Personalizar em Aparência .

Vamos dar uma olhada em como adicionar uma barra de pesquisa suportada por um tema com um exemplo de GeneratePress.

1. Vá para a guia Personalizar

O primeiro passo é ir para a guia Personalizar .

go to customize tab

Em seguida, vá para Layout » Navegação primária .

Go to primary navigation

Ative a pesquisa de navegação.

enable the navigation search

Não se esqueça de pressionar o botão Publicar na parte superior quando terminar.

press publish

2. Confira sua nova barra de pesquisa

Vamos visitar nosso site e verificar se está tudo bem. Agora temos o ícone da lupa depois de clicar no qual a barra de pesquisa aparece.

magnifying glass icon

Você já conhece as 3 maneiras mais populares de adicionar uma barra de pesquisa ao seu site WordPress. Mas e se você quiser adicionar uma barra de pesquisa ao seu menu de navegação do WordPress?

Vamos falar sobre como você pode fazer isso abaixo.

Como adicionar uma barra de pesquisa ao menu do WordPress

A maneira mais fácil de adicionar uma barra de pesquisa ao menu de navegação do WordPress é instalar o plugin SearchWP Modal Search Form.

Ao usá-lo, você pode adicionar um formulário de pesquisa modal leve ao lado de seus itens de menu em apenas alguns cliques.

Além disso, se você quiser melhorar ainda mais as possibilidades de pesquisa do WordPress, considere obter uma versão premium do SearchWP.

Como o melhor plugin de pesquisa para WordPress, SearchWP é usado por mais de 30.000 sites em todo o mundo. Algumas de suas características incluem:

  • Pesquisa de preenchimento automático: você deseja que sua barra de pesquisa comece a adivinhar as consultas de pesquisa dos visitantes como o Google faz? SearchWP permite que você torne isso realidade em apenas alguns cliques.
  • Resultados da pesquisa ao vivo: o WordPress mostra os resultados da pesquisa abrindo uma nova página separada por padrão. Leva tempo e pode confundir alguns dos visitantes. Usando SearchWP, você pode fornecer aos seus visitantes resultados de pesquisa ao vivo.
  • Mecanismo de pesquisa aprimorado: o mecanismo de pesquisa nativo do WordPress não considera campos personalizados, conteúdo de documentos, códigos de acesso e muito mais. O SearchWP resolve esse problema fornecendo ao visitante resultados de pesquisa abrangentes.
  • Insights de atividade de pesquisa no site: usando SearchWP, você pode dar uma olhada no que os visitantes do seu site estavam procurando. Ele abre uma ampla gama de oportunidades e permite que você obtenha novas ideias de conteúdo.
  • Integração WooCommerce: SearchWP suporta indexação de campos personalizados, tornando os atributos, tags e comentários dos produtos WooCommerce pesquisáveis.

Você pode pegar a versão premium do SearchWP aqui.

Agora, vamos adicionar uma barra de pesquisa ao menu de navegação do WordPress com algumas etapas simples.

Etapa 1: instalar e ativar o plug-in de formulário de pesquisa modal SearchWP

Primeiro, você precisa acessar a guia Plugins no painel do WordPress e clicar em Adicionar novo .

add a new plugin

Em seguida, procure por SearchWP Modal Search Form.

searchwp modal form search

Encontre o plug-in e clique em Instalar agora . Não se esqueça de ativá-lo após a instalação.

Para mais detalhes sobre como fazer isso, confira nosso guia passo a passo sobre como instalar um plugin do WordPress.

install searchwp modal search form

Etapa 2: adicionar uma barra de pesquisa ao menu

Depois de instalar e ativar o SearchWP Modal Search Form, no seu painel do WordPress, clique na guia Appearance e vá para Menus .

go to appearance menus

Quando estiver lá, clique em SearchWP Modal Search Forms .

click searchwp modal search forms

Marque a caixa de seleção Padrão e pressione Adicionar ao menu .

click add to menu

Clique em seu novo item de menu chamado Default e altere seu nome no campo Navigation Label para algo mais apropriado. Por exemplo, vamos chamá-lo de “Pesquisar”.

rename to search

Uma vez feito, pressione o botão Salvar Menu no canto inferior direito.

press save menu

Etapa 3: teste sua nova barra de pesquisa

Agora vamos dar uma olhada na nova barra de pesquisa. Clique no botão Visitar Site abaixo do nome do seu site.

press the visit site button

Verifique a área do menu de navegação. Agora você tem um novo item de menu chamado “Pesquisar”.

new menu item

Depois de clicar nele, você verá o formulário de pesquisa modal aparecer, assim:

modal search form

É isso. Você acabou de adicionar uma barra de pesquisa ao menu de navegação do seu site WordPress.

Neste artigo, você aprendeu como adicionar uma barra de pesquisa no WordPress seguindo algumas maneiras diferentes.

Se você está pronto para capacitar sua pesquisa no WordPress, você pode pegar sua cópia do Search WP aqui.

Você também pode estar interessado em como personalizar o widget de pesquisa no WordPress se quiser ajustar seu algoritmo de pesquisa.

Além disso, se você já enfrentou algum problema com a pesquisa do WordPress, pode ser útil verificar nosso guia sobre como corrigir a pesquisa do WordPress que não está funcionando.