Pesquisa no site

Itens ativos

Login do usuário

Assine o RSS do Drupal-BR

Como Criar um Tema Para Drupal 6 - Parte 02

IMPORTANTE: Para acompanhar todo esta parte do tutorial, você precisar ter conhecimentos em PHP razoáveis para entender como manipular funções.

Nesta segunda parte de nosso tutorial, vamos explorar uma ligação muito importante existente entre o arquivo ".info" de um tema, os outros arquivos templates fundamentais de um tema, os templates padrão e os "template suggestions" (alternativos).

Dica: No tutorial anterior me esqueci de dar uma dica importante. Quando estamos trabalhando com CSS, Javascript, ou mesmo os arquivos de templates nos temas do Drupal é preciso limpar o registro constantemente, caso contrário você não visualiza as alterações com facilidade. Para resolver este problema, abra o arquivo "template.php" do tema em uso, e coloque a chamada à função:

drupal_rebuild_theme_registry();

Uma vez feito isto, as atualizações constantes ficarão sempre disponíveis imediatamente. Entretanto, após terminado o processo de produção de um novo tema, retire a mesma linha do arquivo "template.php".

Alterando o Tema Para as Páginas de Administração

No Drupal é possivel utilizar um tema específico para a área administrativa e outro para o site em si. Navegue até "/admin/settings/admin" e veja que há um menu dropdown com os temas listados em ordem alfabética. Ao salvar as configurações com um tema diferente do site ao acessar as páginas administrativas você navegará com a interface usando o tema escolhido. Há um checkbox que permite ativar este tema para a área de edição/criação de conteúdos.

Para continuar com esta parte do tutorial, escolha o tema "Tutorial" e salve as configurações, embora o mesmo não esteja formatado corretamente ainda.

Recursos Disponíveis na Área Administrativa

O arquivo ".info" possui um como que "segredinho". As chave "features" do arquivo ".info" de um tema para Drupal 6 tem um papel muito importante na área administrativa do Drupal.

Com elas é possivel ativar ou desativar o acesso à recursos no tema, como por exemplo o Logotipo, o Nome do Site, os Links Primários e qualquer Recurso (feature) existente no arquivo ".info" a partir de uma interface amigável.

O nosso arquivo "tutorial.info", que se encontra na primeira parte deste tutorial atualmente está sem qualquer chave "feature[]" e desta forma os valores padrões são assumidos e o acesso à todos estes recursos também.

Acesse a área administrativa do Drupal em /admin/build/themes/settings/tutorial e você deverá ver os seguintes checkboxes na página:

Recursos Padrão

Se você notar, o checkbox "Site Slogan" está desmarcado e os checkboxes User pictures in posts, User pictures in comments e Searchbox estão desabilitados. Você deve estar se perguntando porque os três checkboxes estão desabilitados se eles são parte dos recursos padrões.

No caso de User pictures in posts e User pictures in comments, se dá pelo fato de a opção "Picture Support" estar marcada como "Disabled" por padrão. Acesse /admin/user/settings e altere esta opção para "Enabled" caso queira exibir imagens dos usuários em posts e comentários, e automaticamente os checkboxes ficarão habilitados.

Já no caso do "Search" é devido ao módulo não estar ativado. Ative o módulo que o checkbox será habilitado.

Vamos fazer um jogo rápido para comprovar a funcionalidade desta interface.

Abra o arquivo "tutorial.info", insira duas quebras de linhas após "engine = phptemplate" e coloque as chaves:

features[] = logo

features[] = name

features[] = slogan

features[] = mission

features[] = node_user_picture

features[] = comment_user_picture

features[] = search

features[] = favicon

features[] = primary_links

features[] = secondary_links

Agora comente as linhas:

;features[] = node_user_picture

;features[] = comment_user_picture

;features[] = search

Acesse /admin/build/themes/settings/tutorial e veja que os checkboxes comentados sumiram!

Retirados alguns recursos da exibição

Eu alterei o arquivo ".info" e ao atualizar a página do navegador as alterações apareceram; caso você não veja alterações e todos os checkboxes continuem ali, vá em "/admin/settings/performance" e procure pelo botão "Clear Cached Data" logo no final do conteúdo desta página. Depois volte à "/admin/build/themes/settings/tutorial " e veja que os checkboxes sumiram. Isto é preciso pois estas informações ficam guardadas no cache do Drupal; uma nota interessante: o Drupal trabalha com Dados em Cache e tem um Registro de Temas, quando você trabalha com um tema e precisa limpar o Registro, você não está limpando o Cache do Drupal, senão estaria apagando outras informações relevantes ao sistema também armazenadas e vice-versão. Por este motivo não confunda o fato destas informações referentes ao tema estarem sendo armazendas em Cache e você ter que apagar todo o Cache para poder ver qualquer alteração.

Voltando ao nosso assunto. Estas alterações também são obtidas removendo as respectivas chaves no arquivo ".info" ao invés de comentá-las.

Vale lembrar aqui o seguinte: este recurso habilita ou não o usuário da interface de acessar tais recursos e ativar ou não os mesmos no site, entretanto, se você ocultar um item, ele não será desativado, somente não aparecerá na lista, e ainda, caso você oculte um item desmarcado isto quer dizer que não será permitido ao usuário da interface alternar para a ativação e vice-versa.

Criando Regiões Personalizadas para os Blocos

Algo que foi facilitado no Drupal 6 é a criação de Regiões personalizadas.

Uma região é um bloco de conteúdo existente e pré-definido pelo admistrador do site e que são passados ao tema pelas variáveis mais comuns: $header, $left, $right, $content e $footer.

As regiões são registradas no arquivo ".info" e podem ser acessadas pelas chaves regions[].

Os valores padrões não precisam ser especificados no arquivo ".info" entretanto, caso você queria personalizar seu tema e criar uma nova região, então você precisará inserir todas as regiões, pois ao inserir uma chave regions[] o Drupal vai analisar o conteúdo do arquivo, procurar pelos regions registrados e caso encontre uma ou mais de uma, o que ele não encontrar além disso entenderá que deve omitir da exibição.

Os valores padrões como já vimos na primeira parte de nosso tutorial são:

regions[left] = Left sidebar

regions[right] = Right sidebar

regions[content] = Content

regions[header] = Header

regions[footer] = Footer

O que temos aí é simples de entender:

regions: É a chave indicando a existencia de uma região.
[nome]: É especificamente o nome que esta chave possui internamente no Drupal e que será a variável usada para criar o conteúdo no tema.
= Qualquer nome: É o nome da chave humanamente acessível. Você pode alterar os nomes padrões também.

Então, para se criar uma nova região, como por exemplo, "publicidade" bastaria fazer o seguinte:

regions[publicidade] = Publicidade

E logo você precisaria inserir as demais regiões padrões para não perder a visualização delas no tema.

regions[publicidade] = Publicidade

regions[left] = Left sidebar

regions[right] = Right sidebar

regions[content] = Content

regions[header] = Header

regions[footer] = Footer

Obrigatóriamente, limpe os dados em Cache em "/admin/settings/performance"; caso contrário, você não verá as alterações.

Uma vez feito isto, basta você criar um local dentro da estrutura de seu tema, e passar o nome da chave como variável, neste caso "$publicidade".

Para testar este recurso, altere o arquivo "page.tpl.php" do tema "tutorial" colocando o código abaixo logo acima do rodapé de nosso arquivo:

<?php if($publicidade): ?>

<div id="publicidade"><?php print  $publicidade; ?></div><!-- /publicidade -->

<?php endif; ?>

O arquivo "page.tpl.php" agora deve estar assim:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--   Acrescentamos aqui o idioma da pagina e a direção do texto do idioma   -->

<html xmlns="http://www.w3.org/1999/xhtml" 

xml:lang="<?php print $language->language ?>"

lang="<?php print $language->language ?>" dir="<?php print $language->dir ?>">

<head>

<!-- Removemos a tag meta   contendo o tipo do documento e o charset

-- para inserir estas informações de   acordo com as configurações

-- informadas ou obtidas pelo   Drupal

-->

<?php print $head ?>

<!-- Inserimos o   título da página que varia dinamicamento -->

<title><?php print $head_title ?></title>

<!-- Inserimos a importação de folhas   de estilos -->

<?php print $styles ?>

<!-- Carregamos os   arquivos javascript necessários -->

<?php print $scripts ?>

</head>

<!-- Colocamos uma função na tag   BODY

-- que irá criar um atributo class na mesma

-- e controlar o valor   deste atributo de acordo

-- com as configurações dos Blocks em uso

-- Esta   função foi herdada do tema padrão Garlando

-- no arquivo   "template.php"

-->

<body<?php print phptemplate_body_class($left,   $right); ?>>

<!-- Layout --> 

<div   id="externo">

<div id="cabecalho">

<?php /* Imprime o conteudo definido nos   Blocks para o Header (cabeçalho) */ ?>

<?php print $header; ?>

<!-- Herdado do Garland -->

<div   id="logotipo">

<?php

//   Prepara o cabeçalho criando um array com algumas informações do   site

$site_fields = array();

// se o nome do   site existe

if ($site_name) {

/**

* Codifica caracteres especiais   num string de texto puro para exibir o nome do site como HTML.

*/ 

$site_fields[] = check_plain($site_name);

}

if ($site_slogan) {

/**

* O mesmo que ocorre com o nome   do site ocorre com o slogan

*/

$site_fields[] = check_plain($site_slogan);

}

/*

* Une as chaves de $site_fields   com espaços para criar o title

*/

$site_title = implode(' ',   $site_fields);

/**

* Se todas as informações foram   passadas

*/

if ($site_fields) {

// coloca o nome do site entre tags   SPAN

$site_fields[0] = '<span>'. $site_fields[0] .'</span>';

}

/*

* Une as chaves de $site_fields com espaços para criar o   HTML

*/

$site_html = implode(' ', $site_fields);

//   Testa se $logo ou $site_title possuem valor

if   ($logo ||   $site_title) {

// Cria um cabeçalho com o um link para a   pagina inicial filtrando-o contra protocolos indesejáveis (XSS)

print '<h1><a href="'. check_url($front_page) .'"   title="'. $site_title .'">';

// se o logo   existir

if ($logo) {

print '<img src="'. check_url($logo) .'"   alt="'. $site_title .'" id="logo"   />';

}

// Imprime o HTML   com o nome do site final

print $site_html .'</a></h1>';

}

?>

<?php /*   Imprime os links primarios se eles existirem */ ?>

<?php if (isset($primary_links)) : ?>

<?php print theme('links', $primary_links, array('class' =>   'links primary-links')) ?>

<?php endif; ?>

<?php /*   Imprime os links secundários se eles existirem */ ?>

<?php if (isset($secondary_links)) : ?>

<?php print theme('links', $secondary_links, array('class' =>   'links secondary-links')) ?>

<?php endif; ?> 

</div> 

</div><!-- /cabecalho   -->

<?php /* Se existir   algum Block a ser exibido na esquerda, então esta coluna será montada com o   respectivo conteúdo */ ?> 

<?php if ($left): ?>

<div id="esquerda">

<?php /* Se a caixa de busca estiver   ativada e esta coluna exista, ela aparecerá na esquerda */ ?>

<?php if ($search_box): ?><div class="block block-theme"><?php print $search_box ?></div><?php endif; ?>

<?php print $left ?>

</div><!-- /esquerda --> 

<?php endif; ?> 

<?php /* Se existir algum Block a ser exibido na esquerda, então esta   coluna será montada com o respectivo conteúdo */ ?> 

<?php if ($right): ?>

<div   id="direita">

<?php /* Se a   caixa de busca estiver ativada e a coluna esquerda não exista, ela aparecerá na   direita */ ?>

<?php if (!$left &amp;&amp; $search_box): ?><div class="block   block-theme"><?php print $search_box ?></div><?php endif; ?>

<?php print $right ?>

</div><!--   /direita -->

<?php endif;   ?> 

<div id="centro">

<?php /* Imprime o breadcrumb do site   */ ?>

<?php print $breadcrumb; ?>

<?php /* Imprime a missão do site caso   ela exista */ ?>

<?php if ($mission): print '<div id="mission">'. $mission   .'</div>'; endif; ?>

<?php /*   Imprime as tabs das páginas que as usem */ ?>

<?php if ($tabs): print '<div id="tabs-wrapper"   class="clear-block">'; endif; ?>

<?php /*   Imprime o título do node */ ?>

<?php if ($title): print '<h2'. ($tabs   ? ' class="with-tabs"' : '') .'>'. $title   .'</h2>'; endif; ?>

<?php if ($tabs): print '<ul class="tabs   primary">'. $tabs .'</ul></div>'; endif; ?>

<?php /*   Imprime tabs secundarias */ ?>

<?php if ($tabs2): print '<ul class="tabs secondary">'. $tabs2 .'</ul>'; endif; ?>

<?php /* Imprime informações relevantes   ao usuário */ ?>

<?php if ($show_messages &amp;&amp; $messages): print $messages; endif; ?>

<?php /* Imprime ajuda caso esteja   disponível */ ?>

<?php print $help; ?>

<?php /* Imprime todo o conteúdo especificado no Block Content */   ?>

<?php print $content ?>

<?php /* Imprime os feeds da página   */ ?>

<?php print $feed_icons ?> 

</div><!-- /centro --> 

<-- NOVA REGIÃO PUBLICIDADE QUE FOI CRIADA -->

<?php if($publicidade): ?>

<div id="publicidade"><?php print  $publicidade; ?></div><!-- /publicidade -->

<?php endif; ?>

<div id="rodape">

<?php /* Imprime a mensagem do rodapé, e   os Blocks selecionados como Footer */ ?>

<?php print $footer_message . $footer ?>

</div><!-- /rodape --> 

</div><!-- /externo -->

<?php /* Marcação final de fechamentos diversos */ ?>

<?php print $closure ?>

</body> 

</html>

Depois de ter realizado as alterações acesse a área administrativa em "/admin/build/block" e veja que logo acima do rodapé apareceu uma nova região para o Block "publicidade" recém criado!

Nova Região para o Bloco Publicidade

Breadcrumb

O Breadcrumb do Drupal não possui um local específico para ativá-lo ou desativá-lo, por este motivo algumas das soluções no caso de você não querer que o mesmo seja exibido em seu tema, são:

Apagar o bloco correspondente no arquivo "page.tpl.php" onde se encontra a variável-chave $breadcrumb
Criar uma função que somente exiba o breadcrumb nas páginas administrativas.

Sobreescrevendo as Saídas dos Temas

Agora que já temos uma boa base para entendermos os aspectos mais fundamentais de um tema para Drupal 6 podemos nos aprofundar no que há de mais belo no
Drupal: "o Poder Sobreescrever ou Extender quase tudo".

Podemos sobreescrever quase tudo em um Tema para Drupal 6 e isto nos dá muita flexibilidade.

Relembrando:

Ao utilizar uma tecnologia OpenSource, sempre que possível "SOBREESCREVA" ou "EXTENDA" os recursos da mesma; nunca modifique!

Imagine que você não goste da forma como o Drupal exibe algo por padrão nos módulos, usando o exemplo que se encontra na documentação do Drupal, você gostaria de colocar uma lupa no lado do formulário de buscas (Search Box). Então, você pode procurar pelo arquivo ".tpl" no diretório do módulo e copiá-lo para o diretório de seu novo tema. Feito isto, basta você abrir o arquivo e alterar livremente até obter o resultado desejado.

OBSERVAÇÃO: Como vamos estar trabalhando com atualizações constantes no tema a partir de agora, caso não tenha feito isto ainda, por favor, abra seu arquivo "template.php" e insira a linha abaixo na última linha do arquivo para que os registros de seu tema sejam limpos a cada atualização de página a fim de obtermos vizualização imediata das alterações.

drupal_rebuild_theme_registry();

O Drupal possui uma maneira bem simples de se sobreescrever algo:

Localize o módulo responsável pela marcação HTML.
Faça um dos seguinte:
- Se o módulo possui um arquivo template (.tpl), copie este template para a pasta de seu tema.
- No núcleo do módulo, identifique a função de pré-processamento (preprocess) que está gerando a marcação que você deseja alterar e copie ela e todo o seu conteúdo para o arquivo "template.php" do novo tema. Você vai precisar alterar o prefixo "theme_" ou "template_" para corresponder com o nome do novo tema. No caso de nosso tema "tutorial", se quiséssemos sobreescrever as funções "theme_breadcrumb" e "template_preprocess_page", ficaríamos com "tutorial_breadcrumb" e "tutorial_preprocess_page" em nosso arquivo "template.php".
Dentro da função ou arquivo template, modifique o código da marcação HTML para se adaptar à sua necessidade.
Atualize o cache do tema.

NOTA: A auto descoberta de sobreescrita de temas é realizada pelo PHPTemplate, por isto é necessário que a chave "engine" no arquivo ".info" esteja com o valor para "phptemplate", caso contrário não irá funcionar.

Colocando isto em prática, caso você não tenha ativado o módulo Search, vá em "/admin/build/modules" e ative-o primeiro. Verifique se o formulário de busca está sendo exibido em algum bloco, caso contrário, vá em "/admin/build/blocks" e escolha uma posição para ele. Copie o arquivo "/modules/search/search-block-form.tpl.php" para "/sites/all/themes/tutorial/" e apague todo o conteúdo e insira o conteúdo abaixo:

<div class="container-inline">

<img src="http://www.gilbertoalbino.com/tutoriais/img/icon-busca.png" align="absmiddle" />

<?php print  $search_form; ?>

</div>

Atualize sua página e você verá uma lupinha no lado do texto da busca igual à figura abaixo:.

Você viu como é fácil sobreescrever?

Vamos testar uma alteração realizada diretamente em uma função.

Abra o arquivo "template.php" e coloque o seguinte bloco após a funçao phptemplate_body_class():

function theme_breadcrumb($breadcrumb) {

        if (!empty($breadcrumb)) {

            return '<div class="breadcrumb">'. implode(' » ', $breadcrumb) .'</div>';

    }

}

Esta é a função intocada que gera o Breadcrumb padrão nos temas.

Renomeie "theme_breadcrumb" para "tutorial_breadcrumb".

Navegue até "/admin/settings/site-information" e caso você esteja utilizando outro tema para as páginas de edição de conteúdo, altere o tema para "tutorial" em "/admin/settings/admin" a fim de poder acompanhar esta sequência.

Você verá a seguinte exibição:

Visualização do Breadcrumb original

Como você pode ver o Breadcrumb está usando o separador " » ".

Note no código após o comando "return" da função "tutorial_breadcrumb" que o PHP está unindo (implodindo) as parte do array breadcrumb com o separador "»":

return '<div class="breadcrumb">'. implode(' » ', $breadcrumb) .'</div>'; 

Embora isto seja legal, nós queros testar alguma alteração através de funções diretamente no arquivo template.php.

Modifique a função "tutorial_breadcrumb" conforme abaixo e atualize a página:

function tutorial_breadcrumb($breadcrumb) {

  if (!empty($breadcrumb)) {

    return '<div class="breadcrumb">'. 

    implode(' <img src="'

     .check_url('http://www.gilbertoalbino.com/tutoriais/img/seta-breadcrumb.png').'" /> ',

     $breadcrumb

    )

  .'</div>';

  }

}

Você verá o breadcrumb alterado com imagens no lugar do separador:

Breadcrumb alterado

Arquivos Templates Padrões

O Núcleo (Core) do Drupal contém vários módulos que já vem pré-instalados. Alguns destes já são obrigatórios e outros permitem ser ativados depois da instalação, como é o caso do módulo Search.

Alguns dos módulos possuem arquivos templates e todos podem ser sobreescritos utilizando o procedimento que vimos anteriormente.

Segue abaixo a listagem completa dos arquivos templates padrões do Drupal. Para alterar um destes arquivos, basta copiá-lo para a pasta de seu tema.

Aggregator

"modules/aggregator/..."

aggregator-feed-source.tpl.php
aggregator-item.tpl.php
aggregator-summary-item.tpl.php
aggregator-summary-items.tpl.php
aggregator-wrapper.tpl.php

Block

"modules/system/..."

block.tpl.php

"modules/block/..."

block-admin-display-form.tpl.php

Book

"modules/book/..."

book-all-books-block.tpl.php
book-export-html.tpl.php
book-navigation.tpl.php
book-node-export-html.tpl.php

Comment

"modules/comment/..."

comment-folded.tpl.php
comment-wrapper.tpl.php
comment.tpl.php

Forum

"modules/forum/..."

forum-icon.tpl.php
forum-list.tpl.php
forum-submitted.tpl.php
forum-topic-list.tpl.php
forum-topic-navigation.tpl.php
forums.tpl.php

Node

"modules/node/..."

node.tpl.php

Poll

"modules/poll/..."

poll-bar-block.tpl.php
poll-bar.tpl.php
poll-results-block.tpl.php
poll-results.tpl.php
poll-vote.tpl.php

Profile

"modules/profile/..."

profile-block.tpl.php
profile-listing.tpl.php
profile-wrapper.tpl.php

Search

"modules/search/..."

search-block-form.tpl.php
search-result.tpl.php
search-results.tpl.php
search-theme-form.tpl.php

User

"modules/user/..."

user-picture.tpl.php
user-profile-category.tpl.php
user-profile-item.tpl.php
user-profile.tpl.php

System

"modules/system/..."

page.tpl.php
maintenance-page.tpl.php
box.tpl.php

Variáveis Disponíveis Para os Arquivos .tpl dos módulos

Na primeira parte deste nosso tutorial nós vimos as variáveis-chaves do arquivo "page.tpl.php".

Cada arquivo de template possui um conjunto de variáveis especificas.

Todas elas estão comentadas no cabeçalho de todos os arquivos ".tpl" e infelizmente estão em inglês limitando o total aproveitamente da interpretação somente por quem domina o suficiente do inglês.

Para salvar a barra dos amigos desenvolvedores que não dominam o inglês, vou deixar traduzido no final deste tutorial todos os termos encontrados em cada arquivo dos módulos no núcleo do Drupal. E se de alguma forma você precisar modificar algo no template destes arquivos, você poderá estar consultando futuramente como um guia de referência.

Templates Suggestions ou Templates Alternativos

Além de ser possível extender os templates padrões da maior parte módulos do Drupal, também é possível ir um nível adiante e encontrar situações de personalização isoladas para um arquivo em especifíco a partir de uma sugestão gerada por um conteúdo criado sem precisar modificar todo o visual de um tipo de node, mas somente quando tal situação for encontrada. Complicou? Não! Veja o exemplo abaixo:

Suponha que você criou uma página (page) e que o "node" dela é "7", internamente o Drupal estará chamando o template padrão "node-tpl.php" para exibir o conteúdo.

Este "node" possui o tipo "page". Com estas duas informações já temos uma sugestão: "node-page.tpl.php". Bastaria você criar um arquivo com este nome, copiar o conteúdo de "node.tpl.php" dentro dele e modificá-lo para se adaptar às novas necessidades visuais. Com isto todo node do tipo "page" seria modificado de acordo com as alterações que você realizou no arquivo "node-page.tpl".

IMPORTANTE: Para que os Templates Alternativos funcionem é preciso que o template base (que é o template padrão usado para extender o tema) esteja no mesmo diretório do tema. Neste caso, por estarmos utilizando "node.tpl-php" este já deve estar em seu tema, mas caso você utlize outra sugestão de template, copie o template base para a pasta do tema em questão.

Vamos criar uma situação hipotética aqui onde você quer sua página limpinha sem nada além do título e conteúdo.

Crie uma "Page" com o Título "Currículo" e com o Conteúdo abaixo:

Este é meu currículo:

Sei programar em PHP

Sei programar em Javascript

Sei criar temas para Drupal 6

Me contrate!

Agora crie um arquivo chamado "node-page.tpl.php". Copie o conteúdo do arquivo "node.tpl.php" para dentro deste novo arquivo.

Muitas coisas estão sendo exibidas ai, você somente quer o Titulo e o Conteúdo, então para agilizar o processo apenas copie o código abaixo para dentro de seu arquivo "node-page.tpl.php" removendo o que você colou anteriormente:

<h1><?php print  $title ?> nos Pages em Geral</h1>

<div id="node-<?php print  $node->nid; ?>"

    class="node<?php if ($sticky) { print  ' sticky'; } ?>

    <?php if (!$status) { print  ' node-unpublished'; } ?>">

    <div class="content clear-block">

        <?php print  $content ?>

    </div>

</div>

Você terá esta exibição:

Pages modificados

Isto é muito interessante, mas não é a melhor solução em alguns casos!

Suponhamos que você criou 2 páginas para seu site (curriculo e servicos, respectivamente com os nodes de IDs 7 e 8) e que você gostaria de modificar somente estes dois nodes do tipo "page". Então encontramos uma situação isolada aqui, logo, o Drupal permite ir além e criar os seguintes arquivos templates isoladamente sem precisar alterar "todos" os nodes do tipo page como na situação anterior.

node-page-7.tpl.php
node-page-8.tpl.php

Agora, você pode criar estes dois arquivos e modificá-los isoladamente; copiando o conteúdo do arquivo node.tpl.php dentro deles e modificando-os.

IMPORTANTE: Neste caso você também precisa inserir o arquivo base "node-page.tpl.php" para a pasta de seu tema e criar uma função de pré-processamento, caso contrário não funcionará. Continue com o próximo tópico para resolvermos isto!

Criando uma função preprocess para nosso arquivo node-page-NID.tpl.php

NOTA: NID é o Id do node em questão.

Vou tentar ser o mais breve possível aqui.

Uma função preprocess é usada para definir variáveis para um tema e se destinam somente à aplicação de temas em Hooks implementados como templates.

Para que suas funções pré-processadoras associadas como hook funcionem, os arquivos templates correpondentes devem existir na pasta do tema.

Existem algumas funções pré-processadoras no Drupal, entretanto, vamos nos ater à uma delas:

template_preprocess_hook

Em futuros tutoriais pretendo me apronfundar na criação de módulos para o Drupal e estarei tratando vários assuntos relacionados ao Núcleo do Drupal, mas por hora, basta saber que um "hook" é um conceito usado no Drupal que permite a extensão de módulos facilmente a partir de um conjunto definido de parâmetros e um tipo de resultado especificado.

No arquivo "template.php", insira o código abaixo:

function tutorial_preprocess_node(&$vars) {

  $node = $vars['node'];

  $vars['template_files'][] = 'node-' . $vars['type'] . '-'. $node->nid;  

  return $vars;

}

Como você pode notar o prefixo da função foi alterado para "tutorial_" e o sufixo do hook para "_node". Como estamos implementando o node, então informamos ao hook que vamos altera-lo no tema "tutorial"; passamos a variável "$vars" por referência a fim de acessarmos as informações declaradas nela externamente. Foi criado uma variável $node a partir de $var['node'] para podermos acessar o id do node que vamos trabalhar.

Na linha:

$vars['template_files'][] = 'node-' . $vars['type'] . '-'. $node->nid;  

é onde acontece toda a mágica, nós atribuímos à chave "template_files" o padrão referente que queremos transformar em template.

Queremos que o template pré-definido processe o node de determinado tipo com determinado id.

Feito isto, agora podemos criar o arquivo isoladamente.

O meu Page aqui gerou um id 8, então o NID aqui é 8. Dependendo do seu NID ai altere o nome do arquivo de acordo:

[node-page-8.tpl.php]

<h1><?php print  $title ?> no Page isolado para o NID</h1>

<div id="node-<?php print  $node->nid; ?>"

class="node<?php if ($sticky) { print  ' sticky'; } ?>

<?php if (!$status) { print  ' node-unpublished'; } ?>">

<div class="content clear-block">

<?php print  $content ?>

</div>

</div>

Atualize a página do seu node e veja que o arquivo "node-page.tpl.php" não está mais sendo exibido, embora ele exista ainda!

Você deverá ter a seguinte visualização:

Alteração do Template Isolado para o NID

Bom, agora fica fácil associar as coisas.

Módulo Devel

O módulo Devel é uma boa alternativa para inspecional os complementos de seu tema no processo de desenvolvimento. Ele funciona ao modelo do Firebug do Firefox e permite localizar precisamente informações relevantes aos nodes da pagina atual e oferecendo sugestões para funções de pré-processamento e templates alternativos.

Veja a imagem abaixo:

Screenshot Módulo Devel

Fonte: http://drupal.org/project/devel

Bonus - Tradução das Variáveis na Documentação dos Arquivos .tlp dos Módulos

modules/aggregator/aggregator-feed-source.tpl.php

$source_icon: Ícone do Feed com o link para a fonte. Exibido por theme_feed_icon().
$source_image: Imagem definida pela fonte do feed.
$source_description: Descrição definida pela fonte do feed.
$source_url: URL para a fonte do feed.
$last_checked: Quanto tempo atrás o feed foi verificado localmente.

modules/aggregator/aggregator-item.tpl.php

$feed_url: URL para feed de origem.
$feed_title: O Título do item do feed.
$source_url: Link para a seção da fonte local.
$source_title: Título da fonte remota.
$source_date: Data na qual o feed foi postado na fonte remota.
$content: Conteúdo do item do feed.
$categories: Categorias com os links atribuídos ao feed.

modules/aggregator/aggregator-summary-item.tpl.php

$feed_url: Link para o feed de origem.
$feed_title: Título do feed.
$feed_age: Idade do feed remoto.
$source_url: Link para a fonte remota.
$source_title: title definido localmente para a fonte.

modules/aggregator/aggregator-summary-items.tpl.php

$title: Título para o feed ou categoria.
$summary_list: Lista desordenada de items com links dos items do feed gerados por theme_item_list().
$source_url: URL para a fonte local ou categoria.

modules/aggregator/aggregator-wrapper.tpl.php

$content: Todo o conteúdo de aggregator.
$page: Links do Pager exibidos por theme_pager().

modules/block/block-admin-display-form.tpl.php

$block_regions: Um array de regions. Organizados por nomes com o título como valor.
$block_listing: Um array de blocks organizados por região e em seguida por delta.
$form_submit: Botão submit do formulário..
$throttle: TRUE ou FALSE dependendo se o módulo throttle esteja ativado.

Cada $data em $block_listing[$region] contém:

$data->region_title: Título da região para o bloco listado.
$data->block_title: Título do bloco.
$data->region_select: Menu dropdown para atribuir uma região.
$data->weight_select: Menu dropdown para definir os weights.
$data->throttle_check: Checkbox para habilitar throttling.
$data->configure_link: Link de configuração do bloco.
$data->delete_link: Link para excluir blocos adicionados por usuário.

modules/book/book-all-books-block.tpl.php

$book_menus: Array com as estruturas do livro exibidos como uma lista desordenada. Organizado pelo ID do book que também é o ID do node pai.

modules/book/book-export-html.tpl.php

$title: Título mais importante do node.
$head: Tags do cabeçalho.
$language: O código do idioma, por exemplo, "en" para inglês.
$language_rtl: TRUE ou FALSE dependendo de scripts com idiomas da direita para a esquerda(rtl -right to left).
$base_url: URL para a página inicial do site.
$content: Nodes dentro da estrutura atual exibidos por book-node-export-html.tpl.php.

modules/book/book-navigation.tpl.php

$tree: O filho mais próximo do node atual exibido como uma lista desordenada.
$current_depth: Intensidade do node atual dentro da estrutura do livro. Fornecido para contexto.
$prev_url: URL para o node anterior.
$prev_title: Título para o node anterior.
$parent_url: URL para o node pai.
$parent_title: Título do node pai. Não imprimido por padrão. Fornecido como uma opção.
$next_url: URL para o próximo node.
$next_title: Título do próximo node.
$has_links: Sinaliza TRUE uqnado os dados "anterior", "pai" ou "próximo" possuem um valor.
$book_id: O ID do livro da estrutura atual que está sendo vizualizada. O mesmo que o ID do node contendo a estrutura inteira. Fornecido para contexto.
$book_url: O URL do livro/node da estrutura atual sendo vizualizada. Fornecido como uma opção. Não utilizado por padrão.
$book_title: O título do livro/node da estrutura atual sendo vizualizada. Fornecido como uma opção não utilizado por padrão.

modules/book/book-node-export-html.tpl.php

$depth: Intensidade do node atual dentro da estrutura.
$title: Título do node.
$content: Conteúdo do node.
$children: Todos os nós filhos recursivamente exibidos por este arquivo.

modules/commnet/comment-folded.tpl.php

$title: Um título com link para o comentário completo.
$new: Marcador para novo comentário.
$author: Autor do comentário. Pode ser link ou texto puro.
$date: Data e hora de postagem.
$comment: Obejto do comentário completo.

modules/commnet/comment-wrapper.tpl.php

$content: Todos os comentários para uma página em específico. Também contém controles de seleção.

modules/commnet/comment.tpl.php

$author: Autor do comentário. Pode ser um link ou texto puro.
$content: Corpo do post.
$date: Data e hora da postagem.
$links: Vários links operacionais.
$new: Marcador para novo comentário.
$picture: Imagem do autor.
$signature: Assinatura do autor.
$status: Status do comentário. São possíveis valores: comment-unpublished, comment-published ou comment-preview.
$submitted: Em linha com data e horário.
$title: Título com link.

modules/forum/forum-icon.tpl.php

$new_posts: Indica se o tópico contém ou não novos posts.
$icon: O ícone para exibição. Pode ser um dos 'hot', 'hot-new', 'new', 'default', 'closed', ou 'sticky'.

modules/forum/forum-list.tpl.php

$forums: Um array de fóruns e categorias a serem exibidos. Este é organizado pelos ids númericos de todos os fóruns e categorias filhos.
$forum_id: Id do fórum para o forum atual. É o pai para todos os items dentro do array $forum.

Cada $forum em $forum contém:

$forum->is_container: É TRUE se o fórum pode contem outros fóruns. É FALSE se o fórum pode conter somente tópicos.
$forum->depth: Qual a intensidade que o fórum possui na hierarquia atual.
$forum->zebra: string 'even' our 'odd' utilizada para a classe da linha.
$forum->name: O nome do fórum.
$forum->link: O URL para o link deste fórum.
$forum->description: A descrição deste fórum.
$forum->new_topics: TRUE se o forum contém posts não lidos.
$forum->new_url: Um URL para os post não lidos do fórum.
$forum->new_text: Texto para o URL acima na qual informa quantos são os novos posts.
$forum->old_topics: Uma contagem de posts que já foram lidos.
$forum->num_posts: O número total de posts no fórum.
$forum->last_reply: Texto representando a últma vez que um fórum foi postado ou comentado.

modules/forum/forum-submitted.tpl.php

$author: O autor do post.
$time: Quanto tempo atrás o post foi criado.
$topic: Um objeto contendo dados crús (não filtrados) do post. Inseguro, se assegure de limpa este dado antes de imprimí-lo.

modules/forum/forum-topic-list.tpl.php

$header: O cabeçalho da tabela. Este é pré-gerado com informação na ordem de clicks. Caso você precise modificar isto, veja template_preprocess_forum_topic_list().
$pager: O pager para exibir debaixo da tabela.
$topics: Um array de tópicos a serem exibidos.
$topic_id: Id numérico para o tópico do fórum atual.

Cada $topic em $topic contém:

$topic->icon: O ícone para exibir.
$topic->moved: Um sinal para indicar se o tópico foi movido para um outro fórum.
$topic->title: O título do tópico. Seguro para exibição.
$topic->message: Se o tópico foi movido, este contém uma explicação e um link.
$topic->zebra: String 'even' ou 'odd' string para a classe da linha.
$topic->num_comments: O número de respostas neste tópico.
$topic->new_replies: Um sinal para indicar se existem comentários não lidos.
$topic->new_url: Se existem respostas não lidas, este é o link para elas.
$topic->new_text: O text contendo a contagem traduzida devidamente pluralizada.
$topic->created: Uma string imprimível representando quando um novo tópico é postado.
$topic->last_reply: Uma string imprimível representando quando um tópico foi respondido pela última vez.
$topic->timestamp: O timestamp crú de quando este tópico foi postado.

modules/forum/forum-topic-navigation.tpl.php

$prev: O ID do node do post anterior.
$prev_url: O URL do post anterior.
$prev_title: O título do post anterior.
$next: O ID do node do próximo post.
$next_url: O URL para o próximo post.
$next_title: O título do próximo post.
$node: O node crú que está sendo exibido atualmente. Contém dados inseguros e qualquer dado dentro deste deve ser filtrado antes de apresentado.

modules/forum/forums.tpl.php

$links: Um array de links que permitem ao usuário postar novos tópicos do fórum. Pode também conter uma string informando um usuário que ele deve logar para que possa postar.
$forums: Os fórums para exibir (como processados por forum-list.tpl.php).
$topics: Os tópicos para exibir (como processados por forum-topic-list.tpl.php)
$forums_defined: Um sinal indicando que os forums estão configurados.

modules/node/node.tpl.php

$title: O título (sanitarizado, filtrado) do nó.
$content: Corpo do node ou teaser dependento do sinalidador(flag) $teaser.
$picture: A imagem do autor do saída do node a partir de theme_user_picture().
$date: Data de criação formatada (utiliza $created para reformatar com format_date()).
$links: Links com tema como "Read more", "Add new comment", etc. criados por theme_links().
$name: Username com tema do node a partir de theme_user().
$node_url: URL direto para o nó atual.
$terms: A lista com tema para os links dos termos de taxonomia criados por theme_links().
$submitted: A informação de envio com tema criado por theme_node_submitted().

Outras variáveis:

$node: Objecto node completo. Contém dados que podem não ser seguros.
$type: Tipo do node, ou seja, story, page, blog, etc.
$comment_count: Número de comentários ligados ao node.
$uid: O id do usuário do autor no node.
$created: O horário na qual o node foi publicado formado no timestamp Unix.
$zebra: Imprime tanto "even" ou "odd". Útil para listragem zebra nas listas do teaser.
$id: Posição do node. Incrementa cada vez que é exibido.

Variáveis de status do node

$teaser: Sinal indicando o estado do teaser.
$page: Sinal para o estado completo da pagina.
$promote: Sinal para a promoção para a página inicial.
$sticky: Sinal para definição de post destacado.
$status: Sinal para status publicado.
$comment: Estado de configurações do comentário para o node.
$readmore: Sinaliza TRUE se o conteúdo do teaser do node não pode conter o conteúdo do corpo principal.
$is_front: Sinaliza TRUE quando exibido na página inicial.
$logged_in: Sinaliza TRUE quando o usuário atual é um membro logado.
$is_admin: Sinaliza TRUE quando o usuário atual é um administrador.

modules/poll/poll-bar-block.tpl.php e

modules/poll/poll-bar.tpl.php

$title: O título da enquete.
$votes: O número de votos para esta opção.
$total_votes: O número total de votos para esta opção.
$percentage: O percentual de votos para esta opção.
$vote: O número escolhido do voto atual do usuário.
$voted: Define TRUE se o usuário votou para esta opção.

modules/poll/poll-results-block.tpl.php e

modules/poll/poll-results.tpl.php

$title: O título da enquete.
$results: O resultado da enquete.
$votes: Os resultados totais na enquete.
$links: Links na enquete.
$nid: O nid da enquete.
$cancel_form: Um formulário para cancelar o voto do usuário, se permitido.
$raw_links: O array cru de links. Deve ser executado por meio de theme('links') se utilizado.
$vote: O número da escolha do voto atual do usuário.

modules/poll/poll-vote.tpl.php

$choice: Os botões radio para as opções na enquete.
$title: O título da enquete.
$block: TRUE se este estiver sendo exibo como um bloco.
$vote: O botão para votar.
$rest: Tudo o mais no formulário que pode ter sido adicionado através dos hooks form_alter.

modules/profile/profile-block.tpl.php

$picture: Imagem configurada para a conta com o link para a página dos usuários.
$profile: Array organizado de todos os campos dos perfis que possuem um valor.

Cada $field em $profile contém:

$field->title: Título do campo do perfil.
$field->value: Valor do campo do perfil.
$field->type: Tipo do campo do perfil, ou seja, checkbox, textfield, textarea, selection, url ou date.

modules/profile/profile-listing.tpl.php

$picture: Imagem configurada para a conta com o link para a página dos usuários.
$name: Nome da conta de usuário com o link para a página dos usuários.
$profile: Array organizado de todos os campos do perfil que estão definidos como visível na página de lista de membros (configurada pelos administradores do site). Este também precisa possuir um valor para ser exibido.

Cadas $field em $profile contém:

$field->title: Título do campo do perfil.
$field->value: Valor do campo do perfil.
$field->type: Tipo do campo do perfil, ou seja, checkbox, textfield, textarea, selection, list, url ou date.

modules/profile/profile-wrapper.tpl.php

$content: Os perfis da conta de usuário interagem por meio de profile-listing.tpl.php.
$current_field: O campo nominado sendo navegado. Fornecido aqui para contexto.

modules/search/search-block-form.tpl.php

$search_form: O formulário de busca completo pronto para impressão.
$search: : Array of keyed search elements. Can be used to print each form
* element separately.

Chaves padrão dentro de $search:

$search['search_block_form']: Text input dentro de um div.
$search['submit']: Butão de envio do formulário.
$search['hidden']: Elementos escondidos do formulário. Utilizados para validar os formulários quando enviados.

modules/search/search-result.tpl.php

$url: URL do resultado.
$title: Título do resultado.
$snippet: Uma pequena prévia dos resultados. São se aplica às buscas de usuários.
$info: String de todas as informações meta prontas para impressão. Não se aplica às buscas de usuários.
$info_split: Contem o mesmo dado que $info, separados por um array organizado.
$type: O tipo da busca, por exemplo, "node" ou "user".

Chaves padrão dentro de $info_split:

$info_split['type']: Tipo do node.
$info_split['user']: Autor do node com um link para o perfil dos usuários. Depende da permissão.
$info_split['date']: Última atualização do node. Com pouca formação.
$info_split['comment']: Número de comentários exibidos como "% comments", sendo "%" a contagem. Depende de comment.module.
$info_split['upload']: Número de arquivos anexados exibodos como "% attachments", sendo % a contagem. Depende de upload.module.

modules/search/search-results.tpl.php

$search_results: Todos os resultados é exibido por search-result.tpl.php.
$type: O tipo da busca, por exemplo, "node" ou "user".

modules/search/search-theme-form.tpl.php

$search_form: O formulário de busca completo pronto para impressão.
$search: Array de elementos da busca organizados. Pode ser utilizado para imprimir cada elemento do formulário separadamente.

Chaves padrão dentro de $search:

$search['search_theme_form']: Text input dentro de um div.
$search['submit']: Botão de envio do formulário.
$search['hidden']: Elementos ocultos do formulário. Utilizado para validar os formulários quando enviados.

modules/system/block.tpl.php

$block->subject: Título do bloco.
$block->content: Conteúdo do bloco.
$block->module: Módulo que gera o bloco.
$block->delta: Este é um id numérico conectado à cada módulo
$block->region: A região do bloco na qual o bloco atual se encaixa.

Variáveis auxiliáres:

$block_zebra: Exibe 'odd' e 'even' dependente de cada região de bloco.
$zebra: Mesma exibição de $block_zebra mas independente de qualquer região de bloco.
$block_id: Contador depende de cada região de bloco.
$id: Mesma exibição de $block_id mas independente de qualquer região de bloco.
$is_front: Sinaliza TRUE quando apresentado na página inicial.
$logged_in: Sinaliza TRUE quando o usuário atual é um membro logado.
$is_admin: Sinaliza TRUE quando o usuário atual é um administrador.

modules/system/box.tpl.php

$title: Título do box.
$content: Conteúdo do box.

modules/system/maintenance-page.tpl.php

NOTA: Todas as variáveis de page.tpl

modules/system/page.tpl.php

NOTA: Todas as variáveis que você já conhece de page.tpl.php.

modules/user/user-picture.tpl.php

$picture: Imagem definida pelo usuário ou padrão do site. Terá um link dependendo da permissão para vizualizar a página do perfil dos usuários.
$account: Array com informações da conta. Potencialmente inseguro. Assegure-se de utilizar check_plain().

modules/user/user-profile-category.tpl.php

$title: Título da categoria para o grupo de items.
$profile_items: Todos os items para o grupo exibidos por user-profile-item.tpl.php.
$attributes: Atributos HTML. Normalmente exibe classes.

modules/user/user-profile-item.tpl.php

$title: Título do campo para o item do perfil.
$value: Valor definido pelo usuário para o item do perfil ou dados de um módulo.
$attributes: Atributos HTML. Normalmente exibe classes.

modules/user/user-profile.tpl.php

$user_profile: Todos os dados do perfil do usuário. Pronto para impressão.
$profile: Array organizado de categorias de perfis e seus itens ou outros dados fornecidos pelos módulos.

Enviado por gilbertoalbino em 12/07/2009 - 18:11

Versão para impressão
Se logue ou se registre para poder enviar comentários
8199 leituras

Em 14/07/2009 - 10:00 gilbertoalbino disse:

Desculpem se as imagens estiverem indisponiveis, o servidor do meu site vive caindo.

É na colaboração que crescemos juntos!

Se logue ou se registre para poder enviar comentários

Em 14/07/2009 - 14:36 niltojal disse:

o que posso dizer???

Esta muito bom isso aqui, esta praticamente tudo reunido nesses dois tutoriais que vc forneceu ai. muito bacana.

Nil Tojal
http://twitter.com/niltojal

Se logue ou se registre para poder enviar comentários