58 :: tutorial

Convidamos voc a mergulhar em um dos programas

de gerenciamento de contedo web que mais crescem no
mundo: o Joomla!. Esta conversa, dividida em quatro par-
tes, concentrar informaes tcnicas e um pouco de epis-
temologia sobre o sistema. Trabalharemos, como na web,
com linguagem rpida e utilizando hipertextos, aprovei-
tando o conhecimento coletivo que a grande comunidade
Joomla! j edificou. Seja bem-vindo e mos obra.
O que Joomla!?
Joomla! (pronuncia-se djumla) um CMS (Content Ma-
nagement System) desenvol vi do a parti r do Mambo.
escrito em PHP e roda no servidor web Apache ou IIS e
banco de dados MySQL. - Fonte: Wikipdia (pt.wikipe-
dia.org/wiki/Joomla)
Quais as vantagens?
- um software livre, aberto e gratuito (GNU/GPL);
- Pode ser totalmente modificado por profissionais que
desejam adapt-lo a outras realidades de uso;
- Possui comuni dade com mai s de 130 mi l regi strados
(www.joomla.org) e mais de um milho de posts;
- Tem fcil instalao, oferecendo-lhe imediatamente um
site operacional e com toda a infra-estrutura necessria
para crescer (para os iniciantes, rapidamente um site no
ar; para avanados, a possibilidade de plugar novos com-
ponentes - extensions.joomla.org - ou desenvolver os
prprios);
- exvel, permitindo utilizar recursos Web 2.0 (acessibilida-
de, validaes W3C, tecnologia AJAX, dentre outros).
Como instalar?
Deixemos esta misso com o pessoal do JoomlaMinas, que
elaborou um excelente passo a passo - www.joomlaminas.
org/joomla/tutoriais/instalando-o-joomla.html. L esto
os pr-requisitos, downloads, preparao do ambiente e
a instalao detalhada.
Entendendo o Joomla!
Instalado o CMS, vamos compreender as suas divises.
importante, primeiramente, informar que a sua administra-
o dividida em Front-end e Back-end:
- Front-end: fachada do site, atravs do qual possvel
administrar contedo, sem necessitar entrar na rea ad-
ministrativa;
- Back-end: rea administrativa, onde possvel gerenciar
no s contedo, mas tambm acesso de usurios, menus,
sees e categorias do site, arquivos de notcias e at ex-
tenses do Joomla!, podendo instalar mdulos e compo-
nentes novos.
>> Usurios
O Joomla! possui diviso por status de usurios, dependen-
do do Grupo em que so cadastrados. Os usurios podem
ter l i vre acesso a todas as reas do CMS ou somente a
contedos exclusivos, com possibilidade de inserir, editar
e/ou publicar contedo. possvel tambm escolher se o
usurio ter acesso apenas ao Front-end, com poder limi-
tado, ou ao Back-end, tendo mais possibilidades.
>>>> Grupos de acesso ao Front-end
- Registered: usurios comuns, com poder de visualizao
a contedos especficos definidos para ele. No pode criar,
editar ou excluir qualquer contedo;
- Autor: pode criar, editar e excluir somente o prprio con-
tedo;
- Editor: pode criar, editar e excluir qualquer contedo;
- Publisher: pode criar, editar e excluir o prprio conte-
do e editar e publicar o contedo criado pelos editores
e autores.
>>>> Grupos de acesso ao Back-end
- Manager: pode gerenciar sees e categorias, assim como
o contedo gerado por autores, editores e publishers;
- Administrator: possui todos os acessos e privilgios de
gerenciamento;
Joomla!, mos obra! - Parte 1/4
Por Bruno Viana (webdeveloper e pesquisador), Diego Maia (webdesigner), Julio Pontes (webdeveloper)
e W.Gabriel de Oliveira (gerente de marketing, pesquisador webwriter) da Agncia NOIX (www.noix.com.
br). Contato: joomla@noix.com.br.
60 :: tutorial
- Super Administrator: est acima do Administrador, po-
dendo exclu-lo.
>>Sees e Categorias
O Joomla! dividido em Sees (sections) e Categorias
(categories). Voc pode criar uma Seo e, dentro dela,
possuir vrias Categorias. Tambm pode criar Contedos
(contents), que so os materi ai s textuai s e de i magens
do si te. Os Contedos (contents) podem ser estti cos
ou dinmicos, permitindo que se crie desde uma pgina
com um contedo institucional fixo at uma rea no site
que lista notcias de uma determinada Seo. Abaixo, um
exemplo de como seria esta diviso em um portal feito
com Joomla!:
Seo: Diverso e Arte
Categoria: Livros
Item de contedo: Ariano Suassuna fala sobre Patri-
mnio Artstico-Cultural
Categoria: Msica
Item de contedo: Banda gua de Quartinha se apre-
senta na capital cearense
Item de Contedo Esttico: A empresa (informaes
institucionais)
Seguindo essa estrutura e inserindo os contedos,
possvel definir quais contedos apareceram no menu, criar
listagens de contedos e at dizer quais deles apareceram
na pgina inicial.
Como criar item de contedo?
Este o bsico a ser feito dentro do Joomla!. Criaremos um
item de contedo dinmico. possvel, para isso, usar o
front-end ou o back-end. Utilizaremos aqui o back-end.
1. Para acessar o back-end, digite o endereo no qual o
Joomla! est instalado /administrator. Exemplo: http://lo-
calhost/joomla/administrator.
2. Digite o login admin e a senha escolhida no ato da ins-
talao.
3. Clique no cone Administrar Itens de Contedo (para
gerenciar itens de contedo dinmicos) ou Administrar
Itens de Contedo Esttico (para os itens estticos).
4. Voc ver a listagem de todos os itens de contedo cadas-
trados. Clique em NOVO para adicionar um item.
5. Para cadastrar, obrigatrio o preenchimento mnimo
de: Ttulo, Texto de Introduo, Seo e Categoria. Aps
digitar Ttulo e Texto de introduo, escolha a Seo No-
tcias e a Categoria ltimas notcias. O texto principal
opcional, sem limite de caracteres.
6. Clique em SALVAR na barra de botes superior para
finalizar o cadastro.
7. Voc ver uma mensagem confirmando a criao do novo
item Minha primeira notcia.
8. Veja que seu item est OK para PUBLICADO, mas no
est OK para aparecer na PGINA INICIAL do site. Para
mudar, clique sobre o X vermelho.
tutorial :: 61
9. Veja como ficou seu item Minha primeira notcia na
pgina inicial do site.
Como trocar template
1. Acesse o back-end e selecione o menu Site > Administrar
Templates > Templates do site.
2. A prxima tela exibir uma listagem dos templates j
instalados por padro no Joomla!.
Observao: H dois templates, madeyourweb e rhuk_solarare_ii, j
cadastrados por padro, com um deles publicado.
62 :: tutorial
3. Selecione o template madeyourweb e clique no boto
Padro na barra de ferramentas superior.
4. Sua escolha aparecer OK. Acesse o endereo de seu
site e veja o resultado.
Como criar item de menu
1. Para criar menus no Joomla!, acesse Menus > Adminis-
trator Menus > mainmenu e veja a listagem dos itens do
menu j criados.
2. Vamos criar um link para o site da Revista Webdesign.
Clique em NOVO.
3. Aparecer a listagem com os tipos de menu. Selecione
LINK - URL e clique em Prximo.
4. Preencha os campos solicitados. Como criaremos um
menu principal, no precisa mudar o Nvel do Item, pois
no ser submenu.
5. Clique em salvar para publicar e finalizar a criao.
Confira, na prxima edio, o desenrolar dessa con-
versa. Falaremos um pouco sobre componentes do Joomla!,
abordando suas possibilidades e criando um junto com
voc. Explicaremos algumas metodologias de desenvolvi-
mento, formas de aplicao e exemplos de customizao.
At a prxima!
Continuando nossa conversa sobre o Joomla!, trou-
xemos para esta edio algumas palavras sobre Compo-
nentes. Explicaremos o que um Componente Joomla! e
como voc mesmo poder desenvolv-lo.
Voc ver como incrementar seu Joomla! com
aplicativos especficos para o que precisa, fugindo do
sistema limpo e seco da primeira instalao. Isto porque
o CMS possibilita a integrao de vrios Componentes
sua estrutura. Tais componentes podem ser tambm
padres (que vm no ato da instalao) ou desenvolvidos
por terceiros e de instalao grtis ou no. Temos como
componentes padres:
- Banners: administrador simples de banners. Com ele,
possvel inserir, por exemplo, banners de patrocnio com
possibilidade de um melhor controle de cliques e nmero
de exibies;
- Enquetes (Polls): junto com seu mdulo, cria rapida-
mente uma enquete no site;
- Contedo (Content): considerado o mais impor-
tante Componente do Joomla!, porque visto como o
corao deste CMS. Com ele, possvel criar o contedo
do site e gerenci-lo. Tambm possibilita a diviso do
contedo do site por sees e categorias, facilitando a
publicao de contedo.
Para aqueles, porm, que desejam mais opes a seu
site sem precisar comprar uma soluo de outros desen-
volvedores, existem Componentes Joomla! distribudos de
maneira free na internet.
Voc pode encontrar estes componentes, organi-
zados por categoria, no endereo http://extensions.
joomla.org/. Caso deseje ver a lista de componentes j
instalados no seu CMS, voc pode acessar o menu Com-
ponentes, na barra de ferramentas do seu Joomla!.
Lembrando que Componentes so facilmente insta-
lados e desinstalados. Eles vm em formato .zip, com
todos os arquivos de Back-end, Front-end e XML compac-
tados, prontos para voc fazer upload para o Joomla! e
comear a us-los.
DOCMAN
Componente gerenciador de documentos, atravs
do qual o desenvolvedor pode categorizar arquivos
e disponibiliz-los para download no site. Alguns dos
maiores diferenciais do DOCMAN so a possibilidade de
upload de arquivos em lote, a facilidade na modificao
do layout do Componente com os temas que ele traz, a
opo de hospedar todos os arquivos no servidor local
ou externamente e a realizao de acompanhamento do
Componente atravs de estatsticas, com um contador
de downloads e logs. Mais informaes sobre o DOC-
MAN podem ser adquiridas no site http://joomlacode.
org/gf/project/docman/news/.
RS GALLERY2
Componente gerenciador de galeria de imagens. Por
meio dele, voc pode facilmente criar em seu Joomla!
sua galeria de imagens personalizada. Uma das grandes
vantagens deste gerenciador de galeria de imagens
a possibilidade de upload em lote de imagens. Ou seja,
muitas imagens juntas, compactadas em formato .zip,
podem ser enviadas de uma s vez para o gerenciador,
que vai descompact-las sem problemas, fazendo unzip
automaticamente.
JACLPLUS
Componente que lhe permite cadastrar novos grupos
de usurio na rea administrativa do Joomla!. Observe
a listagem padro de grupos de usurios do CMS. Voc
ainda tem a possibilidade de editar um grupo.
Veja no exemplo do grupo Manager, a seguir, esta
edio. Na edio, possvel ver todas as permisses de
acesso que este grupo tem, como:
- Adicionar contedo
- Editar contedo
- Publicar contedo
- Editar itens listados na pagina inicial (com_frontpage)
- Permisso para acesso ao Media Manager
- Permisso negada para editar mdulos
- Permisso para logar na rea administrativa do site.
Joomla!, mos obra! - Parte 2/4
Por Bruno Viana (webdeveloper e pesquisador), Diego Maia (webdesigner),
Julio Pontes (webdeveloper) e W.Gabriel de Oliveira (gerente de marketing,
pesquisador webwriter) da Agncia NOIX (www.noix.com.br). Contato:
joomla@noix.com.br.
58 :: Webdesign
Observao: este componente um HACK para Joomla!, ou seja,
um componente que altera o cdigo do Joomla! original. Por isso,
muita cautela e ateno no momento de instal-lo.
Criando um componente
Agora, explicaremos como criar seu componente, com todos os arqui-
vos Back-end, Front-end e XML compactados em formato .zip para
serem instalados no Joomla!. Vamos desenvolver um Componente de
Eventos. Com ele, voc poder cadastrar eventos em seu site, infor-
mando nome, data do acontecimento e o local. Tudo a partir de um
mdulo na pgina principal, que mostrar em uma pequena listagem
dos eventos por ms.
Para entender a estrutura, importante saber que o Compo-
nente Joomla! se divide em duas partes: Back-end e Front-end.
Back-end a parte administrativa do Componente, que ficar dentro
do Joomla!! com acesso restrito por login e senha. J Front-end a
parte mostrada na interface do site, que todos podem ver.
Fazer um componente como se fosse uma receita de bolo: no
complicado, basta seguir o passo a passo. Voc pode encontrar
outros passo a passo iniciais muito bons com o pessoal joomla.com.
br (http://www.joomla.com.br/artigos-e-tutoriais/tutoriais/progra-
mando-componentes-para-joomla-parte-1.html).
Para comear o desenvolvimento do Back-end de seu Compo-
nente de Eventos, voc dever criar os seguintes arquivos: admin.
eventos.php, admin.eventos.html.php, eventos.class.php, toolbar.
eventos.php, toolbar.eventos.html.php, eventos.xml, install.eventos.
php e uninstall.eventos.php. Agora que conhece quais arquivos preci-
sa criar para o Back-end, veja como faz-los:
1) admin.eventos.php
Far parte do controle das atividades do componente. Quando aces-
samos: http://www.seusite.com.br/index.php?option=com_eventos,
enviamos pela URL alguns parmetros para o Joomla!, que neste
caso o option. O parmetro option informa qual componente
estamos acessando, podendo assim visualizar o seu contedo de
acordo com o acesso permitido para o seu usurio. A princpio,
vamos trabalhar com a administrao do site, portanto o endereo
acessado vai ser: http://www.seusite.com.br/administrator/index.
php?option=com_eventos.
Informando o parmetro option com o valor com_eventos,
estamos dizendo ao Joomla! que ele deve acessar o componente
de eventos e por estarmos na parte administrativa do site o arquivo
tecnologia na web :: 59
que o Joomla! acessar vai ser o admin.eventos.php. Ele
ser o responsvel por receptar as tarefas (tasks) que o
usurio est tentando realizar (atravs do endereo) e
realizar um determinado procedimento de acordo com a
tarefa escolhida.
Com este cdigo temos a possibilidade de realizar as
seguintes tarefas: Criar eventos (new), editar (Edit), sal-
var eventos novos ou existentes (save), excluir (remove)
ou listar eventos(list).
Se o endereo acessado for: http://www.seusi-
te.com.br/administrator/index.php?option=com_
eventos&task=new, estamos dizendo que o valor do par-
metro task (ou seja a tarefa que queremos realizar) new.
Informando assim, ao Joomla!, que queremos criar
um novo evento. Se o valor de task fosse save, por
exemplo, o Joomla! chamaria a tarefa save dentro do
arquivo admin.eventos.php, que por sua vez chamaria a
funo saveEvento(), que realizaria todos os procedi-
mentos necessrios para salvar o evento.
2) admin.eventos.html.php
Layout do componente. Este arquivo contm todos
os HTMLs usados. Quando uma tarefa chamada no
Joomla!, ela executa uma funo que por sua vez deve
chamar uma classe HTML e seu respectivo mtodo para
exibir o HTML.
3)eventos.class.php
Ligar o componente ao banco de dados. Este arquivo con-
tm uma classe que vai tratar da parte do banco de dados.
4) toolbar.eventos.php
Far parte do controle dos menus do componente.
5) toolbar.eventos.html.php
Dar a listagem dos menus.
6) eventos.xml
Possibilita a instalao do componente, pois faz um ma-
peamento de todos os arquivos que compem o compo-
nente criado, como imagens, SQLs, PHPs etc.;
7) install.eventos.php
Este arquivo lhe permite colocar uma mensagem final
aps a instalao. Voc pode, por exemplo, colocar uma
instruo de como utilizar o componente ou os crditos
do desenvolvedor.
8) uninstall.eventos.php
Para a remoo do componente.
Ok, os arquivos Back-end de seu Componente de
Eventos esto criados. Veja na prxima edio como
criar os arquivos de Front-end e de XML, para depois
apenas compact-los em formato .zip e instal-los em
seu Joomla! At a prxima.
60 :: Webdesign
Antes de tudo, queremos agradecer a todos que nos
enviaram e-mails parabenizando pelo trabalho, dando
dicas e solicitando mais informaes sobre o Joomla!.
Dando continuidade ao nosso papo, vamos prosseguir
no desenvolvimento do Componente que iniciamos na
edio passada.
Lembrando que estamos desenvolvendo um Compo-
nente de Eventos, atravs do qual voc poder cadas-
trar, dar nomes, indicar datas e locais, enfim, divulgar
seu evento no site. Comeamos na edio passada pela
parte de Back-end do Componente. Nesta edio, vamos
finalizar este desenvolvimento, construindo a parte de
Front-end e o XML de instalao. Mos obra!
A parte de Front-end que iremos desenvolver ser a
forma de visualizao, j no site, das informaes cadas-
tradas no Back-end. Ela no obrigatria, pois h casos
em que voc pode dispens-la, como, por exemplo:
- Quando voc opta por no ter visualizao, no site,
das informaes do Back-end do Componente;
- Quando voc tem as informaes do Back-end do
Componente visualizadas atravs de mdulos do Joomla!,
e no de arquivos de Front-end do Componente.
Neste tutorial, iremos desenvolver um Front-end que
mostre uma listagem de eventos por data, da mais recen-
te para a menos recente.
ATENO: lembre-se de que os arquivos do Front-
end do Componente esto localizados na pasta compo-
nents/ do diretrio raiz do seu Joomla!. Portanto, aps
a instalao ser criada, dentro dessa mesma pasta, uma
pasta chamada com_eventos/
Junto dos arquivos de Back-end j criados, voc
precisar agora criar os arquivos de Front-end e de XML
acompanhando a seguinte estrutura:
1) eventos.php
Arquivo responsvel por todas as aes que o Compo-
nente realizar. Funciona como o arquivo admin.eventos.
php do Back-end.
2) eventos.html.php
Arquivo responsvel por toda a estrutura de visualizao
HTML do Componente.
3) eventos.xml
Arquivo que organiza os outros arquivos criados (de
Front-end e de Back-end) para que o Joomla! possa
interpretar e instalar o Componente.
Joomla!, mos obra! - Parte 3/4
Por Bruno Viana (webdeveloper e pesquisador), Diego Maia (webdesigner),
Julio Pontes (webdeveloper) e W.Gabriel de Oliveira (gerente de marketing,
pesquisador webwriter) da Agncia NOIX (www.noix.com.br). Contato:
joomla@noix.com.br.
62 :: Webdesign
Com os arquivos de Back-end (admin.eventos.php ; admin.
eventos.html.php ; eventos.class.php ; toolbar.eventos.php ; tool-
bar.eventos.html.php ; eventos.xml ; install.eventos.php ; uninstall.
eventos.php), de Front-end (eventos.php ; eventos.html.php) e de
XML (eventos.xml) criados, agora voc precisar compact-los em um
arquivo .zip (ex: com_eventos.zip). Atravs do arquivo com_eventos.
zip, seu Componente poder ser instalado no Joomla!. Para instalar,
siga o passo a passo:
i. Acesse a rea administrativa do Joomla! e v ao menu Insta-
laes;
ii. Selecione a opo Componente;
iii. Localize o arquivo com_eventos.zip e instale-o;
iv. Confira na listagem de componentes a existncia do seu
Componente de Eventos instalado. Veja o exemplo:
v. Crie um item de menu para seu Componente (veja na
matria Joomla!, mos obra! Parte 1/4, de novembro/2007,
em Como criar item de menu. Ao invs de clicar em LINK - URL,
deve-se clicar em Componente) e voil: voc j pode comear a
us-lo.
tutorial :: 63
64 :: Webdesign
Ao nal do evento, acontece a aguardada
premiao do concurso Peixe Grande,
que premia as melhores agncias e
prossionais de webdesign.
64 :: Webdesign
Veja como seu Componente ficar:
Caso deseje incrementar seu Componente (como,
por exemplo, com uma pequena seta ao lado da listagem
de cada evento citado), voc poder adicionar arquivos
ao pacote .zip e alterar o cdigo dos arquivos j existen-
tes. Veja como ficaria esse exemplo da seta:
- Incrementando o cdigo do arquivo eventos.html.php
- Incrementando o cdigo do arquivo eventos.xml
- Criar a pasta images/ no diretrio de trabalho que
deve ser zipado novamente, inserindo o arquivo seta.gif
e recriando o arquivo com_eventos.zip
- Se j havia instalado o Componente bsico, desins-
tale-o. Dentro da mesma rea de instalao, voc sele-
ciona o Componente anterior e clica em Uninstall
- Instale o novo Componente com_eventos
Perceba como seu Joomla! pode ganhar novas
funcionalidades e ficar cada vez mais profissional. Com
a criao de Componentes, o limite de recursos de seu
Joomla! s depende de voc. Alm disso, voc tambm
pode criar os prprios layouts do site, aplicando perfei-
tamente estrutura do Joomla! que voc desenvolveu.
Como possvel? Veja na prxima edio dicas impor-
tantes sobre como criar os prprios templates de seu
Joomla!. At l.

Veja o resultado visual:
60 :: Webdesign
Nesta ltima parte de nosso tutorial, voc ir apren-
der como mudar a cara do seu site em Joomla!. Saber
como criar templates e personalizar ainda mais seu site.
Nas edies anteriores, dentre outras abordagens, expli-
camos como instalar o Joomla!, como usar componentes
free e at como desenvolver o prprio componente.
Agora, falaremos sobre como voc poder alterar o de-
sign que deseja para seu site.
Na primeira parte, voc viu que possvel baixar ou
comprar templates para seu Joomla!. Falamos, tambm,
sobre como voc pode instalar novos templates e mudar
o visual padro de seu site facilmente. Mas como todo
webdesigner, voc deve ter se perguntado por que no
fazer o prprio template do seu site. Antes de qualquer
coisa, voc precisa saber o que Mdulo e Template.
Explicando Mdulo
Mdulo um bloco de cdigo usado para exter-
nar contedo, como, por exemplo, de componentes j
existentes no Joomla! (listagem de ltimas notcias etc.),
de um RSS de outros sites (previso do tempo, RSS de
notcias etc.) ou do prprio administrador do Joomla!
(imagens, pequenos textos etc.). Os mdulos podem
ser aplicados em qualquer parte do template, de acordo
com as posies definidas na criao do template.
No administrador do Joomla, voc pode:
- visualizar todos os mdulos do seu site;
- escolher se o mdulo estar publicado ou no;
- escolher em que rea do site ele vai aparecer, e at;
- escolher em que posio na pgina inicial ele vai estar.
Verifique que, na listagem dos mdulos, existe uma
coluna chamada Position. essa opo que diz em qual
posio o mdulo aparecer no site. Voc pode visualizar
todas as posies disponveis no template acessando:
site > preview > inline with positions.
Joomla!, mos obra! - Parte 4/4
Por Bruno Viana (webdeveloper e pesquisador), Diego Maia (webdesigner),
Julio Pontes (webdeveloper) e W.Gabriel de Oliveira (gerente de marketing,
pesquisador webwriter) da Agncia NOIX (www.noix.com.br). Contato:
joomla@noix.com.br.
Como criar um mdulo simples
Na rea administrativa do Joomla!, v tela de lista-
gem dos mdulos e clique em Novo. Feito isso, d um
DICA: h tambm outra forma de visualizar essas po-
sies. Basta acessar o endereo do seu site e acrescen-
tar: /?tp=1. Exemplo: http://www.seusite.com.br/?tp=1
O Joomla! padro j traz os nomes das posies
definidos, como TOP, RIGHT, USER1 etc. Contudo,
possvel alter-los e tambm acrescentar novas posi-
es. Basta acessar:
site > template manager > modules positions.
Clicando no nome do mdulo, voc entrar na sua
pgina de edio. Nela, voc poder alterar nome, par-
metros, posio, disposio que o mdulo ter no site e
sufixos de classe.
Na coluna da Page/Itens esto todas as reas do
site, organizadas por menu. Nela voc poder escolher
em que pginas seu mdulo ir aparecer.
tutorial :: 61
nome (coloquemos Foto, por exemplo), escolha a posi-
o em que esse mdulo aparecer (nesse caso, escolha
position left) e a opo All na coluna Pages/Items.
Depois de configurar seu mdulo, voc j pode
incluir algum tipo de contedo. Desa a barra de rolagem
at o final da pgina e insira uma imagem na parte de
Content do mdulo.
Assim, veja que seu mdulo Foto aparecer em
todas as pginas do site.
Como criar um mdulo complexo
Vamos agora criar um mdulo complexo, que puxe o
ltimo evento do nosso componente de eventos feito na
matria Joomla!, mos obra! Parte 2/4 e Parte 3/4.
1) mod_eventos.php
Esse arquivo responsvel pela parte lgica e traz o
resultado com forma de lista.
2) mod_eventos.xml
Necessrio para a instalao.
Finalizado o cdigo, faa a compactao do seu
mdulo em formato .zip e instale-o em seu Joomla!. Para
instalar, clique: Installers > Modules. Configure da mesma
forma como fez com o mdulo Foto, criado anterior-
mente, com a position left e a opo All na coluna
Pages/Items.
Agora que entendemos mais sobre mdulos, fica fcil
explicar como transformar seu design em um template
Joomla!.
Transformando design em template Joomla!
Qualquer design criado pode ser transformado em
template. Para preparar um template, voc precisa antes
ter fatiado seu design (transformado em CSS/XHTML)
para aplicar no Joomla!. Para comear, devemos criar uma
pasta com o nome do template. Usemos, como exemplo,
o nome meutemplate. Dentro da pastas, iremos colocar
os seguintes arquivos:
3) index.html
Utilizado por questes de segurana, para que usurios
externos no acessem facilmente pastas internas. Dentro
do arquivo index.html, coloque o seguinte cdigo:
<html><body bgcolor=#FFFFFF></body></html>
4) index.php
Ser o cdigo desenvolvido na fase de corte (recomen-
damos que seja em tableless) do layout adaptado ao Joomla!.
5) templateDetails.xml
Conter todas as especificaes do template, como a
listagem dos arquivos, dados do autor etc.
6) template_thumbnail.png
Miniatura do nosso design para visualizao rpida. A
miniatura aparecer no administrador do Joomla!.
Observao: ainda dentro da pasta meutemplate,
tambm existiro pastas com as imagens e o CSS.
Finalizada a estrutura, vamos implementao do design.
Implementando o template Joomla!
Copie todo o cdigo HTML do layout fatiado e cole
dentro do arquivo index.php. O que faremos simples-
mente substituir o contedo do cdigo por mdulos.
Primeiramente, vamos chamar dentro do <head> uma
funo do Joomla!, que contm todos os parmetros do
site, como o ttulo, o description e as key-words.
<?php mosShowHead(); ?>
Mude o endereo do CSS para templates/meutem-
plat/css/folhaestilo.css
Para definir as posies em que os mdulos sero
carregados usaremos a funo mosLoadModules(). Eis a
chamada da funo:

<?php mosLoadModules(header); ?>
A funo mosLoadModules pode receber at dois
parmetros:
1. O nome da posio que carregar os mdulos
(obrigatrio).
2. Um nmero representando o estilo que os mdu-
los sero carregados. So eles:
0 (zero) - a opo padro do Joomla!. Se esse pa-
rmetro no for passado, o valor 0 ser assumido. Ele
imprime o contedo dos mdulos em tabelas.
-1 (menos um) - Imprime o mdulo como ele origi-
nalmente, sem a adio de nenhuma tag.
-2 (menos dois) - O parmetro -2 traz o mdulo em
volta de DIVs e com o nome do mdulo dentro de H3.
Por padro, o Joomla! j traz essa DIV com uma classe
chamada de moduletable. Voc deve preparar no seu CSS
uma formatao bsica para essa DIV. Entretanto, poss-
vel alterar o nome da classe de qualquer mdulo chama-
do. Isso possvel com o sufixo de classe. O nome que
voc incluir no campo sufixo de classe ser adicionado
classe moduletable.
Exemplo: se voc colocar como sufixo box1, no
momento em que o Joomla! imprimir o mdulo, ele estar
com uma classe chamada moduletablebox1. Assim, voc
pode preparar uma formatao diferente para cada m-
dulo criado.
-3 (menos trs) - Retorna o mdulo dentro de 4 DIVs
aninhadas. til para se fazer cantos arredondados.
DICA: Voc pode aprender mais sobre a estrutura
dos mdulos no arquivo Includes/frontend.html.php.
Considerando que a coluna da esquerda o menu e a
da direita o contedo, vamos trocar toda a coluna da es-
querda pela chamada do mdulo left de parmetro -2
A funo mosCountModules(), indica se h algum
mdulo na posio informada. No nosso exemplo, usa-
mos a posio left. Como queremos que a DIV co-
luna_1 s aparea caso haja algum mdulo na posio
left, fazemos antes a seguinte verificao:
<?php if(mosCountModules(left)) : ?>

<div class=coluna_1>
<?php mosLoadModules(left, -2 ); ?>
<br clear=all />
</div>

<?php endif; ?>
Caso no exista contedo, a coluna no ficar ocu-
pando espao no template. A funo mosMainBody()
carrega todo o contedo vindo do Joomla! (telas inter-
nas, itens de contedo etc.). Portanto, iremos cham-la
dentro da DIV contedo.
<div class=conteudo>
<?php mosMainbody(); ?>
</div>
Ok. Agora voc j pode substituir todas as reas
importantes do site (DIVs, textos, rodap, menus,
imagens etc.) por chamadas de mdulos. Dessa forma,
voc desenvolver o cdigo de seu template ideal para
inserir no Joomla!.
Acabamos aqui a srie de tutoriais que explicou
para voc um dos CMS que mais cresce no mundo. Em
quatro edies, explicamos como instalar o Joomla!,
algumas de suas principais caractersticas e vantagens,
como desenvolver componentes, mdulos e, por fim,
templates personalizados.
Para facilitar a vida de nossos leitores, vamos
disponibilizar todos os cdigos citados nas quatro
edies desse tutorial em nosso site. Acesse www.
noix.com.br/webdesign e faa o download dos cdigos
comentados. Agora com voc: mos obra!
62 :: Webdesign