Diogo Besson :: tecnologia

Formulários no WordPress

Formulários no WordPress

Formulários no WordPress te ajuda a criar formulários de pesquisa e de contato dentro do wordpress. É fácil, rápido e bastante útil pra qualquer desenvolvedor que trabalha com o wordpress.

Ultimamente tenho trabalhado bastante com o wordpress no projeto Visite São Vicente e as buscas neste weblog estão indo de encontro com essas experiências.

Será coincidência, inconsciente coletivo ou uma tendência?

Vou falar de dois tipos de formulários do wordpress:

O formulário de PESQUISA.

O formulário de CONTATO.

Formulário de pesquisa no wordpress

O wordpress gera automaticamente uma página de busca para você, porém há sempre a possibilidade de personalizar essa funcionalidade.

Aliás, você pode criar uma página de busca personalizada ou um formulário de busca personalizado para inserir no seu template.

No caso do formulário, a coisa é bem fácil:

– crie um arquivo chamado searchform.php na base do seu template;

– digite dentro desse arquivo, o código do seu formulário, que pode ser:

<li id=”search”>

<label for=”s”>Search:</label>

<form id=”searchform” method=”get” action=”/index.php”>

<div>

<input type=”text” name=”s” id=”s” size=”15″ /><br />

<input type=”submit” value=”Search” />

</div>

</form>

</li>

O importante é:

– manter o nome e os ids dos campos e das tags;

– direcionar a ação deste formulario de buscas ao index.

Por que?

Porque o wordpress reconhece através desses nomes e valores no index do sistema, que a requisição trata-se de uma busca vinda de um formulário.

Isso é muito interessante, porque você não vai precisar ficar desenvolvendo querys, parâmetros e regras para a obtenção dos resultados pesquisados internamentes em posts. A API do wordpress já se encarrega de tratar tudo para você.

A personalização pode (e deve) ocorrer utilizando essas ids e CSS.

Para criar uma página de busca é um pouco, não muito, mais complicado.

Você vai usar o arquivo page.php que vem por padrão no template inicial (Kubrick) da instalação do wordpress.

Primeiro passo é duplicar o page.php e renomea-lo para searchpage.php;

Abra esse arquivo e delete o loop, deixando a sua div de conteúdo intacta, porém sem conteúdo.

o loop a ser deletado deveria ser esse aqui:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div id=”post-<?php the_ID(); ?>”>
<h2><?php the_title(); ?></h2>
<div>
<?php the_content(‘<p>’ . __(‘Read the rest of this page &raquo;’, ‘kubrick’) . ‘</p>’); ?>

<?php wp_link_pages(array(‘before’ => ‘<p><strong>’ . __(‘Pages:’, ‘kubrick’) . ‘</strong> ‘, ‘after’ => ‘</p>’, ‘next_or_number’ => ‘number’)); ?>

</div>
</div>
<?php endwhile; endif; ?>
<?php edit_post_link(__(‘Edit this entry.’, ‘kubrick’), ‘<p>’, ‘</p>’); ?>

Após a deleção, adicione o cabeçalho dentro desta div de conteúdo, que identifica para o visitante que esta é uma página específica de busca, como por exemplo:

<h1> Esta é a página de busca </h1>

<h3>Digite no formulário o que você deseja procurar dentro deste site </h3>

Logo abaixo, inclua o formulário de pesquisa que você criou, personalizou, estilizou anteriormente:

<?php include (TEMPLATEPATH . ‘/searchform.php’); ?>

Ok. Já temos uma página de busca, porém o wordpress precisa de uma bandeira dizendo ao painel administrativo que esta é REALMENTE uma página de busca.

Adicione, portanto, no início do arquivo o seguinte conteúdo:

<?php

/*

Template Name: Search Page

*/

?>

Salve o arquivo, faça o upload de tudo de novo deste template (o wordpress chama de TEMA) para a respectiva pasta no seu servidor.

Não esqueça de enviar também os novos arquivos de CSS que você utilizou.

-No painel administrativo do WordPress, escolha o ítem que cria uma nova página.

-Digite o título da página (somente o título).

– No menu Atributos, na opção de Modelos, escolha Search Page.

– publique.

Pronto! Você agora tem uma página de busca do wordpress! Perfeito……

Vamos agora falar de outra coisa: Formulário de contato no worpdress

Não sei se todos já sabem, mas a instalação do wordpress tem uma grande liberdade para o desenvolvimento e a instalação de plugins diversos.

Assim como no Joomla, os plugins são funcionalidades adicionais de terceiros, (que não são de responsabilidade do wordpress) que facilitam bastante a vida dos desenvolvedores.

Eu, particularmente, estou usando bastante o Akismet, que serve para filtrar spam nos comentários; o Easy Ad Sense, para publicar anúncios do google; o WordPress.com Stats, que faz uma análise superficial das estatísticas de acesso do seu site e o Contact Form 7, que é o plugin em questão.

Este plugin pode ser baixado gratuitamente do site: http://contactform7.com/

Ele é uma ferramente muito útil, pois, com uma interface bem intuitiva e simples, faz com que você possa criar formulários diversos dentro do seu site ou blog wordpress.

Após o usuário/visitante preencher este formulário criado, a API envia todo o conteúdo para endereços de emails especificados nas configurações do plugin.

Tudo muito simples e prático.

Após fazer o download do pacote e instala-lo dentro da pasta de plugins do wordpress, você deve entrar no painel administrativo, ativar o plugin e iniciar a confecção do seu formulário.

Na parte de baixo do menu lateral, um ítem novo chamado “Contato” irá surgir.

Lá você poderá adicionar novos formulários de contato e personalizar os já existentes, seguindo as tags encontradas no manual deste plugin.

São tags simples e intuitivas, como:

[text* your-name]

[email* your-email]

[text your-subject]

[textarea your-message]

[submit “Enviar”]

Creio que para quem instalou o wordpress e alterou muita coisa dentro de um template, atacar na criação de um formulário assim não será nada difícil…

O mais bacana -> Aceita captcha!

Evitando assim o spam indesejável de emails enviados por bots, macros e fantasmas na sua caixa de entrada.

Espero que este artigo tenha contribuído para aqueles que pesquisaram bastante aqui dentro querendo saber mais sobre o uso e personalização de formulários no wordpress.

Um abraço a todos.

2 Comments

  1. Sutra

    Tenho de explorar melhor o teu site, tenho imensas dúvidas com os plugins do wordpress.
    Necessitava de arranjar alguns, mas os que encontrei não consigo colocar a funcionar.
    Talvez por mail possamos falar.
    Beijo doce*

  2. Pingback: Top 5 « Diogo Besson :: web tecno log

Leave a Comment

O seu endereço de e-mail não será publicado.