Quando você usa o WordPress como um CMS completo e versátil, ou quando você está criando um website para uma empresa, o mais provável é que em determinadas alturas, você precise criar páginas diferentes com layouts diferentes, para mostrar produtos ou informações completamente distintas. É precisamente para isso que servem os Custom Page Templates do WordPress. Se você visitar o SEO Guide for Beginners criado pelos colegas da SEOmoz, você irá perceber que essa página é totalmente diferente de todas as outras que estão no site. E o melhor de tudo é que o WordPress permite-lhe fazer isso de uma forma super simples e atrativa, conforme os colegas do wp.tuts explicaram recentemente.
PORQUÊ USAR UM CUSTOM PAGE TEMPLATE?
Um Custom Page Template é um ficheiro que está dentro do diretório do seu template wordpress. Com ele, você pode criar páginas completamente diferentes e com layouts diferentes das páginas padrão do WordPress (page.php). Você pode usar Custom Page Templates ilimitados, e usar o template que bem desejar para uma determinada página, bastando para isso escolher o template no menu drop-down do editor de páginas do WordPress.
Por vezes, será desnecessário você criar custom page templates para as suas páginas. Por exemplo, imagine que o seu ficheiro page.php, que é usado para mostrar todas as páginas do seu website, tem uma função de chamada para mostrar os ícones de mídias sociais, desta forma:
<!--?php social_networking_icons(); ?-->
Imagine que você tem uma página “Contatos” nesse website, e que nessa página de “Contatos” você não pretende mostrar os ícones de mídias sociais. Você pode obviamente criar um custom page template chamado “Página de Contatos” e não inclui nele a função de chamada dos ícones de mídias sociais. No entanto, um método bastante mais simples é o de chamar uma declaração if para mostrar os ícones de mídias sociais apenas nas páginas que não sejam a página “Contatos”. Veja:
<!--?php if(!is_page('Contatos')) { social_networking_icons(); } ?-->
Esta opção de usar uma declaração if é bastante importante e deve ser usada, especialmente se você vai usar a função em várias páginas. Nas páginas onde não pretende mostrá-la, usa um if para contornar o problema.
Um exemplo bastante popular de utilização do custom page template são as páginas ‘full-width’ ou seja, de largura completa. A grande maioria dos templates wordpress têm 2 ou 3 colunas: uma coluna ‘conteúdo principal’ onde aparecem os artigos e páginas, e uma ou duas sidebars que mostram widgets. Muitas vezes um usuário poderá querer tomar partido de uma página com largura completa (sem sidebar portanto) e normalmente ele opta por esconder a sidebar ao invés de aumentar a área de conteúdo principal. As páginas que incluem galerias de imagens ou vídeos são as mais usadas com custom page templates.
Criar um custom page template pode ser uma operação simples ou complexa, dependendo do nível de funcionalidade que você pretende empregar.
COMO CRIAR UM CUSTOM PAGE TEMPLATE
Tenha em atenção que se você efetuar estas alterações em seu template, ele poderá quebrar. Se pretender realizar testes, faça-os num site para o efeito ou num blog que você não use, ou ponha seu blog atual em modo de manutenção. É recomendável também que faça backups antes de implementar alterações desse nível.
Todos os custom page templates devem começar com o seguinte código. Este código diz ao WordPress que o ficheiro é um custom page template, e define o nome do template.
<!--?php /* Template name: My Custom Page Template */ ?-->
Obviamente, a parte que diz ‘My Custom Page Template’ você pode alterar para o nome que desejar dar ao template!
NOME DE FICHEIROS
As boas práticas dizem que você deve linkar o seu custom page template com o prefixo ‘page_’ (‘page_contatos.php’, ‘page_fullwidth.php’). Dessa forma, todos os ficheiros ficam corretamente agrupados na pasta de ficheiros do seu template wordpress.
A forma mais rápida de você começar a criar custom page templates é copiando o código do seu ficheiro page.php para um novo ficheiro, e tornar esse novo ficheiro num custom page template como vimos anteriormente. Dessa forma você pode modificar, eliminar e editar código e visualizar essas modificações em tempo real na sua página. Vamos testar!
- No seu editor de código, crie um novo ficheiro no diretório do template que está usando. Chame-o de ‘page_test.php’.
- No topo do ficheiro, insira o seguinte código:
<!--?php /* Template name: Test */ ?-->
- Abra o ficheiro page.php que o seu template está usando.
- Seleccione todo o código e copie-o.
- Cole o código por baixo do código usando no ponto 2.
- Guarde o ficheiro. Carregue-o para o diretório do seu template.
- Faça login no WordPress e edite a página onde pretende usar o seu novo Custom Page Template.
- Onde estão os ‘Atributos da Página’ seleccione o modelo ‘Test’ através do drop-down.
- Atualize/Publique a página.
Agora, quando você for ver a sua página, ela deverá parecer-se precisamente idêntica! Isso acontece porque não fizemos nenhuma alteração de código nesse custom page template ainda! Mas é bom para você ver que a página está funcionando. Se a sua página estiver a apresentar algum erro, tenha a certeza de que copiou o código do ficheiro page.php corretamente.
Para confirmar que a sua página está a usar o ficheiro ‘page_test.php’ ao invés do ‘page.php’, elimine algumas porções de código no ficheiro ‘page_test.php’, guarde o ficheiro, e volte a carregá-lo para o servidor. Refresque a sua página, e a porção de código que você eliminou não deverá estar aparecendo.
A partir daqui, você tem um mundo de oportunidades pela frente! Desde que você mantenha o código ‘Template name:’ no topo do ficheiro, você pode fazer aquilo que bem desejar! O seu template não precisa usar sintaxe do WordPress, basta usar HTML simples para funcionar corretamente!
CRIAR UM CUSTOM PAGE TEMPLATE COM FULL-WIDTH
Como referimos anteriormente, Full-Width, significa largura completa, ou seja, você pode criar um Custom Page Template com a largura completa do seu blog, não aparecendo a sidebar por exemplo.
Comece por criar uma página com o nome ‘page_fullwidth.php’. Adicione o código seguinte ao topo do ficheiro, e depois copie o código da sua página ‘page.php’ e cole-o depois desse primeiro código “Template Name:”.
<!--?php /* Template name: Full Width */ ?-->
Vamos assumir que algues no código desse template se encontra isto:
get_sidebar();
Se é o caso, remova esse código. Se ele está inserido entre outros elementos, como por exemplo divs, que poderão afectar o layout da página – elimine esses elementos também.
Vamos também assumir que o conteúdo HTML da página começa com a div que tem a declaração CSS que define a largura da página, e que a coloca a flutuar à esquerda ou à direita. A essa div, adicione a classe ‘fullwidth’. Guarde o ficheiro e carregue-o para o seu servidor. Não se esqueça também de seleccionar o seu Custom Page Template através de uma página do WordPress.
Abra o ficheiro ‘style.css’ do seu template. Adicione o seguinte código, num local à sua escolha:
.fullwidth {width: 100%;}
Guarde e recarregue o ficheiro ‘style.css’, e atualize a página onde colocou a classe ‘Full Width’. Poderá voltar atrás e ajustar a sua declaração de CSS se necessário. Caso não tenha funcionado corretamente, isso poderá ter a ver com a programação do template que está usando, pelo que deverá analisar o código e fazer as alterações necessárias.
Até Já!