Como Criar um WordPress Theme – Parte 4

Nesta quarta parte da série de artigos sobre a criação de templates para wordpress vamos falar de 3 ficheiros que fazem parte da "base" de um tema: o single.php, o page.php e o 404.php.

Para poder perceber como tudo funciona e é feito é importante que leia os 3 artigos que já foram publicados:

• Como criar um Template WordPress - Parte 1- Introdução
• Como criar um Template WordPress - Parte 2 - Style.css e Header.php
• Como criar um Template WordPress - Parte 3 - Index.php e Archive.php

single.php

O ficheiro single.php é usado para gerar o conteúdo da página de cada post. Assim como o index.php e archive.php criados da terceira parte desta série de artigos, o single.php também tem um loop e o seu trabalho é mostrar o post, os comentários e uma mensagem de erro caso a página não seja encontrada (neste caso o wordpress usa normalmente o 404.php).

Como o objectivo é apenas ensinar a criar templates, vamos fazer manter esta página simples e usar as mesmas divs/código que usamos na homepage (index.php), mas nos seus temas pode adicionar outras coisas como widgets de partilha, um local para as tags, adicionar os posts relacionados, etc.

Vamos então criar o nosso single.php (ou usar o que está disponível para download) e apagar todo o código que está nele. Vamos usar o código base do index.php, com algumas alterações: aqui não vamos precisar de uma páginação/navegação e temos que adicionar a tag que vai chamar o ficheiro responsável pela parte dos comentários (comments.php).

Começamos por adicionar a tag dos comentários que vai ficar depois da div do artigo (<div class="artigo"> ... </div>):

<?php comments_template(); ?>

Depois alteramos parte do loop que na homepage iria mostrar a navegação. Como não precisamos de uma navegação na página do post, substitui-mos isto:

			<?php endwhile?>
				<div class="navegacao">
					<div class="recentes"><?php next_posts_link('&laquo; Artigos Anteriores') ?></div>
					<div class="anteriores"><?php previous_posts_link('Artigos Recentes &raquo;') ?></div>
				</div>
			<?php else: ?>

... por esta linha de código:

			<?php endwhile; else: ?>

E este é o código final:

<?php get_header(); ?>
	<div id="conteudo">
		<div id="artigos">
		
			<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
				<div class="artigo">
					<h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
					<p>Postado por <?php the_author() ?> em <?php the_time('d/M/Y') ?> - <?php comments_popup_link('Sem Comentários', '1 Comentário', '% Comentários', 'comments-link', ''); ?> <?php edit_post_link('(Editar)'); ?></p>
					<p><?php the_content(); ?></p>
				</div>
				
				<?php comments_template(); ?>
					
			<?php endwhile; else: ?>
				<div class="artigo">
					<h2>Nada Encontrado</h2>
					<p>Erro 404</p>
					<p>Lamentamos mas não foram encontrados artigos.</p>
				</div>			
			<?php endif; ?>
			
		</div>
		
		<?php get_sidebar(); ?>
	</div>
<?php get_footer(); ?>

Além da tag dos comentários e da alteração no loop, fizemos uma alteração que é importante em termos de SEO: no título usamos uma tag <h1> em vez da <h2>. Esta alteração é importante porque devemos dizer aos motores de busca que aquele é o principal assunto/título da página.

Por agora não tem que se preocupar com isto, mas depois seria bom que optimizasse melhor o SEO do tema. Saiba o que deve de fazer e porquê lendo o artigo Dicas SEO que faz parte da série "Como Criar um Blog de Sucesso".

page.php

Para o conteúdo que não deve de fazer parte do blog (página de contacto, sobre nós, etc), há as páginas estáticas. Estas páginas são mostradas com base no ficheiro page.php e as diferenças entre este ficheiro e o single.php são poucas, normalmente removemos o seguinte:

• informações sobre a página (data em que foi publicada, autor, categoria, etc);
• comentários;
• widgets de partilha e outras coisas que não sejam necessárias nestas páginas.

Vamos usar o código do single.php neste ficheiro, só é preciso apagar duas linhas de código: informação do post e comentários.

	<p>Postado por <?php the_author() ?> em <?php the_time('d/M/Y') ?> - <?php comments_popup_link('Sem Comentários', '1 Comentário', '% Comentários', 'comments-link', ''); ?> <?php edit_post_link('(Editar)'); ?></p>

	<?php comments_template(); ?>

Com estas alterações, temos este código:

<?php get_header(); ?>
	<div id="conteudo">
		<div id="artigos">
		
			<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>
				<div class="artigo">
					<h1><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h1>
					<p><?php the_content(); ?></p>
				</div>
			<?php endwhile; else: ?>
				<div class="artigo">
					<h2>Nada Encontrado</h2>
					<p>Erro 404</p>
					<p>Lamentamos mas não foram encontrados artigos.</p>
				</div>			
			<?php endif; ?>
			
		</div>
		
		<?php get_sidebar(); ?>
	</div>
<?php get_footer(); ?>

404.php

Este ficheiro é o template das páginas de erro 404 (não encontrado). Se alguém tenta aceder a uma página ou ficheiro que não existe ou não foi encontrado, vai ver esta página por isso ela importante para que você não perca essa visita.

Primeiro comece por informar o usuário que o que ele procura não foi encontrado e que lamenta por isso. Depois coloque ferramentas para que ele possa navegar por outras páginas do blog, alguns exemplos:

• formulário de pesquisa (busca) para que ele tente encontrar o que procura
• uma listagem das categorias ou arquivo por data
• link para a sua página de contacto para que ele possa falar consigo

É importante que a página seja simples e fácil de ler, não se esqueça que o usuário está frustrado por não conseguir ver o que procurava.

Para manter este tutorial simples, vamos adicionar apenas uma mensagem a informar o que aconteceu, mas num tema que vai ser usado num site recomendamos seguir as sugestões anteriores.

Como não há nenhum artigo ou página para mostrar, não precisamos de usar um loop. Vamos apenas pegar na div do artigo, tirar as tags php e escrever manualmente a nossa mensagem:

<?php get_header(); ?>
	<div id="conteudo">
		<div id="artigos">
			<div class="artigo">
				<h1>Erro 404 - Não Encontrado</h1>
				<p>Lamentamos, mas o que você procura não foi encontrado.</p>
			</div>
		</div>
		
		<?php get_sidebar(); ?>
	</div>
<?php get_footer(); ?>

E o nosso 404.php está pronto!

Download dos ficheiros

• Download dos ficheiros single.php, page.php e 404.php
• Download de todos os ficheiros criados até agora

Conclusão

Nesta quarta parte da série sobre a como criar um wordpress theme temos quase o nosso template pronto, faltam apenas 3 ficheiros: comments.php (comentários), sidebar.php (lateral) e o footer.php (rodapé). Vamos falar neles nos próximos dois artigos.

Se não quer perder os próximos artigos e se ainda não subscreveu a nossa newsletter, faça-o agora e passe a receber os nossos artigos por email:

[subscribeform]

Esperamos que tenha percebido bem como tudo deve de ser feito, tentamos simplificar ao máximo, mas se ainda assim tiver dúvidas deixe um comentário para que possamos ajuda-lo.