Como colocar pesquisa no menu no WordPress

Sempre defendi aqui no Escola Sites, sites pouco poluídos, chamados minimalistas, inclusive escrevi um artigo mostrando sites para a inspiração, que você pode conferir aqui: 10 Excelentes sites minimalistas. Em um blog, onde você precisa mostrar muitos conteúdos ao mesmo tempo, a tarefa de deixar o template o mais simples possível para não confundir o usuário e o deixar mais a vontade pode parecer difícil.

Hoje mostrarei como aproveitar o espaço em seu menu horizontal WordPress para incluir a caixa de pesquisa e economizar espaço na sidebar. Com esse espaço disponível você pode inserir mais publicidade e aumentar os ganhos, ou mesmo deixar o site mais limpo como nós fizemos.

A IMPORTÂNCIA DA PESQUISA EM SEU SITE

Ter uma caixa de pesquisa em seu site é de suma importância, pois faz com que o usuário que já está acessando algum conteúdo em seu site, busque mais informação em seu próprio site ao invés de buscar o que quer em outro site. Além disso pode ser mais uma oportunidade do visitante lhe gerar alguma renda, já que ao pesquisar ele mostra interesse em “produtos”, logo é uma ótima hora para inserir alguma publicidade como o ADSENSE.

A IMPORTÂNCIA DE TER UM SITE LIMPO

Alguns amigos blogueiros fazem de seu site um verdadeiro carnaval, são tantas informações que o usuário fica na verdade perdido, comparo isso a um leitor que ao ler um livro, destaca com um marca-texto todas as linhas da página, afinal ele está destacando tudo, ou deixando tudo ao mesmo nível e tornando sua leitura ainda mais confusa?

Ao colocar publicidade, pesquisa, informações ao usuário, tudo junto em sua sidebar, ela acaba virando uma arvore de natal que você vai ornamentando conforme o tempo passa.

VAMOS DEIXAR NOSSO BLOG UM POUCO MAIS LIMPO

Digo que já cai no erro de deixar muitas coisas na sidebar aqui do Escola Sites, e busco constantemente possibilidades de melhorar isso e achei mais uma forma. Confesso que pensava ser a tarefa um pouco mais difícil mas foi um tanto quanto simples, como vou mostrar pra vocês agora.

Para baixar todos os códigos, CLIQUE AQUI

Código inserido no functions.php

{code type=php}
add_filter(‘wp_nav_menu_items’,’search_box_function’, 10, 2);
function search_box_function( $nav, $args ) {
if( $args->theme_location == ‘main-menu’ )
return $nav. ‘

 

‘;

return $nav;
}
{/code}

O que você precisa fazer é estilizar um pouco para que sua caixa de pesquisa não fique tão simples, vou mostrar aqui o CSS aplicado no Escola Sites, mas acredito que para outro blog seja preciso alguma alteração.

Style.css

{code type=css}
.menu .search-input {
width: 211px;
padding: 8px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
-webkit-box-shadow: rgb(204, 204, 204) 0px 0px 8px 0px inset;
box-shadow: rgb(204, 204, 204) 0px 0px 8px 0px inset;
-moz-box-shadow: rgb(204, 204, 204) 0px 0px 8px 0px inset;
border: 1px solid #CCC;
font-size: 12px;
height: 15px;
border-image: initial;
float: left;
margin-top: -10px 6px 0px 42px;
}
{/code}

E você, o que achou de nossa solução? Achou válido? Esperamos o seu comentário!

Receba as melhores dicas para criar um negócio digital lucrativo

Jair Rebello

Empreendedor e Nômade Digital. Dedica grande parte do seu tempo para criar soluções como o Plugin SqueezeWP e o Template ConversionWP Premium que ajudam dezenas de milhares de empreendedores a desenvolverem seus negócios.

Website: http://www.rebello.blog.br