Como criar um formulário de pesquisa personalizado no WordPress
Você está procurando criar um formulário de pesquisa personalizado em um site WordPress? Costumávamos construir temas do zero para que pudéssemos adicionar nosso próprio estilo às seções do site. Você pode ter criado o design de um formulário de pesquisa de boa aparência e agora deseja ajustá-lo ao WordPress.
O WordPress fornece um método get_search_form()que processa o formulário de pesquisa. Se você usar esse método em seu tema personalizado, obterá um formulário de pesquisa padrão criado no núcleo do WordPress. E você não quer o formulário de pesquisa padrão, pois o design do formulário é diferente. Para superar essa situação, você precisa criar um formulário de pesquisa personalizado que substitua o padrão.
Ao criar um formulário de pesquisa personalizado, você pode adicionar sua própria marcação e estilo a ele. Neste artigo, mostrarei como criar um formulário de pesquisa personalizado no WordPress.
O método get_search_form()procura o searchform.phparquivo no diretório do seu tema ativo. Se esse arquivo não existir, o WordPress usa o formulário de pesquisa padrão que está incluído em seu núcleo.
Crie um formulário de pesquisa personalizado
Crie um searchform.phparquivo no diretório do seu tema ativo. Neste arquivo, adicione sua marcação do formulário de pesquisa. Por exemplo, no meu caso, o formulário de pesquisa é o seguinte.
<form id="searchform" method="get" action="<?php echo esc_url( home_url( '/') ); ?>">
<input type="text" class="search-field" name="s" placeholder="Search" value="<?php echo get_search_query(); ?>">
<input type="submit" value="Search">
</form>Não há nada extravagante ou complexo no código acima. Acabei de fornecer id ‘searchform’ para a tag do formulário e a classe ‘search-field’ para o campo de texto de pesquisa. Usando este id e classe, posso adicionar um estilo ao formulário de pesquisa. Assim, no seu caso, você deve usar sua própria marcação.
Exibir formulário de pesquisa
A próxima etapa é exibir o formulário de pesquisa no site. Você pode querer colocar o formulário de pesquisa na barra lateral, cabeçalho, próximo ao menu, etc.
Usando a função, get_search_form()é possível exibir seu formulário de pesquisa em qualquer lugar do site. Tudo o que você precisa fazer é chamar esse método do local onde deseja exibir o formulário de pesquisa.
<?php get_search_form(); ?>Após colocar o código acima no local desejado, acesse o navegador. Agora você deve ver seu formulário de pesquisa no site.
Personalizar o resultado da pesquisa
Pode ser que seu site tenha mais recursos como livros, revistas, ebooks, PDFs, etc. e você precise mostrar o conteúdo de todos esses recursos no resultado da pesquisa. Isso pode ser feito facilmente.
Supondo que você tenha tipos de postagem personalizados para todos esses recursos, você precisa adicionar um campo oculto para cada tipo de postagem no formulário de pesquisa.
Digamos que você tenha criado tipos de postagem personalizados, livro, revista, e-book, pdf para os recursos acima. Então, seus campos ocultos serão os seguintes.
<form id="searchform" method="get" action="<?php echo esc_url( home_url( '/') ); ?>">
<input type="text" class="search-field" name="s" placeholder="Search" value="<?php echo get_search_query(); ?>">
<input type="hidden" name="post_type[]" value="book" />
<input type="hidden" name="post_type[]" value="magazine" />
<input type="hidden" name="post_type[]" value="ebook" />
<input type="hidden" name="post_type[]" value="pdf" />
<input type="submit" value="Search">
</form>Agora, quando alguém insere uma palavra-chave no formulário de pesquisa, o WordPress pesquisa essa palavra-chave em todos os tipos de postagem acima para corresponder ao resultado.
Espero que você entenda como criar um formulário de pesquisa personalizado no WordPress. Eu gostaria de ouvir seus pensamentos e sugestões na seção de comentários abaixo.
Artigos relacionados
- Como carregar uma postagem do WordPress com AJAX
- Como definir imagens em destaque programaticamente no WordPress
- Faça upload de arquivos programaticamente no WordPress