Conheça os diretórios e arquivos de um template para Joomla! Saiba o que significam e quais as suas funções.

1. TEMPLATES
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

2. O QUE É?
 Camada de visão de qualquer programa desenvolvido sob o conceito de OOP (Programação
Orientada a Objetos);
 Não é exclusividade do Joomla;
 É o “layout” de um site que não utiliza CMS. Ex: html, xhtml e html5;
 Em sites criados com CMS’s, são denominados “templates”;
 O template apresenta o layout gráfico e relaciona as funcionalidades do CMS com o site.
Componentes, módulos e plug-ins, também possuem templates; e
 O template que você escolhe, é a “roupa” que o seu site veste.
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

3. ESTRUTURA DE UM TEMPLATE JOOMLA
O CMS possui dois tipos de templates:

Templates do Site (são os templates do front-end, que serão visualizados pelos visitantes do
site) ficam localizados no diretório /templates . Por exemplo, se o nome do seu template é
tutoblank, ele ficará no diretório “tutoblank”:
<raiz>/templates/tutoblank

Templates da Administração (são os templates do back-end, que serão visualizados pelos
administradores do site) /administrator/templates . Por exemplo, se o nome do seu template é
blankadmin, ele ficará no diretório “blankadmin”:<raiz>/administrator/templates/blankadmin

Em ambiente remoto o caminho básico de um template é
<raiz>/public_html/seudominio/template/<nomedoseutemplate>. O public_html é o Document
Root do Web Server Apache e normalmente. pode variar entre public_html, www e htdocs.

Os diretórios e arquivos existentes, dependem do programador e da forma de criação do
template. Ex: Utilização de frameworks (Gantry, T3, Gavern, Bootstrap)
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

4. Diretórios de um Template
Um template Joomla!, possui basicamente, os seguintes diretórios:




css – folhas de estilos, arquivo .css. Ex: template.css
html – arquivos de override para determinadas saídas do sistema e módulo chrome. Ex:
substituir a apresentação do com_content
images – todas as imagens utilizadas no template
language – arquivos de idiomas utilizados pelo
Dependendo da complexidade o template pode conter ainda, os seguintes diretórios:




js – scripts e bibliotecas JavaScript utilizados para adicionar funcionalidades ao template
fonts – fonts utilizadas pelo template
less – arquivos com recursos de CSS3. Ex:normalize.less
sass – melhora o fluxo de trabalho do css com códigos mais limpos. Ex: normalize.scss
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

5. Exemplo de estrutura de arquivos
/css
/html
/images
/javascript
/language
component.php
error.php
favicon.ico
index.php
templateDetails.xml
template_preview.png
template_thumbnail.png
Arquivos do Template
Esses são os arquivos típicos de um template Joomla:
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

6. 
index.php
É o principal arquivo do template, dispõe de forma lógica, os componentes e módulos do site.
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

7. A quantidade de linhas de código depende do programador. Alguns programadores isolam ao
máximo o código (php) de outros códigos (html, css, js), utilizando arquivos separados. Isso é
extremamente recomendado. Ex: componente.php e logic.php
A primeira linha de código da index.php, é a mais importante pois evita o acesso não autorizado
ao template, através da chamada ao comando _JEXEC da API do Joomla!
Chamando o comando _JEXEC:
<?php defined(‘_JEXEC’) or die; ?>
O argumento retornado pelo comando _JEXEC é do tipo “boolean” e os valores são:
-1 e 0.
O que significa isso:
 Se o valor retornado for 0, o arquivo foi interpretado pelo Joomla.
 Se o valor for -1, temos uma tentativa de acesso via browser.
Exemplo
O nome do template padrão (front-end) do seu site é tutoblank, a forma normal de acesso ao
template é digitar a url do seu site no navegador. Ex: http://seusite.com.br
Se o usuário digitar http://seusite.com.br/templates/tutoblank/index.php , o resultado retornado
será -1 e ele não conseguirá acesso ao arquivo.
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

8. 
component.php
Fornece a lógica para a impressão da exibição das páginas:
“message” – mensagens do sistema: Ex: "Cadastro efetuado com sucesso."
“component” – componentes do sistema: Ex: com_content
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

9. 
logic.php
Fornece toda a camada lógica da programação, separada da camada de apresentação, sendo
uma boa prática da programação orientada a objetos. Pode ser encontrado ou não, em
templates para o Joomla!
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

10. 
error.php
Fornece o método de apresentação do erro 404, página não encontrada. Deve ser customizada
sempre que possível, de forma a atender as expectativas do usuário. Sugiro uma Landing Page.
2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br

11. 
favicon.ico
O arquivo favicon.icon é a imagem que aparece na maioria dos navegadores, ao lado do nome
do site. Ex:
Dependendo do escopo do site, pode ser considerado “amadorismo”, exibir o favicon padrão do
Joomla.
Você pode criar o seu favicon, gratuitamente e online. Ex: http://www.favicon.cc/

template.css
É o arquivo de estilos, com parâmetros de apresentação de vários aspectos. Ex: margens,
cabeçalhos, fontes, links e etc. Cada template pode possuir uma ou várias folhas de estilos.
Normalmente o arquivo encontra-se localizado no diretório /css .

templateDetails.xml
Esse arquivo fornece toda a rotina de instalação (diretórios, arquivos, idiomas e posições de
módulos), bem como os dados relacionados à propriedade do template.

template_preview.ext
Imagem do template, em tamanho grande, geralmente 600x400. Substitua o .ext pela extensão
da imagem (.jpg, .png, .gif). Será visualizada em um modal.
template_thumbnail.ext
Imagem pequena do template, geralmente 200x150. Substitua o .ext pela extensão da imagem
(.jpg, .png, .gif). Será visualizada no Gerenciamento de Templates, do back-end do Joomla.

2000/2014
Júlio Coutinho – Todos os direitos reservados
http://juliocoutinho.com.br