O documento fornece instruções sobre como criar temas no Drupal 7, explicando que um tema configura a aparência da informação, que CSS é essencial e permite equipes trabalharem juntas. Ele descreve a estrutura básica de um tema e arquivos como .info, page.tpl.php e node.tpl.php, além de dicas como não modificar PHP sem saber o que está fazendo.

1. Criando temas
para o Drupal 7
sexta-feira, 26 de junho de 15

2. André Pfeiffer
• designer
• programador
• professor
sexta-feira, 26 de junho de 15

3. O que é um tema?
• O tema do Drupal configura como toda a
informação vai aparecer
• O principal conhecimento para fazer um
tema no Drupal é CSS
• É possível trabalhar em equipes de
designers e programadores sem stress
sexta-feira, 26 de junho de 15

4. A estrutura de um tema no Drupal
sexta-feira, 26 de junho de 15

5. Dicas
• não tente aprender a partir de um tema
pronto
• pequenos passos
• não modifique o PHP a não ser que você
saiba o que esta fazendo
sexta-feira, 26 de junho de 15

6. arquivo .info
• o único arquivo obrigatório
• define as regiões, arquivos CSS e arquivos
JavaScript
• tem que ter o mesmo nome do diretório
• https://drupal.org/node/171205
sexta-feira, 26 de junho de 15

7. Primeiro passo
• crie o diretório do seu tema
• crie o seu arquivo .info
• ative e teste o seu tema
sexta-feira, 26 de junho de 15

8. O seu arquivo deve ser algo do tipo
sexta-feira, 26 de junho de 15

9. Ative o seu tema
(se ele não aparecer é porque você fez algo de errado)
sexta-feira, 26 de junho de 15

10. E assim que deve aparecer
(não tem nenhuma formatação CSS carregada...)
sexta-feira, 26 de junho de 15

11. page.tpl.php
• o principal arquivo do tema
• define toda a estrutura da página
• https://api.drupal.org/api/drupal/modules!
system!page.tpl.php/7
• drupal > modules > system > page.tpl.php
sexta-feira, 26 de junho de 15

12. Segundo passo
• copie o arquivo page.tpl.php do diretório
modules/system para o diretório do seu
tema
• leia o PHP em seus blocos (indentação é
importante!)
• edite apenas o necessário
• controle como aparece através do CSS
sexta-feira, 26 de junho de 15

13. page.tpl.php
sexta-feira, 26 de junho de 15

14. Além
• o principal trabalho é no page.tpl.php e no
CSS
• agora são apenas “ajustes finos”
• cada módulo, padrão ou não, tem seus
arquivos .tpl.php
• basta copiar esses arquivos que você
precisar editar para o seu tema
• limpe sempre o cache (configurações >
desempenho > limpar todos os caches)
sexta-feira, 26 de junho de 15

15. node.tpl.php
• define como um conteúdo (node) aparece
• page.tpl.php > region.tpl.php >
block.tpl.php > node.tpl.php
• https://api.drupal.org/api/drupal/modules!
node!node.tpl.php/7
• drupal > modules > node > node.tpl.php
sexta-feira, 26 de junho de 15

16. field.tpl.php
• define como um campo aparece
• page.tpl.php > region.tpl.php >
block.tpl.php > node.tpl.php > field.tpl.php
• https://api.drupal.org/api/drupal/modules!
field!theme!field.tpl.php/7
sexta-feira, 26 de junho de 15

17. variações
• praticamente todo arquivo de tema pode
ter uma variação
• page--front.tpl.php
• node--article.tpl.php
• field--field_cursos.tpl.php
• https://drupal.org/node/1089656
sexta-feira, 26 de junho de 15

18. e o PHP?
• o arquivo template.php pode sobreescrever
qualquer variável
• também pode criar variáveis, modificar
formulários
• no arquivo template.php você pode atuar
antes ou depois que um arquivo tpl.php é
renderizado
sexta-feira, 26 de junho de 15

19. Dúvidas?
andre@pfeiffer.com.br
sexta-feira, 26 de junho de 15