Vous êtes sur la page 1sur 683

Sumrio

Introduo................................................
Captulo
1

Bsicas...............................

Noes

Captulo 2 Joomla! 3 ...................................


Captulo 3 - Modelos de Layouts no
Joomla!...............
Captulo
4
Joomla!..........................

Extenses

Captulo 5 sis, novo template administrativo do Joomla!


Captulo 6
site..................

Configurao

Captulo
7
...............................

SEO

global

do

Joomla!

3/683

Captulo 8 - Lista de Controle de Acesso


(ACL) ...........
Captulo 9 Usurios, Grupos e Nveis, Email em massa ..
Captulo 10 Gerenciamento de Contedo
..................
Captulo 11 Gerenciamento de Idiomas
...................
Captulo
12
................................

Componentes

Captulo 13 Mdulos ....................................


Captulo 14 Plugins ....................................
Captulo
15
..................................

Templates

Captulo 16 Desenvolvendo um Projeto


com Joomla! 3.x ...

4/683

Captulo 17 Recuperao e Publicao


...................
Captulo 18 Programando para a Plataform
Joomla! .......
Captulo 19
.......................

Componente

com_users

Captulo 20 Override de Templates


......................
Captulo 21 Criando um novo Plugin
.....................
Captulo 22 Boas prticas de segurana e
blindagem do seu site desenvolvido com
Joomla! .....................
Insumos - Insumos para execuo do projeto
proposto ....
Anexo I Montando um Servidor Seguro
Joomla! ...................

Jlio Coutinho
Guia de Consulta Rpida Joomla! 3.x
2 Edio
AMCGuedes
2013
Este e-book foi licenciado sob uma Licena
Creative Commons AtribuioNoComercial-SemDerivados 3.0 Brasil.

Direitos Reservados
Jlio Coutinho
Capa e Arte de Capa
Egdio Carlos Paixo
Reviso
Lcia Amorim
ISBN: 978-85-64374-65-2
COUTINHO, Jlio. Guia de Consulta rpida
JOOLMA! 3 x. Rio de Janeiro: Editora
AMCGuedes,
2013.
I. Informtica. II. Guia de Consulta. III.
Joomla!.

7/683

Rio de Janeiro, 2013.


A capa deste livro foi escolhida em votao
aberta, publicada no site http://www.livrodejoomla.com.br

Agradecimentos
Agradeo em primeiro lugar Deus, pela
oportunidade da vida e a vontade de compartilhar o pouco que sei, com toda a
comunidade Joomla!
Agradeo a minha esposa Rosana e meu filho
Bruno, pela pacincia e compreenso em virtude das horas e horas, debruado sobre o
computador.
Agradeo ao Egdio Carlos por criar esta bela
capa para o livro.
Agradeo toda a comunidade Joomla! que
acredita no meu trabalho e prestigia meus
tutoriais, cursos e artigos, desde 2006.

Dedicatria
Dedico este livro s minhas queridas me,
Maria da Penha e irm Renata Coutinho. "in
memoriam".
Todos os dias lembro-me de vocs em minhas oraes...
Todos os dias arrependo-me por nunca terlhes dito "Eu te amo"...
Todos os dias arrependo-me de ter-lhes negado um sorriso...
Todos os dias arrependo-me de fugir de um
abrao apertado, que me oferecestes.

Introduo
A fronteira entre o profissional e o amador
est reduzida e cada vez mais, novos web
sites so publicados na rede mundial de
computadores, Internet. Rede mundial de
computadores ou pessoas? O advento das
redes sociais mudou drasticamente este conceito to defendido pelos especialistas,
quando nos deu o poder de sermos ouvidos.
Somos formigas com megafone!
Projetos de qualidade, com custo e prazo reduzidos, isto que o cliente deseja. Ele no
tem tempo, alis, ningum tem tempo para
nada, apesar do grande livro pregar que existe tempo para tudo na face da terra.
Sou do tempo em que fazer o site na unha
era sinnimo de conhecimento, hoje reflete a
ignorncia e falta de percia com ferramentas
modernas
que
nos
ajudam
no

11/683

desenvolvimento web e o Joomla! surge enquanto melhor CMS open source da atualidade. Mas, e a essncia do webdesign, aonde
fica? Design de pgina, site, contedo e
navegao web, usabilidade, acessibilidade,
persuaso e segurana, so desconhecidos
por pseudo-profissionais que aventuramse na arte de criar, publicar e manter na Internet, projetos web que refletem muitas
vezes, o sonho de vida do cliente. Tenho
saudades do tempo em que todo mundo era
tcnico em informtica, hoje, todos so
webdesigners.
Muitas pessoas pensam que o Joomla! a
soluo para seus problemas financeiros e
como um passe de mgica ele far lindos
websites dinmicos, modernos e funcionais.
Tenho uma novidade para voc: Joomla!
no faz nada. Ele gerencia o que voc faz.
Alis, isto est intrnseco na prpria nomenclatura
do
mesmo.
CMS
(Content

12/683

Management System), no bom portugus:


Sistema Gerenciador de Contedos.
Em tese, o website ser desenvolvido por
uma equipe de profissionais e hospedado em
um excelente provedor, com aplicativos atualizados e bem configurados. Na prtica,
pessoas que nada sabem de webdesign
desenvolvem projetos com joomla! e hospedam em provedores de quinta, geralmente
com a famigerada venda casada.
Para piorar os aventureiros usam templates piratas, mantm o usurio padro do
administrador e deixam os diretrios e arquivos com permisso 0777. O resultado
previsvel: websites invadidos, clientes frustrados com suas marcas desacreditadas e
CMS difamado. Mas e o aventureiro? Bem,
ele aventureiro certo? Ento basta escolher
outra rea e sair por a auto-intitulando-se
profissional.

13/683

O webdesign sempre foi relegado segundo


plano nas Instituies Governamentais e
Empresas Privadas. Via de regra, ficava
cargo do menino do site a incumbncia de
desenvolver o website ou portal corporativo.
Entretanto, os web sites deixaram de ser
apenas folders decorativos e passaram a ser
vetores de informao em tempo real. O
software livre ganhou fora e produtos de
excelente qualidade esto disponveis, particularmente para o mercado web. Com o advento das mdias sociais, as empresas e instituies tm obrigao de possuir um website ou portal de qualidade e integrado s
mais importantes mdias sociais, sob pena de
verem suas marcas e reputaes manchadas
pelos MOBs, boatos da rede. Mais do que
24/7, os projetos web devem prover 24/7/
365.
Neste contexto temos o CMS Joomla!
(pronuncia-se Jumla), que utiliza ambiente
baseado no acrnimo LAMP (Linux

14/683

Apache Mysql Php). Surgiu a partir de um


fork entre os desenvolvedores do projeto
Mambo, com a empresa detentora da patente. Atualmente, o Joomla o CMS open
source mais utilizado no mundo. Este fato
resultado de sua simplicidade, praticidade e
baixa curva de aprendizagem, permitindo
que qualquer pessoa sem conhecimento tcnico, possa gerenciar web sites ou portais
desenvolvidos com a ferramenta.
O lado ruim? Vrios web sites em desacordo
com as webstandards e com potencial risco
marca e imagem das empresas e instituies,
tendo em vista a probabilidade de ocorrer
um grave incidente relacionado a segurana,
seja atravs de defacement, SQL Injection, Denial of Service, xss ou PHP
injection.
Ento o Joomla inseguro? Lgico que no.
Joomla em sua ltima verso STABLE, seja
2.5.x ou 3.x, extremamente seguro. A

15/683

maioria dos ataques so resultantes da utilizao indiscriminada de templates piratas,


provedores ruins, verses desatualizadas e
permisses equivocadas para os diretrios e
arquivos. Poderiam ser facilmente evitados
com medidas bsicas relativas ao uso do
CMS, dentre elas:
manter a verso do CMS atualizada;
hospedar o projeto em servidores
idneos e bem configurados;
utilizar urls amigveis;
templates comerciais, somente os adquiridos nos clubes de template; e
utilizar extenses que potencializam
a
segurana
da
rea
de
administrao.
A segurana do site fundamental para
manter a credibilidade do cliente, do desenvolvedor e do projeto Joomla!
Este livro no tem o intuito de ensinar programao nem to pouco est cheio de cdigos, na verdade, pretende ser um guia, quase

16/683

um manual de utilizao do Joomla! 3.x. Mas


no se iluda, est recheado de dicas e atalhos
que iro ajud-lo(a) na caminhada rumo ao
sucesso! Marque-o e encha-o de orelhas.
Torne-o seu livro de cabeceira e lembre-se
que os insumos para realizao do projeto
proposto, esto disponveis em http://www.livrodejoomla.com.br/insumos/
Um grande abrao do seu amigo joomleiro,
Jlio Coutinho (@cout45).

Captulo 1 Noes Bsicas


O objetivo deste captulo apresentar as
atividades a serem desenvolvidas antes de
pensarmos em prancheta e ou planejamento
de desenvolvimento, podendo ser desempenhadas pelo prprio cliente ou pelo desenvolvedor contratado.
Registro de domnio
Registrar um domnio e editar o DNS bem
mais simples do que parece e todas as pessoas que possuem um negcio ou desempenham um servio diretamente ligado a seu
nome, devem faz-lo antes que seja tarde.
Infelizmente, existem empresas caadoras de
domnios que monitoram e registram nomes
de outras empresas e pessoas e depois
tentam negociar a venda. Voc pode estar
perguntando mas isto legal? Sim, porm

18/683

penso que registrar o nome de uma pessoa e


depois ligar tentando negociar a venda, de
uma imoralidade sem tamanho.
Alis, passei por isso quando um cidado
registrou o domnio joomlabrasilia.com.br,
publicou um website que denegria a imagem
do Joomla! e tentou negociar a venda
comigo. Tive que esperar o trmino do prazo
do registro (1 ano), entrei em processo de
disputa e consegui reverter a situao.
O nome do domnio pode ser registrado por
qualquer pessoa ou empresa e a menos que
seu nome esteja relacionado a uma marca registrada no INPI, devidamente reconhecida,
voc ter problemas srios se quiser de volta.
H trs anos desenvolvi um website para um
poltico de renome nacional e disparei alguns
e-mails de teste, equivocadamente para o
domnio
composto
pelo
nomedomesmo.com.br. No mesmo dia,

19/683

recebi um e-mail do dono domnio, que


citava o fato de receber muitos e-mails no
nome do poltico por acharem que o domnio
pertencia ao mesmo e propunha que eu negociasse a venda do domnio. Eu receberia
10%. Quanto ele queria pelo domnio ?
R$120.000,00.
Ok, vou satisfazer sua curiosidade a respeito
de ter ou no negociado. No, na verdade
nem respondi o e-mail dele e continuei o
desenvolvimento do projeto.
A venda de domnios um negcio rentvel,
basta relembrar o caso do domnio sex.com
que foi vendido em outubro de 2009 por U$
13 milhes, cerca de R$ 22 milhes,
tornando-se o domnio mais caro do mundo.
Mas o que um domnio? O domnio nada
mais que a transformao de um nmero
IP (Internet Protocol) em notao humana,
ou seja, um conjunto de caracteres que

20/683

resultaro em um nome fcil de ser guardado


e lembrado.
A primeira extenso de domnio foi a .com e
surgiu em 1996 na poca da Arpanet. Hoje,
temos vrias extenses (.net, .org, .pro, .info,
.me ), que servem para identificar o tipo do
domnio e as ltimas duas letras o pas.
Vamos analisar o domnio http://www.juliocoutinho.com.br separando-o em partes:
O http o identificador de protocolos, poderia ser https, por exemplo. No case sensitive, voc pode digitar HTTP, http ou hTtp
vai funcionar;
www.juliocoutinho.com.br o DNS (Domain
Name System) da mquina em que o
domnio foi cadastrado e jamais ser sensitive. Logo, voc pode digitar wwW.jULIocoUtinho.COM.bR que vai funcionar normalmente.
com identifica um domnio comercial
br o domnio est relacionado ao Brasil
Anlise feita chegamos a concluso que o

21/683

domnio juliocoutinho.com.br um domnio


comercial do Brasil.
O rgo responsvel pelo registro de
domnios brasileiros (com.br, org.br, net.br,
pro.br e etc.) o CGI (Comit Gestor de Internet) e o custo anual para manuteno do
domnio R$30,00. Para registrar um
domnio, basta acessar o website do CGI http://registro.br e seguir os seguintes passos:
1) efetuar o cadastro, gratuito, no website;
figura: tela de cadastro de novo usurio

22/683

2) verificar a disponibilidade do domnio


desejado;
figura: pesquisando um domnio

Se o domnio j estiver registrado voc ser


informado e clicando no hiperlink "Mais informaes" ter acesso a alguns detalhes
sobre o registro. Ex: Domnio dancei.com.br
j est registrado.
Mais informaes
Domnio: dancei.com.br
Servidor DNS: ns1.kinghost.com.br
Servidor DNS: ns2.kinghost.com.br
Expirao: 2011-06-04
Status: Publicado
As informaes completas podem ser acessadas atravs do hiperlink Whois.

23/683

% Copyright (c) Nic.br


% A utilizao dos dados abaixo permitida
somente conforme
%
descrito
no
Termo
de
Uso
(http://registro.br/termo), sendo
% proibida a sua distribuio, comercializao ou reproduo,
% em particular para fins publicitrios ou
propsitos
% similares.
% 2011-02-25 09:39:06 (BRT -03:00)
domnio: dancei.com.br
entidade: julio cesar de paula coutinho
documento: 825.144.886-72
pas: BR
ID entidade: JCC827
ID admin: JCC827
ID tcnico: JCC827
ID cobrana: JCC827
servidor DNS: ns1.kinghost.com.br
status DNS: 24/02/2011 AA
ltimo AA: 24/02/2011

24/683

servidor DNS: ns2.kinghost.com.br


status DNS: 24/02/2011 AA
ltimo AA: 24/02/2011
criado: 04/06/2008 #4533865 expirao:
04/06/2011
alterado: 30/11/2010
status: publicado
ID: JCC827
nome: julio cesar de paula coutinho
e-mail: webmaster@joomlabrasilia.org
criado: 09/11/2005
alterado: 04/08/2009
Estando o domnio liberado basta acessar
sua rea para dar continuidade ao registro.

25/683

figura: Registrando o domnio

A primeira parte do cadastro relacionada


aos dados do domnio e seus dados pessoais.
Perceba que o custo anual de manuteno do
domnio R$30,00.
A prxima parte est relacionada os ID's responsveis pelo domnio. O mais importante
o ID Administrativo tendo em vista que ele
tem precedncia sobre o tcnico e de cobrana. Tenha cuidado com profissionais e
empresas que se oferecem para registrar o
domnio para voc. Alm de cobrar de
R$10,00
a
R$20,00
pelo
servio,

26/683

infelizmente, uma minoria mal intencionada


registra o domnio sob o ID Administrativo
dela, delegando a voc apenas o ID de cobrana. Quando voc tenta mudar a hospedagem ou mesmo cancelar o contrato com o
profissional comeam os problemas e a dor
de cabea certa.
Um dos casos que mais me chamou a
ateno a respeito de registro de domnio, foi
o de uma artista aqui de Braslia que ligoume desesperada pois tinha contratado um
cara para fazer o site e j haviam se passado
seis meses sem que o mesmo ficasse pronto.
Ela entrou em contato e o cara no deu
ateno, ento, ela fez o bvio e foi atrs de
outro: eu. Minha primeira pergunta foi relativa ao domnio, ela afirmou que ele havia
registrado, que ela pagou o boleto e etc...
nessa hora pensei: Game Over. Consultei o
domnio no CGI e no deu outra, ele havia
registrado no nome da empresa dele, delegando a ela apenas o ID de cobrana, ou seja:

27/683

O domnio era dele. A nica coisa que pude


fazer foi orient-la no sentido de entender-se
com ele pois de nada adiantaria fazer outro
website se no teramos acesso a edio do
DNS que determinante para apontar a mquina em que o mesmo est hospedado.
figura: informaes sobre o contato do detentor do domnio

Por ltimo, temos o DNS que vai ligar o


domnio a mquina do provedor que voc
contratou.
Geralmente
o
master

ns1.dominiodoprovedor,
o
slave
1
ns2.dominiodoprovedor e sucessivamente.
Esses dados so informados a voc via email, pelo provedor contratado.

28/683

figura: editando o DNS

Provedor de hospedagem
Existem vrias empresas que hospedam
websites no Brasil a um valor mensal mdio de R$20,00. No indico nenhuma e sugiro que faa uma busca por hospedagem de
sites na google e escolha seu plano de hospedagem, preferencialmente Linux. Muitos
usurios tm medo de escolher o plano
Linux por nunca terem usado o sistema operacional do pinguim e acabam optando por
Windows, o que via de regra acarretar em
problemas futuros.
A montagem do servidor fica por conta da
empresa contratada cabendo a voc a utilizao de forma transparente. Aps escolher o

29/683

plano e concluir o cadastro, voc receber via


e-mail, dados para acesso FTP (File Transfer
Protocol) que o protocolo usado para transferncia de arquivos e diretrios entre sua
mquina local e a mquina hospedeira e dados para acesso ao painel de controle do
provedor.
Quando voc contratar o provedor ele ir
sugerir o registro de domnio e edio de
DNS, com custo obviamente. Em mdia cobram R$10,00 para digitar as duas linhas
relacionadas ao DNS. Fechando a conta, o
custo final do registro de domnio e edio
do DNS chega a R$50,00. mole ou quer
mais? Fuja disso e faa voc mesmo.
Uma vez contratada a empresa que cuidar
da hospedagem do website, voc receber via
email, todos os dados necessrios a publicao do projeto na Internet. Levando-se
em conta que voc contratou um plano de

30/683

hospedagem GNU/LINUX, os dados sero


parecidos com os abaixo discriminados:
FTP File Transfer Protocol o protocolo
utilizado no envio de arquivos de sua mquina local, para a mquina do provedor
contratado. Por email, voc receber os
seguintes dados:
Host de FTP algo parecido com
ftp.seusite.com.br
Usurio de FTP em geral idntico ao
domnio, sem a extenso. Ex: seusite
Senha de FTP uma senha padro ser atribuda e voc deve troc-la no painel de controle do provedor
Porta normalmente ser a 21
Caminho inicial via de regra ser a barra
(/)
DATABASE Alguns provedores no permitem que os usurios criem banco de dados. Geralmente o prprio provedor ir criar
o banco enviando por email, os dados

31/683

necessrios para conectar-se ao mesmo:


Host do Banco de Dados o caminho do
SGBD, sofrer variao de provedor para
provedor. Remotamente os servidores que
oferecem revenda apontam o banco para localhost. Mas, vai depender de sua contratao.
Usurio do Banco de Dados o usurio do
banco est relacionado ao seu domnio, no
exemplo utilizado, se o domnio do website
seusite.com.br o usurio do banco ser:
seusite.
Nome do Banco de Dados o nome do
banco de dados est relacionado ao domnio,
mesmo em provedores que permitem a criao por parte do usurio. Considerando que
o provedor contratado criou o banco de dados. O valor utilizado ser: seusite.
Senha do Banco de Dados se o provedor
criar uma senha padro, acesse o painel de
controle do mesmo e altere a senha de acesso
ao banco de dados.

32/683

Provedores que permitem a criao de banco


de dados pelo usurio, atravs do CPanel, informaro os passos necessrios no ato da
contratao.
MAILTO O provedor informar ainda, todos os dados necessrios para configurar o
email de seu website, seja pela funo mail
do PHP, seja usando o Sendmail ou SMTP.
Voltaremos a abordar essas variveis quando
estivermos instalando o Joomla! e ajustando as configuraes do nosso projeto.

Captulo 2 - Joomla! 3
As 10 principais novidades do Joomla! 3,
so listadas a seguir:
Compatibilidade total com Mobile (WAP)
Instalao rpida, simplificada e com opo
de vrios tipos de layouts
Melhoria sensvel na usabilidade do painel
administrativo (Back-end), com novo template
Melhoria na usabilidade do gerenciamento
de contedo via painel administrativo (backend)
Implementao de Drag-and-drop (arrastar
e soltar)
Unificao das configuraes mais relevantes
Implementao de seleo rpida (auto completar)
Controle sobre as atualizaes do Joomla via
tem de menu no painel administrativo
(back-end)

34/683

Suporte ao banco de dados PostgreSql


Implementao de responsividade,
templates pr-instalados

em

Ciclo de Lanamento
Joomla! desenvolvido utilizando um ciclo
de lanamento fixo. A cada seis meses, o projeto Joomla! lana uma nova verso. As verses so classificadas em:
Major;
Minor; e
Maintenance.
Cada verso do Joomla! suportada pelo
Projeto Joomla! por um determinado perodo de tempo. Existem duas classificaes
para o suporte: Suporte Padro (STS) e
Suporte a longo prazo (LTS). A cada trs
lanamentos, ser atribudo suporte a longo
prazo.
STS (suporte padro) Os lanamentos so
suportados por sete meses. Seu suporte

35/683

termina um ms aps a liberao da prxima


verso do Joomla; e
LTS (Suporte de longo prazo) as verses recebem suporte e atualizao por 21 meses.
figura: ciclo de lanamentos do Joomla!

Note que as duas verses, STS e LTS, depois


de terem atingido o status GA (General
Availability), so totalmente funcionais e
prontos para serem utilizados em ambiente
de produo. As verses so identificadas
pelo uso do termo STABLE, nos pacotes de
instalao.

36/683

A desvantagem de usar verses STS a necessidade de atualizar sua instalao do


Joomla! a cada seis meses. Por outro lado,
voc ter a vantagem de contar com novos
recursos e extenses compatveis com verses anteriores.
Geralmente, a primeira liberao de verso
STS aps uma verso LTS indica o incio do
ciclo de uma nova verso principal. Este
lanamento STS apresenta caractersticas
fundamentalmente novas e mudanas que
quebram a compatibilidade com as LTS
anteriores.
As liberaes posteriores de uma verso STS,
geralmente so compatveis com a primeira
verso STS. O lanamento de uma verso
LTS, termina com o ciclo de vida da verso
STS anterior.
Os trs lanamentos em um ciclo geralmente
so numeradas da seguinte forma:
STS [importante] 0.0 e [importante] 0.1

37/683

LTS [importante] 0.5.


Por exemplo, a verso STS 3.0 ir incluir alteraes 2.5, 3.5 e vai incluir mudana nas
verses descontinuadas 3.0 e 3.1.
Normalmente, haver um caminho de migrao (uma maneira oficialmente suportada
de migrar para a prxima verso) entre duas
verses LTS (Ex: desde x.5 para (x +1) 0.) e
entre uma verso LTS e a primeira liberao
de uma verso STS, no seu ciclo principal
(Ex: de x.1 de (x +1) 0.5). Mas, no haver
necessariamente para as seguintes verses
STS (Ex: desde x.5 de (x +1) 0.0).
A qualquer momento pode ser lanada uma
release de segurana e todos os usurios devem atualizar sua verso do Joomla! As releases no implicam em migrao e nem to
pouco esto ligadas a novas verses STS ou
LTS. As releases buscam resolver problemas
pontuais, quase sempre relacionados a

38/683

segurana, dentro do pacote STABLE da verso atual.


A esta altura voc deve estar se perguntando,
qual verso usarei em meus projetos? um
site novo? Use Joomla! 3, caso contrrio,
permanea no Joomla! 2.5.
At o lanamento deste livro, no
suportada a atualizao de uma instalao do
Joomla! 2.5 para 3.x, ao estilo one click.
Instalao
A instalao do Joomla!3 difere um pouco
das outras verses. Entretanto, as diferenas
esto relacionadas na melhoria do processo e
experincia do usurio.
Joomla continua sendo multiplataforma e
para instal-lo, voc precisa de um ambiente
propcio ao funcionamento de aplicaes
com PHP e MySQL. Existem vrios

39/683

programas SDK que instalam e configuram o


ambiente necessrio. Ex: Wamp, EasyPHP,
Xampp, Mamp, etc...
Usurios de Mackintosh que no saibam instalar o ambiente na mo, devem optar por
usar o Mamp ou Xampp.
O programa SDK mais utilizado o Xampp,
seja por sua portabilidade (Windows, GNU/
LINUX, Mac), seja por sua ligao com o
Apache. Para baixar o programa acesse http://www.apachefriends.org/pt_br/
xampp.html
Sugiro o acesso ao vdeo-tutorial que aborda
a preparao do ambiente em SO Windows e
GNU/LINUX, publicado no meu Canal do
YOUTUBE
(http://www.youtube.com/
cout45).
Neste livro iremos partir do principio que voc est usando o Sistema Operacional

40/683

Windows. Por qu? Porque este o ambiente


mais utilizado para desenvolvimento de projetos locais e precisamos desmistificar a ideia
que Joomla no funciona no Windows, ou
ainda, que existe algum tipo de problema em
criarmos o site no Windows e publicarmos
remotamente em ambiente GNU/LINUX.
Se voc est utilizando outro ambiente, basta
adaptar os passos abaixo, sua realidade.
Basicamente o que ir mudar ser o document root do Apache, diretrio responsvel
por receber as pginas web do ambiente. Ex:
htdocs (xampp) www (wamp, EasyPHP,
GNU/LINUX, Mac).
Para montar um servidor de produo, siga
as dicas constantes do ANEXO I no final do
livro.
Criando o diretrio raiz do site

41/683

Aps instalar e inicializar o seu ambiente,


crie um diretrio dentro do document root.
Este diretrio deve ter o nome desejado para
o site. Tome muito cuidado ao escolher o
nome, evite caixa alta, caracteres especiais e
espaos em branco.
Exemplos de nomes para o diretrio:
Meu Site (escolha ruim)
meu_site(escolha boa)
meusite (escolha boa)
figura: criando o diretrio para o site do livro

42/683

Na imagem acima criei o diretrio joomla


(nome do nosso site), dentro de C:wamp/
www
Instalao do Joomla! 3 Passo 1
Baixe o pacote estvel do Joomla! em http://www.joomla.org/download.html
e
descompacte todo o seu contedo no
diretrio criado. Lembre-se que estou
usando o diretrio joomla.
Se voc est usando o nome joomla, para o
seu site, verifique se o seu ambiente foi inicializado digitando http://localhost/joomla
em seu navegador. Caso esteja usando outro
nome para o site, substitua joomla pelo
nome do seu site. Ex: http://localhost/
meusite
Terminada a descompactao do pacote no
diretrio criado, aperte a tecla F5 para

43/683

atualizar o seu site e a imagem abaixo dever


aparecer em seu navegador.
figura: passo 1 [Configurao] - instalao joomla 3.0

Caso a imagem no aparea, verifique se o


ambiente foi inicializado corretamente.
Outra probabilidade a digitao incorreta
do nome do diretrio. Lembre-se que o PHP
case sensitive. Ou seja: meusite diferente
de Meusite.
Caso instale diretamente no provedor,

44/683

lembre-se que Joomla! 3 requer no mnimo a


verso 5.3 do PHP.
Em alguns provedores possvel adicionar a
verso 5.3, usando uma flag no arquivo
.htaccess, da seguinte forma:
# Habilitar o PHP 5.3
AddType application/x-httpd-php53 .php
Vamos abordar uma a uma as opes da tela
Configuraes Principais:
Selecione o idioma nesta aba voc seleciona o idioma padro utilizado na instalao
do Joomla!
Nome do Site Campo obrigatrio. O nome
do seu site, este nome ser utilizado pelo
rob de busca, na indexao. Seja criativo e
pense como um integrante de seu pblicoalvo.
Seu E-mail Campo obrigatrio. Este email
ser utilizado de forma global, sendo

45/683

responsvel por toda a comunicao de seu


site. Ex: Fale conosco, enviar artigo para um
amigo, envio de e-mails em massa e etc...
Fim evitar problemas com polticas anti
spam dos provedores, utilize um email que
tenha ligao com o seu domnio. Ex:
Domnio: www.seusite.com.br Email: contato@seusite.com.br
Nome do Administrador Campo obrigatrio. O usurio padro da administrao
do Joomla, o admin. Voc pode us-lo enquanto estiver em ambiente local, mas em
hiptese alguma dever ser utilizado em
produo.
Descrio Campo opcional O objetivo
deste campo auxiliar na indexao de seu
site pelos robs de busca. Seja sucinto(a),
criativo(a) e direto(a) na escolha da
descrio. Use frases que tenham significado
para o seu pblico-alvo. Ex: aprendendo
joomla em Braslia DF

46/683

Senha do Administrador Campo obrigatrio. Defina uma senha forte, composta de


texto, nmeros e caracteres especiais. Ex de
senha forte: li@87!j
Confirmar Senha Campo obrigatrio.
Repita a senha digitada anteriormente.
Site Offline Seleo. Voc pode optar por
deixar o seu site off-line logo aps a instalao. Desta forma, somente voc ter
acesso ao mesmo. O valor padro No.
Instalao do Joomla! 3 Passo 2
Clique em prximo para acessar as configuraes do Banco de Dados

47/683

figura: passo 2 [Banco de dados] - instalao joomla 3.0

Nesta etapa tentaremos conexo com o


SGBD para a criao do banco de dados e instalao das tabelas do Joomla!
A partir da verso 3.0, Joomla! passa a
suportar o SGBD Postgresql, um avano

48/683

significativo em relao a futura abstrao de


banco de dados, ou ADODB.
figura: passo 2 [Configurao do Banco de Dados] - instalao joomla
3.0

Vamos abordar uma a uma as opes da tela


Banco de dados:
Tipo de Banco de dados Joomla! suporta

49/683

os SGBDs Mysql e Postgresql.


A funo do PHP para conectar ao SGBD
Mysql pode variar de Mysql ou Mysqli.
Mysqli uma funo exclusiva do PHP 5 e +,
utilizada quando as tabelas innodb esto instaladas no SGBD Mysql. Como no sabemos
se o provedor possui as tabelas innodb instaladas, at que tentemos efetuar a conexo,
o padro continua sendo mysql.
Uma boa dica, tentar conectar com
mysqli, que ser assumida por padro assim que a verso do PHP 5 for detectada.
Caso no seja possvel, voc ser informado
por um aviso na tela e basta escolher o
mysql para conectar-se ao banco de dados.
Nome do Servidor Em ambiente local, o
caminho sempre ser localhost. Planos de revenda e provedores que usam CPanel, geralmente, utilizam o caminho localhost.
Alguns provedores usam o IP da mquina
servidora de banco de dados ou algo parecido com mysql.seudominio.extenso. Ex:

50/683

mysql.seudominio.com.br
Quando estiver usando Joomla em ambiente
remoto (provedor de hospedagem), esse
campo deve ser preenchido com a informao recebida por seu provedor. Esta informao enviada por email e consta no painel
de controle, aba Banco de Dados, de sua
hospedagem.
Nome de Usurio Em ambiente local, com
instalao padro do SGBD Mysql, sempre
ser root. Em ambiente remoto (provedor de
hospedagem), nunca ser root. Caso encontre algum provedor com usurio root
para acesso ao banco de dados, mude de
provedor.
Senha Em ambiente local em SO Windows,
com instalao padro do SGBD Mysql,
sempre ser em branco. Em ambiente local
com SO GNU/LINUX, ou ambiente remoto
(provedor de hospedagem), nunca ficar em
branco. Ser necessrio criar uma senha de

51/683

acesso ao banco de dados, escolha uma


senha forte.
Nome do Banco de dados Em ambiente
local, voc poder escolher qualquer nome.
Atente-se para o fato de no usar caixa alta,
espaos em branco, ou caracteres especiais.
Em ambiente remoto, o nome do banco
sempre estar atrelado ao seu domnio,
mesmo que seu plano de hospedagem
oferea bancos de dados ilimitados. Uma boa
prtica usar em ambiente local, o mesmo
nome que ser usado em ambiente remoto.
Ex: Domnio seusite.com.br Nome do banco
de dados: seusite
Prefixo das tabelas Todas as tabelas do
CMS Joomla possuem prefixos randmicos,
que as identificam dentro do banco de dados.
Desta forma, voc poder possuir n clientes
no mesmo banco de dados, uma vez que a
cada instalao do Joomla, novos prefixos
so gerados.

52/683

O uso de prefixo randmico no uma


novidade do Joomla!. Iniciou-se em verso
anterior do CMS e fundamental na preveno de ataques do tipo SqlInjection que
buscam o prefixo jos_ padro em Joomla!
1.0 e Joomla! 1.5.
Tabelas Antigas Caso esteja reaproveitando um banco de dados j criado, voc pode
optar por fazer backup ou remover as tabelas
existentes.
Instalao do Joomla! 3 Passo 3
Estamos terminando o processo de instalao do Joomla! em ambiente local,
clique em prximo para acessar as Configuraes Gerais

53/683

figura: passo 3 [Viso Geral - Finalizao] - instalao joomla 3.0

O Joomla! pode ser instalado com vrias


opes de design de contedo, visualizadas
no parmetro Instalar exemplo de contedo.
Recomenda-se aos iniciantes, a instalao de
exemplo de contedo.
Opes para exemplo de contedo:
No no ser instalado nenhum exemplo
de contedo, ao final do processo de instalao, o site ser composto apenas do tem
de menu Home. Esse tipo de instalao
ideal para desenvolvedores que desejam criar e testar novas extenses, ou sites de
pequeno porte;
Sample_blog os contedos sero instalados e o layout ser do tipo blog;

54/683

Sample_brochure os contedos sero instalados e o layout ser do tipo brochura;


Exemplo de Contedo Padro os contedos sero instalados no formato padro, j
conhecido, nas outras verses do CMS
Joomla;
Sample_learn os contedos sero instalados e o layout ser do tipo aprendizado/ensino/educao, ideal para sites de colgios;
Sample_testing os contedos sero instalados e disponibilizados de forma a permitir um estudo rpido sobre o CMS e suas
extenses instaladas por padro.
Viso Geral Voc pode configurar o email
para receber as definies de configurao
do site, aps sua instalao.
figura: passo 4 [Finalizao] instalao joomla 3.0

55/683

Neste quadrante, temos as configuraes


principais do site, incluindo as diretivas para
conexo ao Banco de dados.
figura: passo 4 [Finalizao] instalao joomla 3.0

Neste quadrante, temos as configuraes das


diretivas do PHP no ambiente, checadas na
pr-instalao e as configuraes recomendadas, das diretivas do PHP, para a
melhor performance do Joomla!
Diferente das verses anteriores do CMS,
qualquer valor diferente do requerido no
quadrante esquerdo (Verificao de pr-instalao), impede e aborta o processo de instalao do Joomla!

56/683

Em ambiente GNU/LINUX, o ltimo tem do


quadrante esquerdo (configuration.php),
pode no ser criado automaticamente, se existir restrio de permisso no diretrio. Caso
isso ocorra, basta seguir o processo e efetuar
as melhores prticas sugeridas, que so:
copiar todo o contedo do arquivo;
colar no bloco de notas; e
salvar como configuration.php, na raiz do
seu site.
figura: passo 4 [Finalizao] instalao joomla 3.0

57/683

Ao final do processo, a imagem acima ser


apresentada informando que o Joomla! foi
instalado com sucesso. A partir da verso 3.1,
temos a opo de instalar idiomas durante o
processo de instalao do CMS.
figura: Instalao de idiomas Joomla 3

Aps a instalao do idioma devemos escolher qual ser o padro do site e da administrao e continuamos com o processo, removendo o diretrio de instalao.

58/683

figura: diretrio de instalao instalao joomla 3

Lembre-se de remover completamente o


diretrio de instalao, clicando no retngulo
laranja Remover diretrio installation.
Aps a remoo voc pode optar por acessar
a parte pblica do site (front-end) ou a rea
administrativa (back end).
Diretrios e Arquivos ps-instalao
Quando voc instala o Joomla, vrios
diretrios e arquivos so criados na raiz do
site. Os diretrios so divididos em duas
classes: front-end e back-end.

59/683

figura: Diretrios e Arquivos ps-instalao joomla 3.0

Front-end x Back-end
O front-end a parte pblica de um site
Joomla e o back-end a parte administrativa.
Na raiz do site existe um diretrio chamado

60/683

administrator e dentro dele, vrios outros


diretrios e arquivos.
Quando digitamos http://meusite.com.br/
administrator carregado o arquivo index.php existente no diretrio /administrator. Quando digitamos http://meusite.com.br
o arquivo carregado o index.php existente
na raiz do site.
Diretrios do front-end
Diretrio Cache

O diretrio de cache fcil de ser entendido,


nele que gerenciamos o cache dos artigos.
Em um site dinmico o sistema muito exigido para puxar as informaes e apresentlas na pgina. Por exemplo: para apresentar
uma pgina em layout formato blog, o sistema acessa a base de dados para buscar os
artigos do blog, dispe os artigos na pgina e
carrega todos os mdulos publicados
naquela pgina. Via de regra, as informaes

61/683

existentes nos sites, relacionadas a artigos,


categorias e etc... permanecem horas ou
mesmo dias sem sofrerem alteraes.
Analise a seguinte situao: Se 50 usurios
fizerem requisies sua pgina para abrir
determinado artigo com intervalo de 1 hora,
1.200 requisies sero geradas ao banco de
dados antes que voc altere qualquer informao no mesmo, partindo do princpio que
voc atualiza o artigo 1 vez por dia.
Agora, reflita sobre o impacto da situao
acima, na performance do seu site. Trgico,
no?
Com a ativao do cache, tentamos reduzir o
nmero de requisies ao banco de dados
para obter exatamente a mesma informao,
tendo em vista que o usurio deixa de requisitar repetidamente ao banco de dados, o carregamento de determinado tem. Por exemplo: Mantendo um cache por perodo determinado talvez 15 minutos, quando o

62/683

usurio solicitar a primeira pgina, ela ser


compilada a partir do banco de dados, ficando uma cpia completa no diretrio de
cache.
A partir deste momento, a cada nova requisio, o sistema passa a verificar se o
prazo estipulado para o cache, no caso 15
minutos, expirou. Caso negativo, a pgina
que est no diretrio de cache apresentada,
evitando-se consulta ao banco de dados e
melhorando sensivelmente a performance do
site. As consultas ao banco de dados so
minimizadas, executadas somente se o prazo
estipulado para o cache tiver expirado.
Em um site com muitos acessos, onde a frequncia de visitas maior que a de atualizao de dados, o armazenamento das pginas
em cache, fundamental para potencializar a
performance do mesmo.

63/683

Para habilitar o cache do Joomla! 3.x voc


deve acessar o back-end e abrir o arquivo de
Configuraes Globais Aba Servidor.
figura: Configuraes de cache no Joomla! 3

Diretrio CLI

O diretrio CLI foi adicionado como um local


padro para armazenamento de aplicaes
do tipo comando-linha-Interface (CLI). Uma
das principais caractersticas da plataforma
Joomla sua capacidade de criar facilmente
aplicativos CLI que interagem com um site
Joomla. Aplicativos CLI so bem adequados
para execuo de tarefas com horrios
agendados, podemos utilizar o recurso

64/683

CRON do Linux, para agendar tarefas. Por


exemplo backup do site.
Diretrio Components

Um componente um programa de acordo


com os requisitos do framework Joomla. Em
um site, a principal funcionalidade de uma
determinada pgina e, geralmente, corresponde a um item de menu. Quando voc seleciona um item de um menu qualquer, a pgina carrega o componente definido por esse
item de menu. Nos subdiretrios do diretrio
components, esto todos os componentes integrantes do CORE e portanto, essenciais
ao Joomla:
com_banners componente de gerenciamento de banners inserido em pginas internas atravs de um mdulo
com_contact componente de gerenciamento de contatos
com_content componente de gerenciamento de categorias e artigos

65/683

com_finder componente de busca inteligente


com_mailto componente de gerenciamento de email acionado quando enviamos um artigo para um amigo, ao
preenchermos
o
formulrio
do
com_contact e ao enviarmos e-mail em
massa atravs do back-end. Componentes de
terceiros do tipo forms e news letter tambm utilizam o com_mailto para envio de
emails.
com_media componente de gerenciamento de mdias (imagens, vdeos, udio,
arquivos .doc, .pdf, .xls e etc). Quando
clicamos no boto Imagem do editor de texto
ao editar um arquivo, estamos chamando o
com_media
com_newsfeeds componente de RSS
com_search componente de busca
com_users componente de gerenciamento
de usurios
com_weblinks

component
de

66/683

gerenciamento de weblinks
com_wrappers componente de gerenciamento de iframes.
Diretrio Images

O diretrio images contm os arquivos de


imagens. Na distribuio padro do Joomla,
os subdiretrios banners e sampledata, so
previamente instalados. Os subdiretrios podem ser criados atravs do backend do site
Painel de Controle Quick Icons ou atravs
do menu superior Contedo Gerenciador
de Mdias.
figura: cone rpido gerenciados de mdias

Diretrio Includes

Os controles do front-end e back-end do site


so separados por aplicaes que carregam
diversas classes e constantes. O diretrio includes contm os programas especficos do

67/683

fron-end da aplicao.
Os seguintes arquivos esto no diretrio /includes:
application.php cria a classe Jsite
defines.php define o caminho dos arquivos
e constantes
framework.php carrega as partes comuns
usadas pelo framework do Joomla (Joomla!
Platform)
menu.php carrega as entradas de menu do
site, na memria
pathway.php cria a classe JpathwaySite
que usada no mdulo caminho de migalhas (mod_breadcrumbs), que mostra o
caminho atual do tem de menu
router.php carrega a classe Jroutersite.
Diretrio Installation
Este diretrio possui uma mini-aplicao necessria a instalao inicial do Joomla!
Quando a sesso do back-end ou front-end
iniciada o sistema checa o arquivo configuration.php. Caso no seja encontrado este

68/683

arquivo, o sistema entende que necessrio


carregar o mini-aplicativo de instalao.
A ltima tela do processo de instalao do
Joomla! 3 apresenta um boto para a excluso do diretrio antes da utilizao do
novo site.
Diretrio Language

Joomla! projetado para rodar nativamente


em 68 idiomas. Todo o texto do site traduzido antes do browser carregar o site.
Em uma instalao padro do Joomla! O
idioma utilizado o ingls da Gr-Bretanha.
A partir do Joomla! 3.x o processo de instalao de novos idiomas foi automatizado.
Para instalar um novo idioma basta seguir
pelo menu superior Extenses Gerenciador de Idiomas e clicar no boto Instalar
Idioma.
Os arquivos de idioma ficam nos diretrios
/language (traduo do front-end) e administrator/language (traduo do back-end).

69/683

Cada extenso possui 02 dois arquivos, um


terminado em .sys.ini e outro em .ini. Os arquivos .sys.ini so carregados para pegar o
nome e descrio da extenso, por exemplo,
mostrar o texto Gerenciamento de Mdulo.
O arquivo .ini apresenta todos os textos de
uma determinada extenso que esteja sendo
utilizada.
Diretrio Libraries

Este diretrio contm bibliotecas, programas


que podem ser reutilizados em diferentes
contextos. Por exemplo, a biblioteca phpmailer utilizada no processo de envio de
emails.
Normalmente a bilbioteca serve para determinada tarefa ou tarefas relacionadas. Na
verso 3.x temos as bilbiotecas constantes da
imagem abaixo:

70/683

figura: Bibliotecas no Joomla! 3

Diretrio Logs

Este diretrio guarda os arquivos de log


gerados pelo Joomla! Os logs so baseados
em certas condies. Por exemplo, algum
erro de processamento do sistema. Neste
caso o arquivo error.log ser gerado.
Diretrio Media

Este diretrio contm css, javascript e arquivos de imagens de componentes, mdulos e


editores.

71/683

O subdiretrio system, contm recursos da


biblioteca Mootools, do javascript, utilizada
em muitas funcionalidades do Joomla, por
exemplo: menus dinmicos.
Diretrio Modules

Neste diretrio temos os subdiretrios contendo cada mdulo de front-end de uma instalao do Joomla! 3.

72/683

figura: Diretrios de mdulos

73/683

A cada nova instalao de mdulo, novo subdiretrio adicionado no diretrio modules.


Diretrio Plugins

Neste diretrio ficam as extenses do tipo


plugin. Os plugins esto distribudos em subdiretrios, de acordo com a funcionalidade.
figura: Diretrios de plugins

Authentication Usados uurante o login


checa nome de usurio e senha digitados
Captcha Apresentam a tela com o recurso
Captcha pra implementar a segurana no

74/683

registro, cadastro, envio de mensagens, login


e comentrios
content Usados na criao e edio de artigos
editors Usados no carregamento do editor
de texto, padro. Por exemplo, tinyMCE
editors-xtd Criam os botes de edio
(Article, Image, Page Break, Read More)
quando os editores de texto so carregados
extension Usados para instalar, atualizar e
desinstalar extenses
finder Usados para a busca inteligente
josetta_ext Usados no recurso nativo de
multi-idiomas
quickicon Usados nos cones rpidos
search Usados na busca
system Usados em vrios pontos do ciclo
de execuo dos comandos do sistema. Por
exemplo: inicializao de sesso, requisies,
redenreizaes e etc...
user Usados nas operaes de CRUD relacionadas ao usurio cadastrado ou logado.

75/683

Diretrio Templates
Neste diretrio temos os templates instalados no front-end do site. Na instalao
padro do Joomla! 3.x o template usado pelo
sistema o Protostar.
No Joomla! o contedo fica gravado no
banco de dados e a parte grfica fica a cargo
de uma extenso chamada template. A separao entre contedo e grfico um dos
conceitos defendidos pela Web 2.0.
O subdiretrio system contm o template
que ser utilizado automaticamente pelo sistema caso no seja encontrada a classe css
utilizada pelo template padro do site.
Diretrio Tmp

A cada instalao de uma nova extenso o


pacote comprimido carregado e descompactado dentro do diretrio /tmp. Depois, o
processo continua com a criao dos
diretrios especficos da extenso permanecendo uma cpia do pacote, no diretrio.

76/683

Dificuldades em instalao de extenses podem estar associadas s permisses do


diretrio /tmp.
Diretrios do back-end
Diretrio Cache
O diretrio administrator/cache serve para
armazenar temporariamente, os arquivos de
cache do back-end do site, quando o mesmo
est ativo.
Diretrio Components

O diretrio administrator/components contm todos os componentes instalados no site.


Diretrio Help

O diretrio administrator/help contm um


arquivo chamado helpsites.xml. Este arquivo
contm uma lista de sites de ajuda. Normalmente o boto de ajuda est linkado ao

77/683

arquivo de ajuda online disponvel em http://docs.joomla.org


Diretrio Includes

Os controles do front-end e back-end do site


so separados por aplicaes que carregam
diversas classes e constantes. O diretrio administrator/includes contm os programas
especficos do back-end da aplicao.
Os seguintes arquivos esto no diretrio administrator/includes:
application.php cria a classe Jsite
defines.php define o caminho dos arquivos
e constantes
framework.php carrega as partes comuns
usadas pelo framework do Joomla (Joomla!
Platform)
helper.php carrega as entradas de ajuda
toolbar.php carrega a barra de ferramentas
do sistema.
Diretrio Language

78/683

O diretrio administrator/language contm


os arquivos de idioma da rea administrativa
do site e das extenses instaladas.
Diretrio Manifests

O diretrio administrator/manifests foi introduzido na verso 1.6 do Joomla! e contm


os recursos necessrios para a funcionalidade de atualizao one-click. No diretrio
temos trs subdiretrios, a saber:
files este subdiretrio contm um arquivo
chamado joomla.xml que lista todas as pastas de nvel superior e arquivos em uma instalao padro do CMS. Ele tambm contm uma lista de URLS dos servidores de
atualizao onde o programa pode procurar
verses de atualizao desses arquivos. Este
arquivo xml informa ao atualizador quais arquivos a aplicao deve atualizar.
libraries este subdiretrio contm um arquivo xml para cada biblioteca usada no
Joomla. Esses arquivos XML listam todas as

79/683

pastas e subpastas na biblioteca e, novamente, uma URL onde o programa pode


verificar se h atualizaes para a biblioteca.
packages este diretrio tambm contm
um arquivo chamado joomla.xml. Isto
suporta um mtodo de atualizao da verso
do Joomla como um pacote, em vez de um
conjunto de arquivos. Este recurso uma das
novidades do Joomla! 3.1.x e foi estendido
atualizaes de extenses. Ir apoiar relaes
de dependncia entre as extenses. Por exemplo, se voc pedir para atualizar ou instalar a extenso A e houver dependncia de
extenses B e C, estas sero automaticamente includas na instalao ou na
atualizao.
Diretrio Modules

O diretrio administrator/modules possui


subdiretrios contendo cada mdulo instalado no site que possua funcionalidades
no back-end.

80/683

Diretrio Templates

O diretrio administrator/templates contem


os templates utilizados no back-end do site.
No Joomla! 3.x, o template padro denominado sis, em homenagem deusa egpcia
do amor.
No diretrio /administrator encontram-se
ainda os seguintes arquivos:
index.php este arquivo carregado automaticamente ao tentarmos acessar no navegador, o diretrio /administrator do site. o
ponto de entrada para o back-end do
Joomla. Ele controla o ciclo de comando de
back-end da mesma forma que o arquivo index.php do diretrio raiz do site controla o
ciclo de comando do front-end. Observe que,
como queremos que o sistema carregue esse
arquivo, no temos um arquivo index.html
no diretrio. Por qu? A ordem de carregamento padro de arquivos, executado pelo
servidor web prev que arquivos .html sejam
os primeiros a serem renderizados pelo

81/683

navegador.
configuration.php este arquivo criado
aps a instalao do Joomla e contm informaes importantes e sensveis do site.
Por exemplo, as diretivas de acesso ao banco
de dados. Os dados do arquivo podem ser
editados atravs do Painel de Controle
Configuraes Globais no back-end do site,
exceto a senha de acesso ao banco de dados
que, por questes de segurana no visualizada no back-end. Para alterar a senha,
deve-se abrir o arquivo para edio em uma
IDE que suporte arquivos .php. Por exemplo,
o bloco de notas.
htaccess.txt este arquivo deve ser
renomeado para .htaccess ( o (.) antes do arquivo significa que o mesmo um arquivo
oculto do GNU/LINUX). O .htaccess pode
ser definidio como um arquivo de orientao
para o servidor web Apache. No Joomla,
permite a utilizao de URLs amigveis e em
conjunto com o mdulo mod_rewrite do

82/683

Apache, exclui o index.php das URLs,


alm de aumentar a segurana do sistema
como um todo.
joomla.xml este arquivo uma cpia do arquivo existente no diretrio administrator/
manifests/files/ sendo utilizado durante o
processo de instalao do Joomla, sendo excludo do diretrio raiz logo aps o trmino
do mesmo.
LICENSE.txt este arquivo contm a ntegra
da licena GNU/GPL.
README.TXT este arquivo contm informaes gerais sobre o Joomla.
robots.txt - web robs um termo para programas que automaticamente passam pela
web e coletar informaes sobre sites. Os
motores de busca, como o Google e outros,
usam robs para manter seus ndices atualizados. Spammers e crackers usam robs para
reunir endereos de correio eletrnico e outros fins maliciosos.
O arquivo robots.txt includo na instalao

83/683

padro do Joomla, permite que os robs


acessem as subpastas de seu site.
web.config.txt este arquivo similar ao
.htaccess e deve ser utilizado apenas se o site
estiver rodando em servidor Windows.
Lembre-se que uma boa prtica relacionada
segurana consiste em hospedar o site em
servidor GNU/LINUX e neste caso, exclua o
arquivo web.config.txt.

Captulo 3 - Modelos de Layouts no


Joomla! 3
Joomla! possui vrios tipos de layouts para
design de contedo. Abaixo, irei listar visualmente, os modelos existentes.
Layout sem exemplo de contedo
Parmetro No este parmetro inibe a instalao de exemplo de contedo, ao final do
processo, o site ser composto apenas do
mdulo de menu Main Menu e do mdulo de
login.
A imagem do topo e as opes de aumento e
diminuio da fonte, so insumos atrelados
ao template padro utilizado.
Esse tipo de instalao ideal para desenvolvedores que desejam criar e testar novas
extenses, ou sites de pequeno porte.

85/683

figura: layout sem exemplo de contedo instalao joomla 3.0

A imagem anterior representa o front-end,


que a rea pblica do site instalado, sem
exemplo de contedo.
Layout com exemplo de contedo, formato
blog
Parmetro Sample_blog este parmetro
instala o exemplo de contedo no formato de
blog, utiliza outro template padro e publica
os mdulos referentes ao formato.

86/683

figura: layout com exemplo de contedo em formato blog instalao


joomla 3.0

A imagem acima representa o front-end, que


a rea pblica do site instalado, com contedo no formato blog.
Layout com exemplo de contedo, formato
brochura
Parmetro Sample_brochure este parmetro instala o exemplo de contedo no

87/683

formato de um livro com acabamento


brochura.
figura: layout com exemplo de contedo em formato brochura instalao joomla 3.0

A imagem anterior representa o front-end,


que a rea pblica do site instalado, com
contedo no formato brochura.
Layout com exemplo de contedo, formato
padro do Joomla!
Parmetro Exemplo do contedo padro
os contedos sero instalados no formato

88/683

padro, j conhecido, nas outras verses do


CMS Joomla.
figura: layout com exemplo de contedo em formato padro instalao joomla 3.0

A imagem acima representa o front-end, que


a rea pblica do site instalado, com contedo no formato padro.
Layout com exemplo de contedo, formato
aprendizado

89/683

Sample_learn os contedos sero instalados e o layout ser do tipo aprendizado/ensino/educao.


figura: layout com exemplo de contedo em formato educao instalao joomla 3.0

A imagem anterior representa o front-end,


que a rea pblica do site instalado, com
contedo no formato aprendizado/ensino/
educao.

90/683

Layout com exemplo de contedo, formato


teste
Sample_learn os contedos sero instalados e disponibilizados de forma a permitir
um estudo rpido sobre o CMS e suas extenses instaladas por padro.

91/683

figura: layout com exemplo de contedo em formato teste instalao


joomla 3.0

92/683

A imagem acima representa o front-end, que


a rea pblica do site instalado, com contedo no formato teste.

Captulo 4 - Extenses x Joomla!


Um dos destaques do Joomla em relao a
outros CMSs Open Source a possibilidade
de aumentar suas funcionalidades, instalando extenses, ou seja: Novos programas ou pedaos de cdigo, com funcionalidades especficas.
Componente a extenso de maior complexidade, pode ser comparada a um aplicativo dentro do prprio Joomla. um programa desenvolvido de acordo com os
padres de projeto MVC, orientado a objetos e via de regra interage com o banco de
dados de seu website, criando novas
tabelas.
Mdulo o mdulo serve para mostrar o
resultado de alguma ao do componente
ou pode estar isolado executando alguma
funo. Temos como exemplo, o mdulo de

94/683

login que, uma vez habilitado, mostra as


opes de criao de conta e entrada a rea
administrativa do website. Por outro lado, o
mdulo Hora Certa, apresenta o horrio
atmico baseado em um servidor externo e
no interage criando tabelas no banco de
dados.
Plug-in um script que executa determinada funo. Por exemplo, um plugin de publicao de contedo no twitter, reage ao
clique em determinado cone e abre a tela de
validao para compartilhar o texto de seu
website para todos os seus seguidores.
Language o idioma disponvel para determinada extenso. Geralmente a extenso
est em ingls e dependendo de sua importncia, traduzida para vrios idiomas.
Template sim, o template tambm uma
extenso. Mais adiante, temos um espao

95/683

especial, dedicado ao mesmo. Se quiser pode


dar uma olhada no captulo Joomla! XP
System uma extenso que s funciona
com outra pr-instalada. Por exemplo, um
plugin que tem como pr-requisito para seu
funcionamento, a instalao do componente
K2.
Observe a figura abaixo e ao navegar pelo
JED http://extensions.joomla.org, saiba
identificar cada extenso.
figura: Identificando as extenses no JED

Para instalarmos uma extenso no Joomla!,


devemos seguir pelo menu superior

96/683

Extensions Extension Manager ou atravs


do cone rpido Extension Manager.
A dificuldade para instalarmos um idioma,
que a menor extenso em termos de complexidade, a mesma para instalarmos um
componente, extenso mais complexa.
Abaixo temos a imagem demonstrando a instalao do pacote de idiomas portugus do
Brasil, em nosso site, atravs do Gerenciador
de Extenses.
figura: Instalando o idioma pt-BR no site

O Joomla! 3 inovou o gerenciamento de idiomas com a opo de instalao automtica a

97/683

partir do repositrio oficial. Essa novidade


ser abordada no captulo sobre Gerenciamento de Idiomas.
Existem 03 (trs) formas de instalarmos uma
extenso no site, a saber:
Selecionar o pacote na mquina local e fazer
upload para o servidor do site;
Descompactar o pacote no diretrio /tmp do
site; e
Instalar a partir de uma URL.
O pacote da extenso deve estar compactado,
para a perfeita instalao. As formas de compactao aceitas so: .zip, .tar e .targz.

Captulo 5 sis, novo template administrativo do Joomla!


A rea de administrao de um site em
Joomla! conhecida por back-end e a nova
verso do CMS apresenta uma novidade interessante: O template administrativo sis.
Baseado em Bootstrap do Twitter e no lanamento da biblioteca de interface do usurio
Joomla! (JUI), o template presta homenagem deusa egpcia do amor.
Alis, os nomes de temas administrativos so
inspirados nos Deuses do Egito, desde a verso 1.5.
Voc pode conhecer melhor o template sis,
seguindo pelo menu superior Extensions
Template Manager. Na aba Styles, clique
sobre o nome do template para acessar a
edio de parmetros.

99/683

O template Isis permite que voc escolha


uma imagem para o Back-end, alm de outras opes que mostrarei abaixo:
figura: figura: Aba Details do Template sis

Style Name Nome do estilo utilizado pelo


template;
Template nome do template e sua rea de
atuao (no podem ser editados); e
Default determina se o template sis ser o
padro do Back end.

100/683

figura: figura: Aba Options do Template Isis

Template Colour Escolha uma cor geral


para o modelo. Deixando em branco, ser
utilizado a valor padro da folha de estilos;
logo escolha o logotipo para o Back end do
site;
Collapse Administrator Menu se voc pretende usar um monitor para acessar o Back
end do site, marque o valor No. Isto evitar

101/683

o colapso do menu de administrador quando


houver reduo na largura da janela. O valor
padro sim;
Display Header opo de visualizao do
cabealho;
Status Module Position escolha a posio
do mdulo de status, acima ou abaixo do
template. Observe a imagem abaixo, o
padro Fixed Bottom;
figura: figura: Mdulo de status do template Isis

Sticky Toolbar opo para fixar a barra de


ferramentas na posio.
Sem dvida a melhoria fica evidente e o
nico pecado do template, a meu ver, foi
mudar os botes de ao da viso de edio,
da direita para a esquerda. A experincia do
usurio e padres de usabilidade, apontam
para a permanncia dos botes no lado
direito da tela.
Menu Superior

102/683

figura: figura: menu dinmico template Isis

O template possui um menu dinmico localizado na parte superior, que permite acesso
ao CMS como um todo e cada ao ser explicada de forma analtica. Abaixo temos um
resumo das mesmas:
1 opo a esquerda ttulo do site, uma vez
clicado, permite o acesso ao front-end;
Opo System permite acesso aos parmetros relativos ao sistema:
Control Panel acessa o painel de controle
Global Configuration acessa as configuraes globais do site
Global checkin permite checar as tabelas,
limpar o cache e purgar o cache expirado
Clear cache permite limpar o cache
Purge expired cache permite purgar o
cache expirado
System Information permite acesso a configuraes relevantes do sistema
Aba System Information: informaes sobre

103/683

o SO da mquina hospedeira, verso do Web


Server, verso do SGBD, verso do PHP, interface do PHP com o Web Server, verso do
Joomla e verso da J!Plataform;
Aba PHP Settings: informaes relevantes
sobre as diretivas do PHP;
Aba Configuration File: informaes sobre o
configuration.php do seu site;
Aba Directory Permissions: permisses dos
diretrios do seu site. Lembre-se que os
diretrios devem estar com permisso 0755 e
arquivos com permisso 0644;
Aba PHP Information: informaes do PHP.
Dependendo do grau de segurana do Servidor, essas informaes estaro indisponveis.
Users permite acesso aos parmetros relativos ACL (Lista de Controle de Acesso) do
site. Nesta aba gerenciamos usurios,
grupos, nveis de acesso e envio de email em
massa;
Menus permite acesso a criao e

104/683

gerenciamento de menus e itens de menu. Se


voc um novato(a) em Joomla!, mas j fez
sites em html, o tem de menu seria o boto
de link do site em html;
Content permite acesso a estrutura de
design de contedo do CMS Joomla! Criao
e gerenciamento de categorias, subcategorias
e artigos. Envio e gerenciamento de imagens,
artigos de pgina inicial, temporizao da
publicao do artigo e etc...
Jakob Nielsen j pregava que na Web This
content is King. No CMS Joomla no poderia ser diferente, afinal de contas ele um
Sistema Gerenciador de Contedos e o contedo a razo de ser do CMS.
Components permite acesso aos componentes instalados por padro com o pacote estvel do Joomla!;
Extensions permite acesso ao gerenciamento de extenses do site.
Extension Manager: opes de instalao,
atualizao e gerenciamento de extenses no

105/683

site.
Module Manager: gerenciamento, criao,
publicao, duplicao e desinstalao de
mdulos.
Plug-in Manager: gerenciamento, publicao
e desinstalao de plug-ins.
Template Manager: gerenciamento, edio,
publicao e duplicao de templates.
Language Manager: gerenciamento de idiomas do site e da administrao, criao de
idioma de contedo (para sites multi-idiomas) e sobreposies de textos do idioma
(override).
Help permite acesso as opes de ajuda do
Joomla!
Painel de Controle
O painel de controle (Control Panel) do template isis, divide-se em trs partes: Dashboard, Frame Central e Quick Icons.
Dashboard

106/683

O Dashboard permite acesso rpido aos


parmetros de configurao do sistema. Perceba que o acesso pode ser efetuado tambm,
utilizando-se o menu superior, opo
System.
figura: figura: dashboard template Isis

Frame Central
O miolo (Frame Central) do template isis,
centraliza informaes de usurios logados,
artigos populares e ltimos artigos adicionados ao site.

107/683

figura: figura: Imagem frame central template Isis

Quick Icons
Os cones rpidos mudaram sensivelmente.
Menores e menos coloridos, permitem ao
usurio uma experincia interessante ao administrar o site via Back end. Acabou a disperso por conta de imagens animadas e
cores carregadas, a usabilidade agradece.

108/683

figura: figura: Quick Icons template Isis

Captulo 6 Configurao global do


site
Uma das primeiras tarefas ao criarmos um
site em Joomla! determinar o seu comportamento em relao ao projeto como um
todo. Esta a funo dos parmetros de configuraes globais.
Para acess-los vamos usar o Dashboard
Global Configuration
Perceba que fica disponvel esquerda, o
acesso rpido aos componentes instalados
no site.
A configurao global est dividida nas
seguintes abas:
Site configurao global do site;
System configurao global do sistema;
Server configurao global do servidor;
Permissions configurao global das permisses dos grupos; e

110/683

Text filters configurao global dos filtros


de textos.
Site
Fim melhorar o entendimento, vamos subdividir a aba site nos seguintes temas:
Site Settings;
Metadata Settings; e
SEO Settings.
Site Settings (Configuraes do site)

111/683

figura: global configuration configuraes do site

112/683

Vamos aos parmetros de configuraes do


site.
Site Name - O nome do site preenchido durante a instalao do Joomla;
Site Offline Opo escolhida durante a instalao do Joomla;
Offline Message Caso opte por deixar o site
off-line, uma mensagem apresentada ao
visitante de seu site. Nesta aba, voc pode
escolher dentre esconder a mensagem, usar
uma mensagem customizada ou usar a
mensagem padro do Joomla!
Custom Message A mensagem que voc
deseja apresentar aos visitantes, quando seu
site estiver off-line;
Offline Image Por padro, no ser apresentada nenhuma imagem quando o site
estiver no modo off-line. Neste parmetro,
voc pode escolher uma imagem no servidor
e/ou fazer upload de uma imagem para o
mesmo. Ex: o logotipo do cliente
Default Editor O TinyMCE continua sendo

113/683

o editor de texto padro do Joomla! e recomendo sua utilizao, tendo em vista ser o
melhor editor de texto open source. Duvida?
Vou mostrar-lhe no captulo de contedo.
Default Captcha O tipo de captcha utilizado no cadastro de usurios de seu site.
Default Access level Pblico, o nvel de
acesso padro do site. S altere se souber exatamente o que est fazendo.
Default List Limit A quantidade de itens
visualizados por tela, pode variar de 5 100.
Default Feed Limit A quantidade de feeds
visualizados por tela, pode variar de 5 100.
Feed Email As configuraes de email das
feeds. As opes so: email do autor, email
do site ou nenhum email.
Metadata Settings
Metadados)

(Configuraes

de

114/683

figura: global configuration configuraes de metadados

Metadados so informaes que passamos


aos robs indexadores de sites, particularmente o da google. No sou especialista no
assunto mas tenho bons cases. Ento, darei
dicas baseado nas melhores prticas adotadas em meus projetos.
Vamos aos parmetros de configuraes dos
metadados:

115/683

Site Meta Description Uma descrio curta


e direta de seu site, focada no seu pblicoalvo. Use no mximo 35 palavras;
Site Meta Keywords Utilize frases curtas
relacionadas ao seu negcio. No use (,) ou
(;) para separ-las. Uma boa prtica utilizar at 06 frases;
Robots A melhor opo geralmente Index, No Follow;
Content Rights O tipo de licena para o uso
do site, por terceiros;
Show Author Meta Tag Mostrar o autor do
contedo;
Show Joomla! Version Esta diretiva uma
novidade interessante pois inibe a apresentao, se assim selecionada, da tag que
identifica um site Joomla, quando da exibio do cdigo-fonte. Ex: uso da tecla (ctrl +
u) no firefox.
SEO Settings (Configuraes de SEO)

116/683

figura: global configuration configuraes de SEO

As configuraes de SEO esto relacionadas


optimizao do seu site para mquinas de
busca. SEO ser abordado no captulo 7.
Vamos aos parmetros de configuraes de
SEO:
Usar URLs amigveis Marque (Sim), para
que sejam geradas URLs amigveis e facilitem a indexao de seu site pelos buscadores.

117/683

Reescrever URLs - Para usar mod_rewrite


do Apache, que ser responsvel por reescrever as URLs, devemos renomear o arquivo
htaccess.txt que est na raiz do site, para
.htaccess.
Adicionar Sufixo URL Isto ir adicionar o
sufixo .html URL amigvel gerada,
aumentando sua compreenso por parte do
internauta e melhorando a indexao pelos
buscadores.
Apelidos Unicode Desde a verso 1.6,
Joomla! usa URLs Unicode. Desta forma, os
apelidos exibiro os glifos utf8 em vez de caracteres da tabela ascii. Navegadores
comportam-se de forma diferente quando
copiam urls. Firefox ir copiar o formato unicode, enquanto o pera ir obter os hierglifos originais. A google no tem nenhum
problema para pesquisar ou referenciar tais
ligaes.
Incluir nome do site no ttulo da pgina voc pode optar por exibir ou no, o nome do

118/683

seu site no ttulo da pgina.


Cookie Domain domnio do cookie.
Cookie Path caminho do cookie.
System
Fim melhorar o entendimento, vamos subdividir a aba system nos seguintes temas:
System Settings;
Debug Settings;
Cache Settings; e
Session Settings.
System Settings (Configuraes do sistema)

119/683

figura: global configuration configuraes do sistema

120/683

Vamos aos parmetros de configuraes do


sistema:
Path to Log Folder caminho do diretrio de
log do site. Perceba na imagem que existe
referncia ao disco C da minha mquina,
isto porque o Joomla! est instalado no Windows. Uma vez transferido para o servidor,
este caminho deve ser mudado, pois
c:\wamp\www\joomla\log, s existe na
minha mquina.
A no observncia deste preceito, impedir a
instalao de qualquer extenso no site, aps
sua publicao na Internet; e
Help Server servidor de ajuda do Joomla!.
At a data de lanamento deste livro, o servidor de ajuda no estava atualizado com informaes da nova verso do CMS.
Debug Settings (Configuraes de Debug)
Debugar um site, nada mais do que visualizar todo o processo executado pelo CMS
em busca de algum erro que possa ser o

121/683

causador de problemas pontuais de performance, segurana e/ou renderizao.


So apenas duas as opes existentes:
Debug System debugar o sistema; e
Debug Language debugar o idioma.
Caso opte, por debugar o site, todas as requisies executadas pelo CMS sero demonstradas no final da pgina web.
Cache Settings (Configuraes de Cache)
As configuraes de cache esto divididas
em:
Cache habilitar ou no o cache, cache conservador ou cache progressivo;
Cache Handler opo nica, arquivo; e
Cache Time tempo do cache em minutos.
Session Settings (Configuraes de Sesso)
As configuraes de sesso esto divididas
em:

122/683

Session Lifetime tempo para expirar a sesso do usurio logado; e


Session Handler no utilizar ou utilizar o
banco de dados.
Server
Fim melhorar o entendimento, vamos subdividir a aba server nos seguintes temas:
Server Settings;
Location Settings;
FTP Settings;
Database Settings; e
Mail Settings.
Server Settings (Configuraes do Servidor)

123/683

figura: Configuraes do servidor

As configuraes do servidor so relacionadas a:


Path to Temp Folder caminho do diretrio
de tmp do site. Perceba na imagem que existe referncia ao disco C da minha mquina, isto porque o Joomla! est instalado
no Windows. Uma vez transferido para o servidor, este caminho deve ser mudado, pois
c:\wamp\www\joomla\tmp, s existe na
minha mquina. A no observncia deste

124/683

preceito, impedir a instalao de qualquer


extenso no site, aps sua publicao na Internet, tendo em vista que os pacotes ficam
armazenados neste diretrio durante o processo de instalao;
Gzip Page Compression seu site grande?
A compresso uma maneira simples e
eficaz de economizar banda e acelerar o carregamento do mesmo;
Error Reporting por questes de segurana,sugiro no exibir relatrio de erro.
Escolha a opo none;
Force SSL se o servidor oferece SSL (Secure Socket Layer) no seu plano de hospedagem, uma boa ideia utilizar no acesso ao
back end do site. No sabe o que isso? Sabe
aquele cadeado que aparece na sua mquina
quando entra em um site seguro? Ento,
graas ao SSL.
Porm, observe se no h problema em relao ao certificado, muito ruim acessar um

125/683

site e deparar-se com a imagem abaixo.


erro de certificado

figura:

Server Time Zone configurao da localizao do seu site muito importante, para
evitar que os artigos postados fiquem com o
horrio diferente da realidade. No meu caso
optei por So Paulo, vide a imagem. Escolha
a cidade desejada e selecione.
FTP Settings (Configuraes de FTP)

126/683

figura: Configuraes de ftp

FTP ( File Transfer Protocol) - o protocolo


utilizado no envio de arquivos de sua mquina local, para a mquina do provedor
contratado. Por email, voc receber os
seguintes dados:
Host de FTP algo parecido com
ftp.seusite.com.br
Usurio de FTP em geral idntico ao
domnio, sem a extenso. Ex: seusite
Senha de FTP uma senha padro ser

127/683

atribuda e voc deve troc-la no painel de


controle do provedor
Porta normalmente ser a 21
Caminho inicial via de regra ser a barra
(/)
Alguns provedores apresentam problemas
relacionados a permisso de grupos e usurios, em sua configurao. O resultado pode
ser explicado na seguinte situao hipottica:
Aps publicar o site no servidor remoto, voc efetua a instalao de um template.
Porm, voc no gosta da imagem no topo do
template e resolve edit-la em seu mquina.
Voc edita a imagem e ao tentar reenvi-la
para o diretrio templates/nomedotemplate/
images recebe uma mensagem de erro do
programa de FTP (filezilla, fireftp, cuteftp e
etc...), relacionada a no ter permisso para
a operao.
Alguns provedores possuem um boto de
restaurar permisses, em outros isso no

128/683

acontece. Porm, existem provedores em que


voc ser obrigado(a) a abrir um ticket no
help desk para resolver esta pendenga. Culpa
do Joomla? No, culpa do provedor que voc
escolheu.
A melhor forma de resolver a questo e no
ficar na pendncia da configurao de seu
servidor, utilizar a camada de FTP aps
publicar o site, habilitando-a e preenchendo
os parmetros de configuraes (vide imagem), com os dados recebidos por email.
Aps ativar a camada de FTP, todas as operaes sero executadas pelo usurio de FTP
do seu domnio.
Database Settings (Configuraes de Banco
de Dados)

129/683

figura: Configuraes de banco de dados

As configuraes de banco de dados so as


mais importantes do site e o motivo
simples, o banco o crebro do seu site. Sem
banco de dados no existe site, simples
assim.
Os valores apresentados so aqueles que voc preencheu ao instalar o Joomla!, exceto a
senha de acesso ao banco, que por motivo de
segurana no pode ficar exposta.
Os parmetros podem ser alterados? Sim, se
voc subiu um clone de todas as tabelas

130/683

para outro banco, altere os parmetros para


acess-lo e vai funcionar. Caso contrrio, voc cometer um joomlacdio.
Uso uma tcnica interessante quando desenvolvo projetos para clientes que no residem
em Braslia e com certeza poder ser-lhe til.
Enquanto existir alguma pendncia contratual em termos de pagamento, os parmetros do banco de dados apontam para um
banco de dados no meu servidor de desenvolvimento. Quando tudo estiver ok, subo as
tabelas para o servidor de banco de dados do
cliente e altero os parmetros de conexo.
Resumindo, o site do cliente fica no servidor
de hospedagem que ele contratou, mas o
banco de dados permanece no meu servidor
at que tudo esteja quitado. Batizei esta tcnica, de site zumbi.
Mail Settings (Configuraes de Email)

131/683

figura: Configuraes de email

As configuraes de email so de vital importncia para a comunicao de seu site


com os internautas. Fale conosco, enviar
artigo para um amigo, email em massa e
ativao de cadastro de usurio, por

132/683

exemplo, dependem da perfeita configurao


desses parmetros.
No ato da contratao do servidor de hospedagem voc receber informaes relativas
ao servio de email de seu provedor. Por exemplo, a utilizao do protocolo SMTP, a
porta do servio e etc...
Vamos abord-los de forma analtica:
Mailer qual o tipo de servio ser utilizado
no envio de email?
PHP mail Funo mail do PHP, normalmente utilizada;
Sendmail Agente de transferncia de correio eletrnico, suporta SMTP;
SMTP Protocolo para envio de emails.
From email o email cadastrado na instalao do Joomla!
From Name o nome do remetente do
email.
Send Email Path caminho do sendmail no
servidor de hospedagem
SMTP Authentication autenticao do

133/683

email via SMTP. Caso habilite esta diretiva,


obedecendo informaes do servidor em relao a necessidade da utilizao do protocolo SMTP, voc dever observar as configuraes dos parmetros abaixo:
SMTP Security uso de SSL ou TSL
SMTP Port a porta do servio
SMTP Username aqui uma dica de ouro,
observe na imagem o email cadastrado no
campo From Email. Este o username de
SMTP, porm voc deve trocar o @ por =
Ex:contato=juliocoutinho.com.br
SMTP Password a senha de acesso utilizada para acessar o email
SMTP Host o caminho do servio. Normalmente
smtp.seudominio.extenso.
Ex:
smtp.seudominio.com.br
Permissions Settings (Configuraes das
Permisses)

134/683

figura: Configuraes das permisses

Nesta aba configuramos de forma global, as


permisses dos grupos de usurios do site.
Perceba na imagem o grupo Blog, que foi criado para explorarmos a ACL do Joomla!
Apesar do Blog herdar do grupo Manager, a
permisso de acesso ao back end do site,
nesta aba, foi-lhe negado o privilgio de
acesso.
Text Filters Settings (Configuraes dos filtros de texto)

135/683

figura: Configuraes dos Filtros de textos

Essas configuraes sero aplicadas a todos


os campos do editor de texto submetidos
pelos usurios dos grupos selecionados. Estas opes de filtragem permitem maior controle sobre o envio de tags HTML para o
provedor. Voc pode ser rigoroso (Default
black list) ou liberal (No filtering), de acordo
com os requisitos do seu site. As configuraes usadas por padro, fornecem uma boa
proteo contra ataques que usam tags html.

136/683

Perceba na imagem acima que o grupo Blog


est associado ao tipo de filtro Default Black
List, altere para No Filtering pois este
grupo ir postar artigos com vdeos. Este
tipo de filtragem impede por exemplo, a insero de vdeos do youtube dentro de um
artigo, a utilizao de formulrios legados
em mdulos Html Personalizados e etc...
muito importante configurar corretamente
o tipo de filtragem de cada grupo criado no
seu site, para que no haja problemas no
design de contedo. Entretanto, observe
sempre as melhores prticas de segurana,
ao liberar um grupo da filtragem de texto.
Nesa aba configuramos de forma global, as
permisses dos grupos de usurios do site.
Perceba na imagem o grupo Blog, que foi criado para explorarmos a ACL do Joomla!
Apesar do Blog herdar do grupo Manager, a
permisso de acesso ao back end do site,

137/683

nesta aba, foi-lhe negado o privilgio de


acesso.

Captulo 7 - SEO x Joomla!


Existem muitos spiders de busca, porm
nosso foco ser o caffeine, ndice de busca da
google.
Estar presente na Internet uma coisa; ser
encontrado algo completamente diferente.
H milhes de sites que no aparecem em
quaisquer resultados de pesquisas. Enquanto
outros aparecem no topo da busca orgnica
da google e possuem excelente page rank.
Qual a diferena?
No primeiro caso, os sites foram criados e
colocados on-line, s isso. Eles podem ter
contedo vasto e interessante, mas ningum
sabe. Adicione uma boa dose de action
script, ou simplesmente, flash e teremos, segundo Conrado Adolpho, um lindo Outdoor
no meio do Saara.

139/683

No segundo caso, foi feito um esforo em relao ao Search Engine Optimization, ou


SEO, dos websites. Usando uma combinao
de tcnicas, estes websites foram capazes de
aumentar a sua visibilidade por serem, por
assim dizer, simpticos ao motor de busca
(SEF).
Este captulo discute os passos que voc
pode tomar para tornar seu website desenvolvido em Joomla! amigvel para os
motores de busca, aumentando a probabilidade de ser visto nos resultados da pesquisa.
SEF significa simplesmente, que voc pode
usar referncias de URL que so mais curtas
e mais significativas ao fazer referncia a pginas de um website. Em vez de longas seqncias de cdigo URL, especialmente
aqueles gerados por banco de dados de CMS
e o Joomla no foge a regra. As URLs devem
ser concisas com o nome da pgina real

140/683

exibida. Joomla! tem a caracterstica de gerenciar facilmente URLS amigveis.


H duas configuraes relevantes para SEF
no painel de configuraes de SEO: URL
amigvel e Adicionar Sufixo de URL. Para
usar mod_rewrite do Apache, devemos
renomear o arquivo htaccess.txt que est na
raiz do website, para .htaccess. Existe outro
parmetro presente em alguns itens de contedo, chamado alias (apelido).
Vamos a explicao de cada parmetro relevante:
URL Amigveli Marque (Sim), para que
seja gerada URL amigvel facilitando a indexao de seu website pelos buscadores; e
Adicionar Sufixo de URL - Isto ir adicionar
o sufixo .html URL amigvel gerada,
aumentando sua compreenso por parte do
internauta e melhorando a indexao pelos
buscadores.
Confuso sobre SEF e SEO?

141/683

Para manter a terminologia em perspectiva,


tudo o que feito para aumentar a capacidade de um website ser encontrado pelo motor de busca chamado de SEO.
SEF apenas uma pequena parte de SEO e,
embora no Joomla! seja uma funo separada, funciona harmonicamente com as tcnicas de SEO para fazer um website otimizado para mecanismos de busca. A URL
amigvel, aliada ao uso correto de meta-tags
e uma boa poltica de Google Marketing,
aumenta a capacidade do website ser encontrado pelos motores de busca.
URL Amigvel
Sistemas Gerenciadores de Contedo geram
por padro, URL dinmica, dificultando a indexao dos robs de busca. Um exemplo de
URL
dinmica
seria:
http://www.meusite.com.br/index.php?option=com_content&id=20
Este mesmo exemplo poderia ser visualizado

142/683

da seguinte forma se estivssemos usando


URL amigvel: http://www.meusite.com.br/
blog/domineojoomla.html
Desta forma teramos uma melhor indexao
por buscadores, alm de aumentar significativamente, a segurana de nosso website.
Mas o que URL amigvel tm haver com
segurana?
Muitos ataques websites so realizados por
softwares que procuram determinado fragmento na URL. No Joomla, caso encontre, o
software consulta o seu banco de dados interno e busca relacionar o fragmento da URL
com as extenses vulnerveis.
Analise a URL dinmica abaixo:
http://www.meusite.com.br/index.php?option=com_expose
Agora, entenda a rotina de ataque:
O software identifica que o site utiliza
o componente com_expose;

143/683

consulta a lista de extenses


vulnerveis;
encontra o com_expose (componente
de galeria de imagens); e
explora a vulnerabilidade invadindo
o seu site.
O uso de URL amigvel, impede a ao desse
tipo de software malicioso.
O que SEO?
SEO um mtodo de melhorar a visibilidade
de websites nos motores de busca. Motores
de busca so servios como a google, yahoo e
outros que exibiro links para websites como
resultado de uma solicitao de consulta ou
pesquisa.
O mtodo pelo qual os motores de busca recolhem informaes do website um conjunto de algortimos e parmetros mantido
em segredo e guardado a sete chaves. No entanto, existem algumas tcnicas que podem
ser adicionadas a um website tornando-o

144/683

amigvel aos motores de busca, que puxam


as informaes do website de uma maneira
organizada. Em outras palavras, eles iro "olhar para as coisas" no website que atendam a
seus critrios busca.
Joomla!, por si s, no otimizado para
motores de busca. Ele possui, no entanto,
meios e mecanismos, como parte da plataforma, que permitem aos desenvolvedores
sites otimizados para as mquinas de busca.
As funcionalidades que vm embarcadas
no Joomla!, podem ser aplicadas para as
seguintes partes de um site:
O prprio site, atravs das Configuraes
Globais, relacionadas a SEF / SEO que sero
aplicadas ao site como um todo.
Componentes podem ser includos, embora
no necessariamente todos eles.
tens de menu, que so responsveis pelos
hiperlinks, podem incluir informaes de
SEO.
Categorias podem incluir informaes de

145/683

SEO.
Os artigos podem incluir informaes de
SEO.
Mdulos geralmente no tm opes de SEO,
mas alguns podem ter o recurso.
Os templates, no tm opes de SEO.
Dependendo do desenvolvedor, as extenses
podem ter opes de SEO includas em seus
parmetros.
Melhores prticas SEO
A melhor prtica construir um site que
tenha muito contedo e que as palavraschave estejam de acordo com o que o
pblico-alvo do seu site ir usar como termo
de pesquisa na google.
A maioria dos itens de contedo tm opes
de metadados que podem ser configuradas
para fornecer informaes sobre contedo
para os motores de busca. Artigos, links de
itens do menu, alguns mdulos (dependendo
do que eles fazem), e alguns componentes

146/683

tm informaes de metadados que podem


ser includas na pgina de contedo, que no
visto pelos visitantes do site. Motores de
busca sabem exatamente onde procurar para
obter essa informao, e o Joomla! fornece o
caminho para esse tipo de pesquisa.
A figura abaixo mostra as informaes de
metadados tpicas para um artigo. Observe a
declarao de forma concisa, a descrio
meta e como as meta palavras-chave so inseridas, dentro do escopo do artigo. No use
vrgulas nas palavras-chave, digite at 06
(seis) frases curtas e diretas sobre o contedo, tendo em mente o qu o usurio ir
digitar no momento da pesquisa. Esta a informao que os motores de busca esto procurando quando rastream um site.

147/683

figura: figura: Configuraes de SEO

Robs Opes
Index, Follow - Esta a configurao padro,
embora possa parecer o contrrio. O Spider
ir indexar o site inteiro e todas as outras pginas que tm links em menus ou em contedo.
Index, Follow - Neste caso, o site no ser indexado, mas a pginas de contedo sim.
Index, No Follow - Permite que o Spider leia
a pgina inicial do site, mas no v alm do

148/683

ndice do site. Ele no tentar acessar


qualquer outra pgina de metadados.
No Index, No Follow - Este bvio. Ele no
permite a indexao de qualquer coisa.
Mapa do site (sitemap)
Um mapa do site uma pgina que tem links
para todas as outras pginas no site. Pode ser
gerado automaticamente pelo CMS Joomla!,
ou criado manualmente pelo desenvolvedor
e disponibilzado com o nome de sitemap, na
raiz do site. O mapa do site ajuda a catalogar
o contedo do seu site nos motores de busca.
Ao criar um mapa do site, informamos aos
motores de busca, quais urls do site esto
disponveis para pesquisa.
Existem vrios sites que oferecem a criao
gratuita de mapas de site, eu indico o
Sitemaps.com
http://www.xmlsitemaps.com/ e oriento voc a criar mapas
de site com extenso .xml.
Se voc preferir instalar uma extenso de

149/683

terceiros para este fim, acesse o JED http://extensions.joomla.org e busque por


sitemap.
A importncia da tag h1
Motores de busca esto obcecados em procurar a tag h1 em pginas da web. Isto ,
alm das meta-informaes que, em conjunto, determinam a relevncia de suas pginas. O cabealho primrio para todos os artigos de contedo e assim por diante podem
ser estilizados com css, mas a especificao
HTML mais importante para os navegadores
tag h1.
Abaixo temos algumas dicas sobre o uso da
tag h1:
A tag h1 deve ser usada uma nica vez para
cada item de contedo.
O texto com a tag h1 deve ser curto e ocupar
apenas uma linha.
Use a tag h1 de forma responsvel e evite o
uso excessivo da tag. Usar vrias tags h1 na

150/683

mesma pgina no uma boa prtica e os


motores de busca podero rejeitar seu site,
ou no caso da google, aplicar punies ao seu
domnio.
Se voc quiser duplicar a tag h1, comeando
o artigo com a mesma, deve torn-la diferente do ttulo. Seja criativo e comee com palavras que estejam diretamente ligadas a
forma com que os internautas pesquisam.
H um enorme furor entre os desenvolvedores de sites em discutir se a tag h1 tem valor de destaque para SEO. Todo mundo tem
direito a opinar sobre o assunto e eu
convido-o a se perguntar: Por qu o G1 usa
tag h1 no incio de seus artigos em destaque.
A Realidade do SEO e Servios SEO
Vamos encarar uma realidade aqui. S
porque voc tem um site otimizado e que
segue todas as regras de SEO, nada garante
que ele ir aparecer dentre os 50 primeiros
resultados, quando da realizao de uma

151/683

pesquisa na google ou outro buscador. Seu


site teria que ser incrivelmente original, com
palavras-chave usadas em qualquer lugar
nunca antes por qualquer outro site, para
aparecer no topo. preciso muito trabalho e
esforo para conseguir um ranking de pgina
elevado, alm do tempo de vida do site ser
um fator importantssimo.
Google Adwords
Adwords um servio da google e funciona,
a grosso modo, como um grande leilo de
palavras-chaves. Existem excelentes livros
sobre o assunto e sugiro que voc faa a
leitura de um deles. Para acessar o Adwords
e comear sua campanha, siga o caminha
abaixo: http://adwords.google.com.br
Usando o Adwords voc pode melhorar o
resultado de seu site nas pesquisas e os anncios ficam destacados com uma cor diferenciada. Porm, acredite, o usurio sabe que
voc pagou e por isso, ele no acredita muito

152/683

em anncios pagos.
Os resultados obtidos sem a utilizao do adwords so conhecidos por resultados de
busca orgnicos e possuem maior credibilidade por parte dos internautas.
Sempre que possvel, busque um bom page
rank, no resultado orgnico.
Google Analytics
Google Analytics um servio gratuito e
oferecido pela Google no qual, ao ativar-se o
servio por intermdio de uma conta do
gloogle (Gmail por exemplo) e ao cadastrarse um site recebe-se um cdigo para ser inserido na pgina cadastrada e, a cada exibio, estatsticas visitao so enviadas ao
sistema e apresentadas ao dono do site.
Foi criado principalmente como um auxilio
aos webmasters para otimizar seus sites para
campanhas de marketing e para a google Adsense.
O
endereo
oficial
do
servio

153/683

http://www.google.com/analytics/ e caso
no possua uma conta ainda, trate de cri-la.
Durante o desenvolvimento do projeto, voltaremos a falar de Google Analytics.
Google Webmasters
Outro servio essencial para uma boa campanha de webmarketing, a google Webmasters, servio voltado aos desenvolvedores
Web, com vrias ferramentas relevantes para
que o seu site esteja compatvel com a
Google.
O
endereo
do
servio

http://www.google.com.br/webmasters/,
basta possuir uma conta do Gmail, ou outro
servio da Google para iniciar a utilizao.
Tcnicas Black Hat
No jargo SEO, black hat so atitudes ilcitas
utilizadas, na tentativa de ludibriar o buscador. Existem vrias tcnicas que se

154/683

enquadram no conceito de Black Hat, por


ferirem as diretrizes para webmasters, da
google.
Acesse http://support.google.com/webmasters/ e saiba o que pode e o que no pode ser
feito.

Captulo 8 - Lista de Controle de


Acesso (ACL)
ACL determina Quem Pode Fazer O qu,
Aonde.
Quando ministrei o curso de Joomla para a
Presidncia da Repblica, fui questionado
sobre a rastreabilidade e confiabilidade que o
CMS proporcionava em relao a identidade
e autoridade sobre os artigos publicados, estvamos na verso 1.5 do Joomla e confesso
que pela primeira vez, percebi que o Joomla
tinha problemas srios. A falta de uma ACL
forte era o seu Calcanhar de Aquiles.
Access Control List ou Lista de controle de
acesso
Tambm conhecida pelo acrnimo ACL
definida pela rea de cincia da computao
como uma lista que define quem tem

156/683

permisso de acesso a certos servios.


Um dos grandes destaques do Joomla 1.7 foi
a capacidade de gerenciar usurios e controlar o acesso ao website como um todo, ou a
partes dele. Agora possvel configurar as
definies de acesso e ao para itens de contedo de forma individual.
A verso 3.0 do Joomla! apresenta refinamentos interessantes em relao poltica de
ACL. Um fato importante a ser observado:
as permisses so para o grupo, nunca para
o usurio.
figura: ACL Joomla!

Criar uma regra de ACL parece confusa no


incio, especialmente se o website pequeno.
Porm, fundamental para grandes portais,
com diversos conteudistas.

157/683

Compreender a ACL do Joomla! 2.5 muito


importante para o projeto proposto no livro e
para o seu futuro projeto pessoal, ou comercial. Quanto maior o projeto, mais complexa
ser a regra de ACL, contendo vrios grupos
de usurios e nveis de acesso.
Com uma boa regra de ACL, criamos grupos
e atribuimos usurios. Graas ao JSON, funo do PHP utilizada no princpio da ACL do
Joomla 2.5, os usurios podem pertencer a
diversos grupos. O controle dos nveis e permisses de acesso, so efetuados de forma
hierrquica para cada grupo e seus
subgrupos.
Um bom exemplo de utilizao da poderosa
ACL do Joomla! 2.5 seria um website de jornal, com muitos contribuintes de contedo e
editores. Com uma regra de ACL, o departamento de esportes, por exemplo, s seria
capaz de acessar, adicionar e editar o contedo pertecente a sua categoria. Outros departamentos seriam igualmente limitados,

158/683

adicionando, editando ou excluindo contedos, apenas em reas especficas.


O departamento de esportes pode ser um
grupo e o departamento de futebol, um subgrupo do grupo esportes. Desta forma
poderemos delegar funes a cada usurio
dos grupos, de acordo com o necessrio. Temos um nome bem interessante para esta
ao, estamos enjaulando os usurios.
Criando uma regra de ACL
ACL faz vrias coisas de forma coletiva e individual, dependendo de como ela aplicada
em um website. Ou seja, depende de um bom
planejamento para uma boa regra de ACL.
Os dois principais elementos da ACL so:
Permisses de ao Define o que os grupos
e seus usurios podem fazer no site; e
Nveis de acesso Controla o que os usurios podem ver, tanto no fron-end quanto no
back-end.
Em uma instalao sem exemplos de

159/683

contedo, apenas os grupos padres so criados e vamos estud-los rapidamente. Observe a imagem abaixo.
figura: Grupos padro do Joomla!

Com acesso ao front-end em ordem crescente de hierarquia temos os seguintes


grupos:
Public o grupo de acesso pblico, ou seja,
o internauta que visita e navega pelo website.
No possui qualquer permisso de ao em
relao ao contedo do mesmo;

160/683

Guest o grupo visitante novidade do


Joomla!;
Registered usurios pertencentes a este
grupo, podem acessar contedo restrito e enviar weblinks para o website;
Author usurios pertencentes a este grupo,
podem acessar contedo restrito, enviar
weblinks e enviar artigos ao website;
Editor usurios pertencentes a este grupo,
podem acessar contedo restrito, enviar
weblinks, enviar artigos ao website e editar
artigos enviados por ele mesmo e por
autores;
Publisher usurios pertencentes a este
grupo, podem acessar contedo restrito, enviar weblinks, enviar, editar e publicar artigos no website, inclusive na pgina inicial
(destaque). So os super usurios do frontend, no tem acesso ao back-end.
Com acesso ao back-end em ordem crescente
de hierarquia temos os seguintes grupos:

161/683

Manager grupo dos gerentes de contedo,


pode criar, editar, publicar e apagar menus,
itens de menus, categoria, subcategorias e
artigos. Enfim, pode fazer tudo relacionado
ao Gerenciamento de Contedo do website.
No tem acesso as extenses e parmetros de
configuraes do website.
Administrator grupo dos administradores,
possue as mesmas permisses do Manager,
alm de interagir com as extenses e opes
de manuteno do website.
SuperUsers grupo dos super administradores, faz tudo no website, podendo at
mesmo cometer o Joomlacdio.
O que significa cada ao na ACL?
Observe a figura abaixo e vamos estudar as
aes que fazem parte da ACL:

162/683

figura: ACL Criando um novo grupo

Acesso do Site Usurios pertencentes ao


grupo, podem efetuar login no front-end do
site.
Acesso da Admin Usurios pertencentes ao
grupo, podem efetuar login no back- end do
site.
Acesso Offline Usurios pertencentes ao
grupo, podem efetuar login e acessar o site,
estando o mesmo est em manuteno.
Super Admin Usurios pertencentes ao
grupo, tm perfil de Super Usurios e executam qualquer ao no site.

163/683

Componente de Acesso Usurios pertencentes ao grupo, podem efetuar login no


back-end do site e fazer alteraes nos componentes do mesmo, sem contudo, acessar as
configuraes globais.
Criar Usurios pertencentes ao grupo, podem criar contedo, aps efetuar login no
site.
Editar Usurios pertencentes ao grupo, podem editar contedo, aps efetuar login no
site.
Editar Estado Usurios pertencentes ao
grupo, podem editar o estado (publicado,
despublicado, destaque e etc...) do contedo,
aps efetuar login no site.
Editar Prprio Usurios pertencentes ao
grupo, podem editar contedo prprio, aps
efetuar login no site.
O que so nveis de acesso na ACL?
A ACL possui quatro nveis de acesso controlado e aes que comeam e terminam

164/683

globalmente, no nvel de item individual,


com permisses respectivas. Para ajudar a
visualizar os nveis de acesso, observe a
figura abaixo.
figura: nveis de acesso

Nvel 1 - Define a configurao global, tais


como login do site, login admin, componente
de acesso, criar, apagar, editar e super
usurio.
Nvel 2 - Define permisses para componentes, tais como o componente de acesso,
configurar, criar, Apagar, Editar, Editar
Estado (publicar, unplish, e assim por diante), e editar prpria.
Nvel 3 - Categoria de nvel de permisses,

165/683

como criar, Apagar, Editar, Estado Edit


(publicar, unplish, e assim por diante), e editar prpria.
Nvel 4 - Item de nvel de permisses so
Apagar, Editar, Editar Estado (publicar, unplish, e assim por diante), e editar prpria.
De forma resumida, o nvel de acesso serve
para segmentarmos a informao dentro do
prprio grupo, ou seja, podemos ter usurios
pertencentes a vrios grupos dentro de um
grupo pai e com nveis de acesso diferenciados, dentro dos mesmos.
Por exemplo, em um escritrio, o gerente e a
secretria esto na mesma sala. Porm, no
possuem a mesma permisso de acesso e
autoridade.
Na figura abaixo ilustramos um exemplo
mais complexo.

166/683

figura: Infogrfico nveis de acesso

Entenda os relacionamentos na ACL


Do ponto de vista da hierarquia, agora falou
minha lngua, o Joomla! um sistema que
se baseia em um relacionamento do tipo pai filho.
Nas categorias, o pai o mais alto nvel hierrquico. O filho a subcategoria que pertence a categoria pai. Se houver um subcategoria na categoria filho, esta ser a categoria neto e assim sucessivamente. As seguintes
regras de relacionamento aplicam-se a ACL:
Configuraes Globais - so herdadas por todos os itens pertencentes ao nvel superior.

167/683

Pai - Pai um item de nvel superior, um


item que est "acima" de outro, ou outro
item contido em ("abaixo") dele.
Filho - Um filho qualquer tem que pertena a um tem pai, tal como uma subcategoria, que filho de uma categoria e assim
por diante.
Hierarquia de Configurao As configuraes dos tens pais tm precedncia sobre
as configuraes do tens filhos.
Conflito de Permisses Tudo o que negado ou no permitido ao tem pai no pode
ser permitido nas configuraes de permisses do tem filho. As configuraes do tem
filho no podem substituir as do tem pai.
Herana Os tens filhos herdam as configuraes dos tens pais.
Em caso de conflito, sempre prevalecer a configurao de permisso mais
baixa, ou seja, com menos privilgio
de acesso.

168/683

figura: nveis de acesso Joomla

Observaes sobre a ACL


Qualquer alterao no parmetro de configurao, ser aplicada a todos os grupos filhos, componentes e contedo. Note que:
Herdado - significa que as permisses do
grupo pai sero usadas;
Negado - significa que no importa as configuraes do grupo pai, o grupo sendo editado
no pode fazer esta ao;
Permitido - significa que o grupo sendo editado poder fazer esta ao (mas se entrar em
conflito com o grupo pai, isto no ter impacto; um conflito ser indicado por No

169/683

Permitido (Bloqueado) nas configuraes


calculadas); e
No Definido - somente usado para grupos
pblicos nas configuraes globais. O grupo
Pblico pai de todos os outros grupos. Se
uma permisso no definida, ela tratada
como negada. Mas, pode ser alterada por
grupos filhos, componentes, categorias e
itens.
Selecionando uma nova configurao, clique
em Salvar para atualizar as configuraes
calculadas.Os seguintes grupos de usurios
possuem acesso nativo ao back- end:
Manager (Gerente)
Administrator (Administrador)
Super Users (Super Usurios)
Acesse a rea administrativa de seu site.
Caso esteja seguindo o caminho de nosso
projeto, ela estar disponvel em http://localhost/joomla/administrator

170/683

figura: tela de login do back- end

Digite o nome de usurio e a senha criados


durante o processo de instalao.
Partindo do princpio que voc no alterou o
template administrativo padro, vamos explorar analiticamente este novo tema para o
back- end do Joomla, o template Isis.

Captulo 9 Usurios, Grupos e


Nveis, E-mail em massa
A ACL foi tema de captulo anterior neste livro e sugiro sua releitura, caso tenhas dvidas
no entendimento das aes relacionadas aos
usurios no Joomla!.
Para acessarmos as aes de usurios podemos usar o cone Users Manager do painel
Quick Icons, ou atravs do menu superior
Users.
O cadastro de usurios realizado atravs do
componente com_users e possui um plugin
interessante: Perfil de Usurios. Tanto o
componente quanto o plugin, sero demonstrados em detalhes no captulo 20.
O primeiro passo configurar globalmente o
componente em relao aos usurios e para
tal devemos clicar no boto Options.

172/683

figura: Parmetros de configurao

As abas referem-se a parmetros do componente, de email em massa e permisses.


Aba Componente

173/683

Nesta aba configuramos os parmetros do


componente de usrios. As opes so as
seguintes:
Permitir Cadastro de Usurios define se
haver ou no, cadastro de usurios no site.
A inibio do cadastro ser efetivada no
front-end, atravs do mdulo de login, que
deixar de exibir o link criar uma conta. O
cadastro continua funcionando normalmente
no back-end;
Grupo de Cadastro de Novo Usurio grupo
ao qual pertence o novo usurio cadastrado.
Por padro ser o Registered, grupo com
menor poder de ao sobre o site;
Comentrios do Grupo de Usurios o
grupo padro ao qual o usurio no logado
(visitante), estar relacionado;
Enviar Senha por padro, o valor Sim e a
senha inicial, ser enviada ao usurio por
email, aps o cadastro no site;
Ativao de Cadastro de Novo Usurio a
ativao da conta do usurio pode ser

174/683

efetivada da seguinte forma:


Nenhum aps o cadastro o usurio pode
efetuar login no site;
Usurio aps o cadastro o usurio recebe
um email com link para ativao de sua conta. o padro; e
Administrador aps o cadastro o administrador do site, libera o acesso do usurio via
painel de controle do Joomla!
Notificar Administradores - informar ou no,
o cadastro de um novo usurio no site;
Captcha - plugin captcha que ser usado no
formulrio de cadastro, senha e lembrete de
nome de usurio. Pode ser necessrio fornecer informaes ao plugin de captcha, no
gerenciador de plugin.
Se Usar Padro estiver selecionado, tenha
certeza que o plugin captcha esteja selecionado na Configurao Global;
Parmetros do Usurio - se configurado para
exibir, os usurios podero selecionar o
idioma, editor e site de ajuda deles, atravs

175/683

da pgina de configuraes quando fizerem o


login no site;
Idiomas do Site se configurado para exibir,
os usurios podero escolher o idioma durante o registro. Este recurso importante
principalmente para sites multi-idiomas;
Nome de Login Modificado permitir ao
usurio mudar seu nome de login
(username), quando da edio do perfil;
Redefinir Contagem Mxima - nmero mximo de alterao da senha de acesso, em determinado perodo. O nr 0 significa que no
existe limite; e
Tempo em Horas o perodo de tempo, em
horas, para o contador de reinicializao.
Aba E-mail em massa
As configuraes do email em massa so
simples, relacionando-se apenas :
Prefixo do Assunto ser adicionado antes
do assunto de cada email; e

176/683

Sufixo da Mensagem ser adicionado depois da mensagem do email.


Aba Permisses
Configurao de permisses dos grupos em
relao ao componente.
User Manager
O tem de menu Gerenciamento de Usurio
abre a lista com todos os usurios cadastrados no site, permitindo ao Super Administrador, editar qualquer informao dos mesmos. Na imagem abaixo, perceba que temos
apenas um usurio que foi cadastrado durante a instalao do Joomla!
Observe que o ID padro do Super User no
42. Desde Joomla! 2.5.6 o ID padro do super usurio gerado randomicamente,
aumentando sensivelmente a segurana contra ataques SqlInjection.

177/683

figura: Gerenciamento do usurio

Clique sobre o nome do Usurio para entrar


no painel de edio do usurio. As opes de
edio do usurio esto divididas em trs
abas:
Detalhes da conta;
Associar usurios a grupos; e
Configuraes bsicas.
Account Details (Detalhes da Conta)
Nesta aba, o Super Administrador do site,
ter acesso a informaes individuais do
usurio cadastrado e poder alter-las, se assim desejar.
O Super Administrador pode, por exemplo,
bloquear o acesso do usurio ao site se for o
caso.
Os campos coloridos em tom de cinza, no
so passveis de edio.

178/683

figura: Aes do usurio

So as seguintes as aes relacionadas aos


usurios:
User Manager (Gerenciamento de Usurio)
lista os usurios cadastrados no site;
Groups (Grupos) grupos existentes no site;
Access Levels (Nveis de Acesso) nveis de
acesso existentes no site;
User Notes (Notas de Usurios) notas particulares de cada usurio;
User Note Categories (Categorias de Notas
de Usurios) categorias das notas; e
Mass Mail Users (email em Massa) envio
de email em massa para os usurios do site.

179/683

Cadastro de Usurio
O cadastro de usurio pode ser efetuado via
back end, ou front-end, atravs do formulrio de cadastro associado ao mdulo
Login Form Create an account.
Vamos cadastrar 03 (trs) usurios para que
possamos fazer alguns exerccios em relao
poltica de ACL do nosso site. Os meus
usurios sero:
cout45,
user1; e
user2.

180/683

figura: Formulrio de cadastro via front-end

Preencha os dados e clique no boto Register. Dependendo de seu ambiente, uma


mensagem relacionada ao envio de email
ser apresentada. O motivo? Simples, voc
no tem servidor de email instalado. Em ambiente remoto, isto no acontecer.
Neste cadastro no estamos utilizando o plugin Perfil do Usurio para estender as
opes do formulrio.
User Manager (Gerenciamento de Usurio)

181/683

Acesse o menu superior tem de menu


Users para constatar o novo usurio cadastrado, ou a aba User Manager. O Super Administrador do site, poder acessar e editar
as informaes dos usurios cadastrados.
figura: Usurio cadastrado

182/683

figura: Editando os dados do Usurio cadastrado

183/683

Block this User - Lembre-se de desbloquear


o usurio.
Perceba que os campos em tom cinza, no
so passveis de mudana.
Outro detalhe muito importante que desde
a verso 2.5.6 do Joomla!, o ID do super administrador passou a ser gerado aleatoriamente, neutralizando ataques do tipo SqlInjection que buscavam o ID padro, 62.
Assigned User Groups (Associar Usurio
aos Grupos)
Nesta aba, o Super Administrador do site,
poder associar o usurio selecionado um
ou mais grupos do site.
importante levar em conta a necessidade
de um planejamento meticuloso em relao a
poltica de ACL do site, para que os grupos
criados, se for o caso, permitam o perfeito
enjaulamento dos usurios eles pertencentes.
Por padro, os usurios que fazem o cadastro

184/683

via formulrio no front-end do site, pertencem ao grupo Registered e podero to


somente, acessar contedo restrito e enviar
weblinks.
Vamos criar um novo grupo para melhor exemplificar o processo:
figura: Criando um novo grupo

O novo grupo ir herdar todas as permisses


do grupo pai e voc precisa ter muito cuidado para no escolher o pai errado. Analise a

185/683

situao hipottica abaixo:


Quero criar um novo grupo, que ter permisso para enviar, editar e publicar artigos. O
grupo com menor hierarquia, que tem permisso para essas aes, o Publisher. Logo,
o novo grupo tem que ser filho, no mnimo,
do Publisher.
Joomla! usa o conceito de herana, matria
estudada por todo webdesigner e que de
forma simples, significa que o novo grupo ir
herdar todas as permisses do grupo pai,
certo webdesigner?
Ento, vamos criar o novo grupo e vou
batiz-lo de Blog. Na lista de seleo Group
Parent, irei escolher o grupo Manager para
ser o pai do grupo Blog.

186/683

figura: Criando o grupo blog

187/683

figura: Grupo criado

A essa altura voc deve estar se perguntando:


Por qu o pai o Manager? No seria o Publisher? Manager complicado pois tem
acesso ao back end.
Exato, mas acontece que a ACL do Joomla!
hierrquica e suas permisses referem-se
justamente aos grupos. Ao grupo filho pode
ser negada, qualquer permisso que o grupo
pai possua. Ou seja, as permisses do grupo
so escalveis at o grupo pai para + e at o
grupo public para -.

188/683

Ficou confuso? Vou exemplificar: No caso do


grupo Blog, sendo filho do grupo Manager,
herdar suas configuraes e poder acessar
o back end do site. Entretanto, iremos negar
esse acesso na aba permisses, da Configurao Global do site.
figura: Negando acesso ao back end, ao grupo Blog

Aps a criao do grupo, partimos para a associao dos usurios ao grupo recm- criado e justamente neste ponto, que mora o
perigo.
Quando um usurio efetua o seu cadastro,
ser vinculado ao grupo Registered que no
tem permisso para enviar, editar e publicar
artigos. Logo, temos que tomar muito cuidado para no vincular o nosso usurio ao
grupo Blog, sem desvincul-lo do grupo Registered, sob pena de causar um conflito.
Quando um usurio est vinculado a mais de

189/683

um grupo, por segurana, o Joomla! obedecer o vnculo com o grupo de menor hierarquia.
O vnculo do usurio cadastrado ao grupo
Registered, um padro e pode ser alterado
no menu superior users barra de ferramentas Options.
Recomendo cautela na alterao deste parmetro. J pensou no que aconteceria se todos os usurios cadastrados no seu site, estivessem vinculados por padro, ao grupo Super User?
Agora vamos associar os usurios cadastrados a seus respectivos grupos, para tal, basta
clicar no nome do usurio, aba Assigned
User Groups, desmarcar o grupo Registered
e marcar o grupo que voc criou. No meu
caso, Blog.
Dentro da poltica de ACL quem montei para
o site do livro teremos at o momento a
seguinte associao:
cout45 Grupo Blog

190/683

user1 Grupo Blog


user2 Grupo Publisher
Access Level (Nvel de Acesso)
Nvel de acesso serve para identificar qual
grupo pode acessar determinada informao
em nosso site. fundamental para projetos
que necessitem de alta segmentao na visualizao do contedo (artigos, fotos, vdeos,
documentos para download e etc...), publicados.
Imagine a seguinte situao: no site tenho
grupos, os usurios cadastrados sero vinculados aos grupos existentes. Porm, dentro
dos grupos, necessito segmentar o nvel de
acesso dos usurios, ainda que pertenam ao
mesmo grupo. possvel? Sim, desde que eu
use o Nvel de Acesso, da ACL do Joomla!.
Por padro, o Joomla! possui os seguintes
nveis de acesso:
Public;

191/683

Guest,
Registered; e
Special.
Partindo do principio que voc criou o grupo
Blog, crie o grupo Destaques vinculado ao
grupo Blog. Ou seja, o grupo Destaques
filho do grupo Blog.
Agora, na aba Access Level, crie o nvel de
acesso colunistas, vinculado ao grupo
Destaques.
figura: Grupo e nvel criados

192/683

Desta forma conseguiremos segmentar as


permisses de acesso dentro dos grupos Blog
e Destaques. Usurios que estejam vinculados ao grupo Blog tero nvel de acesso diferente de usurios vinculados ao grupo
Destaque.
Finalizando a vinculao dos usurios criados aos respectivos grupos, de acordo com
nossa poltica de ACL teremos:
cout45 Grupos Blog & Destaques
user1 Grupo Blog
user2 Grupo Publisher
E-mail em Massa
Os usurios cadastrados possibilitam a criao de uma Mailing List que pode e deve
ser utilizada na poltica de marketing do site.
Aps preencher ttulo e assunto do email e
escolher o(s) grupo(s) interessados, basta clicar no boto Enviar E-mail.
A funo de E-Mail em Massa, no deve ser

193/683

confundida com News Letter, que serve para


criar informativos a partir de uma extenso
(componente), instalada no site.

Captulo 10
Contedo

Gerenciamento

de

Segundo Jakob Nielsen, design de contedo


uma das etapas do Webdesign, sendo
desenvolvida em conjunto, pelo Webdesigner
e Webwriter, responsvel pela insero,
edio e publicao de contedos no site.
Uma das frases clebres de Nielsen lembra
que: Na Web, o contedo Rei.
CMS, nada mais que um Sistema Gerenciador de Contedos. Mas o que significa
contedo nesse contexto? Artigos, imagens,
vdeos, arquivos anexos, formulrios, lbum
de fotos e etc...
O foco do gerenciamento de contedo est
relacionado forma com que o contedo estar disponibilizado no site dentro dos
padres mnimos exigidos relacionados ao
alinhamento, correo ortogrfica e fontes.

195/683

O texto deve ser curto, 02 (dois) pargrafos


no mximo e a opo de Leia Mais. Lembrese que o internauta no tem tempo e est em
busca de informao relevante. Aquele texto
enorme pode ser interessante somente para
voc, j pensou nisso?
O padro de alinhamento de um texto publicado na web ser sempre esquerda, por
mais que a princpio possa parecer feio, antiesttico ou venha a desagradar o chefe designer. Ns escrevemos da esquerda para a
direita e lemos da mesma forma. O exerccio
da leitura em um monitor bem diferente e
mais cansativo que a leitura em um
manuscrito ou documento impresso. O Guia
de Referncia do W3C nos d a exata percepo do alinhamento a ser utilizado em
textos publicados nos sites e pode ser acessado em: http://www.livrodejoomla.com.br/
insumos/?#a3

196/683

O hbito da leitura nunca esteve dentre os


preferidos de grande parte da nossa populao e com o advento da Internet e sua consequentemente difuso e popularizao
vemos agravado e latente este fato. Use a
pirmide invertida de Nielsen e produza textos atrativos ao internauta. O que pode ser
mais atrativo que um hiperlink? Sim, se o
seu texto possui um hiperlink, coloque-o no
incio, pois internauta no l, internauta olha
e sempre busca um texto azul sublinhado
que vai fazer com que o mouse se torne uma
mozinha. Ele sabe que deve clicar ali, ento,
evite o termo Clique aqui.
Diz o sbio: quem l, escreve e quem escreve,
fala. impressionante o nmero de sites
com erros de portugus e sem querer ser um
exemplo de escritor, pois muitas vezes escapa uma vrgula em lugar errado gerando
uma m concordncia verbal.
Alis, peo perdo por eventuais erros de

197/683

concordncia que possam ser verificados


neste livro.
Os erros aos quais me refiro, so erros gritantes, que demonstram a total falta de conhecimento de nossa lngua ptria com a utilizao errnea de consoantes, vogais e tempos de verbos. Muitos dizem que no tem
nada haver e que a Internet lanou um
dialeto prprio baseado na informalidade.
Cuidado, uma coisa ser informal, outra
coisa : nis vai, nis foi, nis fica.
Fontes - A escolha das fontes a serem utilizadas no site devem seguir uma regra nica:
simplicidade. Lembre-se do que disse
Nielsen: Na Web a simplicidade sempre
vence a complexidade.
O navegador o responsvel por renderizar
o seu website e utilizar as fontes existentes
na mquina do usurio. Escolher por exemplo uma fonte Calibri pode no ser uma boa

198/683

ideia e tornar a experincia do internauta desagradvel, tendo em vista que ao entrar no


seu site ele pode ser surpreendido pela apresentao do contedo em formato de
quadrados pequenos. Use de preferncia as
fontes no serifadas:verdana, arial e etc....
O CMS Joomla! assim como seus irmos
Drupal, Xoops e Plone tm no Design de
Contedo, sua razo de ser. O design de contedo est presente no prprio nome do aplicativo Sistema Gerenciador de Contedos.
No, eu no esqueci o Wordpress, apenas
busquei fazar referncia aos CMS voltados
para websites e portais. Wordppress
voltado para blog, assim como Moodle
voltado para e-learning.
Neste captulo iremos abordar os seguintes
tpicos do gerenciamento de contedos no
Joomla!:
gerenciamento de menus;

199/683

gerenciamento de categorias; e
gerenciamento de artigos.
Configuraes Globais (Contedo)
Antes de iniciarmos o gerenciamento propriamente dito, devemos configurar de forma
global, o funcionamento do Joomla! em relao aos contedos do site.
Vamos continuar explorando o menu superior, lembrando sempre que o acesso pode ser
feito tambm, pelos cones rpidos.
figura: menu superior Content

As opes existentes no tem de menu Content so:


Article Manager gerenciamento de artigos;

200/683

Category Manager gerenciamento de categorias;


Featured Articles artigos em destaque; e
Media Manager gerenciamento de mdias.
Clique no tem de menu Article Manager
para abrir a viso de gerenciamento de artigos e observe o boto Options na barra de
ferramentas, nele que iremos configurar
nosso site, de forma global, em relao ao
contedo. Lembre-se que as configuraes
globais afetam todo o site e precisam ser editadas apenas uma vez.
As configuraes globais de contedo esto
divididas nas abas abaixo:
figura: Abas da configurao global de contedo

Artigos as configuraes globais em relao aos artigos esto subdivididas em parmetros de artigos, autores e cones.

201/683

figura: configuraes de artigos

Choose a layout tambm chamado de override de template, voc pode escolher um layout especfico para apresentar os artigos de
seu site. O parmetro global e/ou individual. Ou seja, para cada artigo voc pode optar
por escolher um layout exclusivo;
Show Title parmetro que determina a
visualizao ou no, do ttulo do artigo;
Linked Titles este parmetro pemite que os

202/683

ttulos de artigos sejam hiperlinks para o


contedo dos mesmos;
Show Intro Text este parmetro mostra o
texto de introduo do artigo, se habilitado.
(Show);
Show Category este parmetro mostra a
categoria do artigo, se habilitado. (Show);
Link Category este parmetro mostra um
link para a categoria do artigo, se habilitado.
(Yes);
Show Parent se habilitado, este parmetro
ir mostrar a categoria pai do artigo;
Link parente se habilitado, este parmetro
ir mostrar o link para a categoria pai do
artigo.

203/683

figura: configuraes de autores

Show Author parmetro que determina a


visualizao ou no, do autor do artigo;
Link Author este parmetro pemite um
link para o autor do artigo;
Show Create Date este parmetro mostra a
data de criao do artigo;

204/683

Show Modify Date este parmetro mostra


a data de modificao do artigo;
Show Publish Date este parmetro mostra
a data de publicao do artigo;
Show Navigation este parmetro mostra a
navegao dos artigos;
Show Voting se habilitado, este parmetro
ir mostrar a opo de voto;
Show Read More se habilitado, este parmetro ir mostrar o Leia Mais;
Show Title with Read More se habilitado,
este parmetro ir mostrar o ttulo no Leia
Mais; e
Read More Limit limite de caracteres, em
nmeros, permitido no boto Leia Mais

205/683

figura: configuraes de cones

um padro de webdesign mostrar cones


que permitam ao internauta aes rpidas
em relao impresso, envio de artigo para
um amigo e abrir artigo em .pdf. Por padro,
desde o Joomla! 1.6.x o cone de .pdf deixou
de ser implementado nativamente.
Show Icons mostra os cones ao lado do
ttulo dos artigos;
Show Print Icon mostra o cone de imprimir;
Show Email Icon mostra o cone de email;
how Hits mostra as visualizaes dos artigos;
Show Unauthorised Links mostra links no

206/683

autorizados. O padro No; e


Positioning of the Links - posio dos links.
Editing Layout Estas opes controlam o
layout da pgina de edio de artigo.
figura: configuraes de edio de layout

Show Publishing Options mostrar opes


de publicao de artigos;
Show Article Options mostrar opes de
artigos;
Front-end Image and Links mostra ou

207/683

oculta opo de inserir imagens e links, editando artigo pelo front-end;


Administrator Images and Links - mostra ou
oculta opo de inserir imagens e links, editando artigo pelo back-end;
URL A Target Window modo de abertura
do link de tem de menu ao ser clicado:
mesma janela, nova janela, popup ou modal;
URL B Target Window modo de abertura
do link de tem de menu ao ser clicado:
mesma janela, nova janela, popup ou modal;
URL C Target Window modo de abertura
do link de tem de menu ao ser clicado:
mesma janela, nova janela, popup ou modal;
Intro Image Float alinhamento da imagem
do texto de introduo; e
Full Text Image Float alinhamento da imagem do texto do artigo.
Category Essas configuraes se aplicam
para opes da categoria de artigos, a menos
que sejam alteradas na categoria individual
ou configuraes do menu.

208/683

figura: configuraes de categorias

Choose a layout as categorias podem ser


visualizadas em estilo blog (mais comum) ou
lista. Mas, qual a diferena? No estilo blog os
artigos so dispostos geralmente no formato
1-4-2-4, ou seja: 01 (um) artigo principal, 04
(quatro) artigos divididos em 02 (duas)
colunas e 04 (quatro) links para artigos na

209/683

categoria. No estilo lista, montada uma tabela que apresenta o ttulo dos artigos, com
links para o respectivo texto;
Category Title parmetro que determina a
visualizao ou no, do ttulo da categoria;
Category Description se habilitado (show),
mostra a descrio da categoria;
Category Image se habilitado (show),
mostra a imagem da categoria;
Subcategory Levels a quantidade em
nmeros, de subcategorias apresentadas;
Empty Categories se habilitado (show),
mostra categorias vazias;
No Articles Message - se habilitado (show), a
mensagem 'No h artigos nesta categoria'
ser exibida quando no houver artigos na
categoria ou quando o prametro "categorias
vazias" estiver definido como mostrar
(show);
Subcategories Descriptions se habilitado
(show), mostra a descrio das subcategorias; e

210/683

Articles in Category se habilitado (show),


mostra o nmero de artigos na categoria.
Categories Essas configuraes aplicam-se
as subcategorias e podem confundir o
usurio por terem parmetros idnticos s
categorias.
figura: configuraes de subcategorias

Top Level Category Description se habilitado (show), mostra a categoria de nvel principal;
Subcategory levels a quantidade em
nmero, de subcategorias;
Empty Categories se habilitado (show),
mostra as subcategorias vazias;

211/683

Subcategories Descriptions se habilitado


(show), mostra a descrio das subcategoriad; e
Articles em category se habilitado (show),
mostra o nmero de artigos na subcategoria.
Blog/Featureds layout - Essas configuraes
se aplicam para o blog ou layouts de
destaque, a menos que sejam alteradas para
um item de menu especfico.
figura: Layout de blog e destaques

Leading Articles quantidade em nmeros


de artigos principais;
Intro Articles quantidade em nmeros de
artigos de introduo;
Columns quantidade em nmeros de

212/683

colunas;
Links quantidade em nmero de links;Top
Level Category Description se habilitado
(show), mostra a categoria de nvel principal;
Multi Column Orders ordenao dos artigos em colunas; e
include subcategories essa opo permite
incluir artigos de subcategorias no layout do
blog.
List layout - Essas configuraes se aplicam
para layouts em lista, ou seja, tabelas que apresentam os ttulos dos artigos de determinada categoria, apontando para o texto.
figura: Layout em lista

213/683

Display Select se habilitado (show), mostra


uma lista do tipo seleo;
Filter Field se habilitado (show), mostra
um campo de filtro;
Table headings se habilitado (show),
mostra o cabealho da tabela;
Show Date se habilitado (show), mostra a
data de publicao, criao ou modificao
do artigo, para agilizar na busca resultante
do filtro;
Show Hits in List se habilitado (show),
mostra os hits dos artigos na lista; e
Show Author in List se habilitado (show),
mostra o autor do artigo na lista.
Shared options Essas configuraes
aplicam-se para opes de compartilhamento no estlo lista, blog e artigos em
destaque, a menos que sejam alteradas as
configuraes do menu.

214/683

figura: Opes de compartilhamento

Category Order forma de ordenao das


categorias;
Article Order forma de ordenao dos artigos;
Date for Ordering ordenao por data;
Pagination formas de paginao; e
pagination Results se habilitado (show),
mostra o resultado da paginao.
Integration - Essas configuraes determinam como o componente de artigo (com_content) ir integrar-se com outras extenses

215/683

figura: opes de integrao

Show Feed Link se habilitado (show),


mostra o link de feeds;
For each feed item show forma de apresentao do feed, texto de introduo ou
todo o texto do artigo; e
Show Read More se habilitado (show),
mostra o Leia mais nos artigos dos feeds,
quando a opo de texto de introduo est
habilitada.
Permissions nesta aba sero definidas as
permisses de cada grupo em relao ao contedo do site. As permisses podem ser: herdadas, permitidas ou negadas.
Gerenciamento de Menus

216/683

Os menus e itens de menu fazem parte do


contexto de design de contedo, em um projeto web.
Menu Main Menu - Quando instalamos o
Joomla!, o menu Main Menu criado por
padro e serve de base para a criao de todos os outros menus do site. O Main Menu
o nico menu que no pode ser excludo do
site.
Usurios que tm intimidade com sites estticos em .html, podem imaginar itens de
menu como sendo, os botes que abrem determinados links, nos sites estticos.
Para criarmos um novo menu, sigamos pelo
menu superior Menus Menu Manager
New

217/683

figura: Viso de criao de menu

Os campos necessrios para criarmos o


menu so:
Title ttulo do novo menu que ser exibido
na lista de menus do back-end. Este ttulo
no aparecer no Front-end do site;
Menu type um nome para que o menu seja
reconhecido pelo sistema; e
Description uma descrio para o menu.
Este campo opcional.
Aps preenchermos os campos, basta
clicamos no boto Save & Close para salvarmos a operao, fecharmos o formulrio e
voltarmos para a viso Menu Manager:
Menus.

218/683

Perceba que existe um boto denominado


Options, ele muito importante na configurao dos parmetros de funcionamento do
novo menu.
figura: Opes de configurao do menu

Browser Page Title - Texto opcional para o


elemento ttulo da pgina no navegador. Se
estiver em branco, o valor padro usado
baseado no ttulo do item de menu;
Show Page Heading se habilitado, mostra o
ttulo da pgina no navegador. O ttulo ser
apresentado com a tag de cabealho do html
(h 1).
Page Class voc pode criar uma classe na

219/683

folha de estilos do template do site, exclusivamente para esse menu.


Permissions permisses atribudas aos
grupos, em relao ao menu criado.
figura: Menu blog criado com sucesso

tem de Menu
tem de menu o nome que os botes do
menu recebem no Joomla! Sua funo
fazer o link para o contedo desejado.
Entenda-se por contedo, qualquer tipo de
informao que possa ser visualizada em um
navegador. Ex: artigos, imagens, vdeos e
etc...
Durante o desenvolvimento do projeto final
abordaremos de forma analtica o processo

220/683

de criao de um item de menu. Por hora,


seremos sucintos.
No menu superior siga atravs do tem
Menus Menu Manager Menu ItensNew e
na viso Menu Manager: New Menu Item
clique no boto
, para criar um novo
tem de menu.
figura: Tipos de itens de menu

Os tipos de itens de menu disponveis sero


apresentados em um modal lembra-se?
Vamos aos tipos disponveis por padro no

221/683

Joomla!:
Contacts lista as formas de link existentes
no componente de contato, a saber:
List All Contacts Categories o link ser
aberto em formato de lista com todas as categorias de contato, existentes;
List Contacts in a Category o link ser
aberto em formato de lista com todos os contatos de uma determinada categoria;
List All Contacts Categories o link ser
aberto em formato de lista com voc deve clicar em Articles Create Article.
Articles lista as formas de link existentes
para artigos no Joomla!, a saber:
Archived Articles link para artigos arquivados;
Single Article link direto para um artigo;
List All Categories lista todas as categorias
publicadas no site;
Category Blog lista os artigos de determinada categoria em formato de blog;

222/683

Category List lista os artigos de determinada categoria em formato de lista;


Featured Articles lista todos artigos em
destaque de uma ou vrias categorias; e
Create Article link para formulrio de criao de um artigo.
Smart Search link para a busca inteligente.
News Feeds Um feed da Web (ou feed de
notcias) um formato de dados usado para
fornecer aos usurios com contedo atualizado com freqncia. Nesta aba temos as
formas de link para o componente de Feeds
do Joomla!3.0
List All News Feed Categories lista todas as
categorias do componente de Feeds do site;
List All News Feed in a Category lista todas
os feeds de determinada categoria; e
Single News Feed abre um nico feed.
Search mostra os resultados da busca
Users manager opes de link relacionadas

223/683

aos usurios do Joomla!


Login Form link para exibio do formulrio de login;
User Profile link para apresentao do perfil do usurio logado;
Edit User Profile link para edio do perfil
do usurio logado;
Registration Form link para apresentao
do formulrio de cadastro de usurio;
Username Reminder Request link para
lembrar nome de usurio; e
Password Reset link Esqueceu sua senha.
Weblinks lista os tipos de links do componente Weblinks
List All Weblinks Categories lista todas as
categorias de links da web dentro de uma
categoria;
List Weblinks in a Category lista os
weblinks de uma categoria; e
Submit a Weblink apresenta o formulrio
de envio de weblink, para usurios logados

224/683

no site.
Wrapper link do tipo iframe.
System links Links de sistema
External URL link para uma URL interna
ou externa. Ex: site ou sistema web;
Menu Item Alias link para criao de um
apelido para tem de menu; e
Text Separator link para um separador de
texto.
Configurao do Editor de Texto
O CMS Joomla! possui editores de texto nativos e por padro utiliza o TinyMCE. Infelizmente por puro desconhecimento, muitos
usurios optam por no usar o editor padro
do Joomla! e por vezes negligenciam a segurana, com editores que constam da lista de
vulnerabilidades.
O TinyMCE possui todos os recursos necessrios a um editor de texto completo e poderoso e para us-lo em sua plenitude, a

225/683

primeira coisa a fazer seguir pelo menu superior Extensions Plug-in Manager Editor TinyMCE.
Clique no nome do plug-in para abrir a viso
de edio do TinyMCE. Perceba que temos
duas abas, a saber:
Details; e
Basic Options
Clique na aba Basic Options e faa as
seguintes alteraes:
Functionality - escolha extended para habilitar todas as funcionalidades do editor de
texto;
Skin gosta do Office do Windows? Que tal
o Skin Office blue 2007; e
Prohibited Elements deseja usar um formulrio legado, ou mesmo inserir vdeos do
youtbe usando o editor? Deixe apenas applet,
como elemento proibido.
Essas so as alteraes que fao para aproveitar ao mximo os recursos do editor de
texto nativo do Joomla! Em Extended Mode

226/683

Options, logo abaixo, voc tem opo de configurar todos os recursos que sero apresentados no front-end, quando houver envio de artigos pelos usurios autorizados.
Em 2010 publiquei um artigo completo
sobre a utilizao do editor de texto
TinyMCE, desde a sua configurao at a
utilizao dos principais recursos. O artigo
foi para o Joomla! 1.5, porm continua atual
pois apesar de estarmos na verso 3.0, nada
mudou. Acredita? Isto reflete a maturidade
do Editor TinyMCE que a exemplo do
Joomla!, um projeto Open source. Conhea
os segredos do Tiny em http://www.livrodejoomla.com.br/insumos/?#a1
Criando Categorias
Aps configurar corretamente o editor
TinyMCE, clique no boto Save and Close e
siga pelo menu superior Content Category
Manager New, para visualizar o resultado.

227/683

figura: Editor TinyMCE pronto para uso

Para verificarmos se a poltica de ACL criada


para o site, est funcionando, vamos criar 03
(trs) categorias: Blog, Esportes e Poltica.
As categoria Blog e poltica, sero independentes e Esportes ser descendente da categoria Blog.

228/683

figura: Criando a categoria Blog

A viso de criao de categorias possui os


seguintes botes:
Save salva as aes realizadas permanecendo com o editor de texto aberto;
Save e Close salva as alteraes e fecha o
editor de texto;
Save & New salva as alteraes e abre o editor para nova criao;
Cancel cancela a operao atual; e
Help abre a ajuda do Joomla!
A viso de criao de categorias possui as
seguintes abas:
Details aba para insero do Ttle (ttulo),
Alias (Apelido) e Description (Descrio) da

229/683

categoria. Mas, o que Alias? Alias um


apelido para o ttulo da categoria e serve
para ajudar na indexao dos robs de
busca.
Options as seguintes opes esto
presentes nesta aba:
Status estado atual da categoria, podendo
assumir um dos valores possveis: published
(publicado), unpublished (despublicado),
Archived (arquivado), trashed (lixeira);
Access nvel de acesso da categoria. Alm
dos nveis padro do Joomla! (Guest, Public,
Registered e Special), todos os nveis criados
para o site, sero listados nesta combo;
Language por padro o valor All (todos),
ser assumido. Em sites multi-idiomas devese escolher o idioma desejado;
ID identificador nico da categoria. A
chave primria PK, no banco de dados;
Created by autor do artigo, com opo de
selecionar dentre os usurios cadastrados no
site;

230/683

Alternative layout opo de usar um layout


exclusivo para a categoria;
Image imagem vinculada a categoria. Pode
ser selecionada dentre as imagens existentes
no servidor e/ou pode-se escolher uma imagem na mquina local para depois efetuar o
upload para o servidor; e
Note uma nota curta sobre a categoria.
Metadata Options opes de metadados
para melhor indexao pelos robs de busca;
e
Category Permissions aes permitidas aos
grupos em relao categoria.
Aps a criao das trs categorias voc deve
visualizar a seguinte lista ao clicar em Category Manager:
Categorias criadas

231/683

figura:
Perceba que a categoria Esporte, descende da categoria Blog.

Criando Artigo via Back-end


Os artigos podem ser criados no back-end ou
no front-end, dependendo dos requisitos do
projeto. Iremos abordar as duas formas, para
que voc tenha uma ideia do nvel de dificuldade de cada uma.
Para criar um artigo no back-end, clique no
cone rpido Article Manager ou siga pelo
menu superior Content Article Manager
New.

232/683

figura: Criando um artigo pelo back-end

Esta a viso de edio dos artigos. Perceba


que o editor de texto tiny MCE apresenta todos os recursos necessrios edio de um
artigo.
Uma dica de ouro: jamais copie um artigo do
Microsoft Word e cole diretamente no editor
de texto tiny MCE, para isso existe o boto
Paste From Word do editor.
A viso de edio dos artigos dividida em
abas e vamos abordar cada tem das mesmas.
Article Details esta aba apresenta os

233/683

detalhes do artigo que estamos criando.


Title ttulo do artigo;
Category lista as categorias publicadas
para que o artigo seja relacionado;
Editor de Texto descrio do artigo;
figura: botes do editor

perceba na imagem acima, os botes existentes no editor de texto. Quer saber para que
serve cada um?
Article permite linkar qualquer parte do
artigo que voc est criando, com um artigo
existente no Joomla;
Image uma das formas de se inserir imagem no artigo que est sendo criado;
Page Break faz uma quebra de pgina,
muito utilizado em artigos longos;
Read More Clique nesse boto para marcar
o ponto de corte do texto e inserir o Leia
Mais;e
Toggle editor Clique neste boto para

234/683

trocar o editor de texto.


Continuando com a abordagem das opes
de detalhes do artigo, voc ir perceber que
muitos dos parmetros foram configurados
de forma global para o site, no boto Options. Lembra?
Intro Image a imagem de introduo dos
artigos com layouts de blog e destaque, pode
ser deixada em branco (sem imagem), pode
ser escolhida no servidor ou ser enviada (upload) de sua mquina;
Image Float alinhamento da imagem, caso
exista; Alt Text texto alternativo para a imagem (tag alt do html), imprescindvel para
melhorar a acessibilidade do site, tendo em
vista que leitores de tela usam essa tag para
identificar a imagem contextualizada em um
artigo;
Caption legenda da imagem;
Full Article Image a imagem principal do
artigo;

235/683

Image Float alinhamento da imagem, caso


exista;
Alt Text texto alternativo para a imagem
(tag alt do html), imprescindvel para melhorar a acessibilidade do site, tendo em vista
que leitores de tela usam essa tag para identificar a imagem contextualizada em um
artigo;
Caption legenda da imagem;
LINK A link para que os usurios sejam redirecionados. Deve ser URL com caminho
absoluto. Ex: http://www.joomlabrasilia.org
LINK A Text texto apresentado ao passar o
mouse sobre o link;
URL Target Window forma de abertura da
janela do link;
LINK B link para que os usurios sejam redirecionados. Deve ser URL com caminho
absoluto. Ex: http://www.joomlabrasilia.org
LINK B Text texto apresentado ao passar o
mouse sobre o link;
URL Target Window forma de abertura da

236/683

janela do link;
LINK C link para que os usurios sejam redirecionados. Deve ser URL com caminho
absoluto. Ex: http://www.joomlabrasilia.org
LINK C Text texto apresentado ao passar o
mouse sobre o link;
URL Target Window forma de abertura da
janela do link;
Vamos aos parmetros existentes a direita e
acima da viso de edio do artigo.
Status Estado de publicao do artigo
(publicado, despublicado, arquivado e
lixeira);
Access nvel de acesso para o artigo, se voc est seguindo o projeto do livro, ir visualizar o nvel de acesso Colunistas;
Featured o artigo destaque? Sim ou No?
Sim um artigo de pgina inicial; e
No o artigo ser aberto atravs de um
tem de menu.

237/683

Language o padro all (todos) os idiomas. Para sites multi-idiomas, deve-se escolher o idioma nativo do artigo.
Publishing Options parmetros de publicao do artigo;
Alias apelido do artigo. Este apelido ajuda
na indexao do artigo nas mquinas de
busca;
ID Identificador do artigo, a PK (chave
primria) da tabela, no banco de dados;
Created by usurio relacionado a criao
do artigo;
Created Date data de criao do artigo;
Os artigos so temporizados, ou seja, voc
pode escolher a data de incio e fim da publicao.
Start Publishing Data de publicao do
artigo; e
Finish Publishing Data de trmino da publicao do artigo.

238/683

Article Options nesta aba temos as opes


j abordadas nas configuraes globais do
Joomla!, para os artigos, divididas em
Show (mostrar), Hide (esconder) ou Use
Global (usar a configurao global).
Configure Edit Screen as configuraes da
tela de edio abordam parmetros relacionados publicao, aos artigos, links e
imagens do back-end e links e imagens do
front-end. Esses parmetros foram abordados nas configuraes globais do Joomla!,
para artigos.
Metadata Options Metadados do artigo,
parmetros para indexao do artigo pelas
mquinas de busca.
Article Permissions permisses
grupos do site, vinculadas ao artigo.

dos

Um bom site para gerar textos o Gerador


de Lero Lero. Que tal deixar de lado o latim

239/683

(lorem ipsum dollor), utilizado para formatar textos em layout? Conhea uma forma
interessante pesquisando pelo termo
"gerador de lero lero", no Google.
Aps criarmos o artigo na categoria blog,
optando por coloc-lo como destaque, inserindo imagem e Leia Mais, vamos visualizlo no front-end. Clique em View Site, abaixo
e esquerda do back-end.
figura: Visualizao do artigo no front-end

Criando Artigo via Front-end


A criao de artigos pode ser efetuada atravs do Front-end do site. Entretanto precisamos criar um tem de menu que permita

240/683

ao usurio logado, com a devida permisso,


enviar artigos.
clique em New na viso Menu Manager: Edit
Menu Item;
na aba Details, clique no boto Select , verifique que o padro published e depois
escolha a opo Article Create Article para
criarmos um novo tem de menu;
No campo Menu Title digite Envie seu artigo
e em Menu Location escolha menublog;
mude o valor do campo Access, direita e
acima, de Public para Registered;
na aba Advanced Options, podemos escolher
a categoria padro que receber artigos, mas
deixaremos da forma como est, para testarmos a poltica de ACL; e
clique em Save & Close.

241/683

figura: tem de menu criado no menublog

Perceba na imagem acima, a utilizao do filtro para selecionar o menu desejado, muito
importante utiliz-lo, para ganhar tempo e
aumentar a produtividade.
Voc pode estar se perguntando: Por qu
mudamos o nvel de acesso do tem de
menu? Simples, se o nvel permanecesse
public, o tem de menu estaria visvel aos visitantes do site e uma mensagem de erro seria
exibida, caso fosse clicado.
Acesse o Front-end do site e no mdulo de
login acesse a rea restrita utilizando o
usurio que voc cadastrou no captulo 9.

242/683

No vale usar o Super Admin OK? Usarei o


cout45 que est vinculado ao Blog.
Clique no tem de menu Envie seu artigo e
acesse o editor de texto.
figura: viso do editor no front-end

As opes do editor no Front-end so praticamente as mesmas do back-end. Clique na


aba Publishing e perceba um problema na
nosso poltica de ACL: A categoria Uncategorised no pode aparecer para o grupo
Blog. Este grupo deve acessar apenas as

243/683

categorias Blog e Destaque.


Vamos resolver a celeuma? Acesse o Backend, menu superior Content Category
Manager e clique no nome da categoria Uncategorised. Na aba Category Permissions,
clique no nome do grupo Blog e no campo de
seleo Select New Setting, altere todos os
parmetros, de Inherited (herdado) para
Denied (negado) e clique em Save & Close.
Misso cumprida, retornemos ao Front-end
para inserirmos o artigo na categoria Blog.
Perceba que o artigo foi criado e publicado,
como destaque, na categoria Blog. Notou
algo diferente na imagem? Foi inserido um
vdeo do youtube no artigo.

244/683

figura: Artigo criado

Vdeo no artigo
A insero de vdeos em artigos, pode ser
efetuada diretamente no editor de texto
TinyMCE, ou atravs da utilizao de uma
extenso do tipo plug-in.
O plug-in mais utilizado para este fim o
Allvideos e pode ser baixado em http://www.livrodejoomla.com.br/insumos/
?#a2

245/683

So vrios os tipos de servios (youtube,


vimeo e etc...) e extenses de vdeo suportadas e no caso do artigo criado pelo usurio
cout45, utilizei o boto de insero/edio de
media do prprio editor de texto TinyMCE
par a inserir um vdeo do youtube no artigo.
figura: boto de insero/ edio de media

figura: opes para insero de vdeo no artigo

246/683

Aps clicarmos no boto de insero/edio


de media do editor, ser aberta a tela representada pela imagem acima, com as seguintes
opes:
Type mtodo de incorporao do vdeo no
artigo. Optei por usar iframe;
File/URL endereo (URL) do vdeo a ser
incorporado; e
Dimensions largura e altura da tela de exibio do vdeo.
Inserindo imagens nos artigos
Basicamente, podemos inserir imagens em
nossos artigos, de 03 (trs) formas:
Boto imagem - localizado esquerda e
abaixo do editor de texto TinyMCE, uma vez
clicado, este boto apresenta em um modal,
vrias opes relacionadas a imagens, dentre
elas:
envio ou a escolha de uma imagem existente
no provedor;
alinhamento da imagem em relao ao texto;

247/683

e
descrio para a imagem (TAG ALT do
HTML), fundamental para a acessibilidade
do site.
figura: boto imagem

Boto insert/edit image do editor de texto


TinyMCE este boto est visvel na verso
extendida do editor de texto e permite a insero e edio de alguns parmetros da apresentao da imagem, baseado na URL. Os
parmetros so relacionados a:
Geral parmetros gerais da imagem relacionados a:
endereo url da imagem, ao ser preenchida
permite a visualizao;
descrio tag alt do html, fundamental
para a acessibilidade do site; e
ttulo tag title do html, visualizada quando
pausamos o mouse sobre a imagem.
Aparncia parmetros relacionados

248/683

forma de apresentao da imagem no artigo,


so divididos em:
Alinhamento o alinhamento da imagem
em relao ao artigo, muito importante
para passar credibilidade em relao ao
design de contedo;
Dimenses dimenses da imagem em
pixels. Quando inserimos uma imagem no
artigo, via boto imagem e/ou boto inserir/
editar imagem, se clicarmos com o mouse
sobre a mesma, teremos a opo de
redimension-la. Esta ao, faz com que o
parmetro dimenses seja preenchido e podemos ento, editar a imagem mantendo
suas propores;
Espao vertical espaamento vertical da
imagem em relao ao texto;
Espao horizontal espaamento horizontal
da imagem em relao ao texto;
Limite borda da imagem;
Classe uma classe de css para a imagem; e
Estilo mostra a estilizao criada com o

249/683

preenchimento dos campos acima.


Avanado parmetros avanados de configurao da imagem, destacando-se:
Imagem alternativa permite que faamos
troca de imagens de acordo com o comportamento do mouse. Devemos preencher o caminho (URL), da imagem;
mouseover imagem apresentada ao passarmos o mouse sobre a mesma; e
mouseout imagem apresentada ao retiramos o mouse.
figura: boto inserir/editar imagem

Plug-ins de extenses de terceiros algumas


extenses, possuem plug-ins que integram
uma ou mais imagens ao contexto do artigo.
Ex: Ozio Gallery e Phoca Gallery.
Artigos em destaque

250/683

Artigos em destaque so apresentados na pgina inicial do site.


No back-end, so caracterizados por uma estrela azul, defronte ao ttulo. A opo de
destaque pode ser efetivada durante a criao do artigo via front-end / back-end, ou a
qualquer momento no back-end, clicando
sobre a estrela existente defronte ao ttulo de
cada artigo.
No menu superior Contedo Artigos em
Destaque, pode-se acessar a lista de artigos
em destaque existentes no site.
Gerenciamento de Mdias (Media Manager)
O gerenciamento de mdias engloba a edio
e envio de imagens para o site, bem como a
criao de novos diretrios. Para acessarmos
a viso de gerenciamento de mdias, devemos seguir pelo menu superior Content
Media Manager, ou clicando no cone rpido
Media Manager.

251/683

figura: Gerenciamento de mdias

Na parte superior temos 05 (cinco) abas,


clique na aba Options para configurar o site
em relao ao gerenciamento de mdias.
Legal Extensions (File Types) tipos de extenses permitidas para upload perceba que
no temos apenas imagens. Separe as extenses permitidas com o uso de ( , );
Maximum Size (in MB) tamanho mximo
do arquivo a ser carregado, em megabytes;
Path to File Folders diretrio raiz para os
arquivos;
Path to Image Folders diretrio raiz para
as imagens;
o caminho est relacionado ao diretrio raiz

252/683

(root), do site.
A mudana do diretrio padro de arquivos
pode quebrar suas ligaes (links).
O diretrio para as imagens tem que ser o
diretrio de arquivos, ou um subdiretrio do
mesmo. Restrict Uploads restringir uploads aos usurios de grupos inferiores ao
Gerente ;
Check MIME Types verifica o Mime Type
do arquivo;
Legal Image Extensions (File Types) Extenses vlidas para imagens;
Ignored Extensions Extenses ignoradas;
Legal MIME Types MIME Types permitidos;
Illegal MIME Types Extenses de arquivos
proibidas; e
Enable Flash Uploader Ativar flash uploader permite o upload de vrios arquivos
ao mesmo tempo. Aps verificar as opes
gerais do gerenciamento de mdias, clique
em salvar e fechar.

253/683

Criando novos diretrios para o Gerenciamento de Mdias


Voc pode criar vrias subpastas dentro da
pasta images e isso uma boa prtica em
busca da organizao de contedo no site.
Para criar uma nova pasta/diretrio, basta
clicar no boto Criar Pasta, que est localizado esquerda e acima, digitar o nome do
novo diretrio e clicar no boto Criar Pasta,
localizado direita.
figura: Criando um subdiretrio dentro do diretrio de imagens

Existem duas formas de visualizarmos os


diretrios de imagens, a saber:

254/683

Visualizao em Miniatura; e
Exibio Detalhada.
Para alterarmos a forma de exibio, basta
clicarmos na opo desejada.
Enviando imagens para o Gerenciador de
Mdias
Criado o diretrio, clicamos sobre a pasta
blog que passou a ser listada e esquerda e
acima, clicamos no boto Enviar.
figura: Enviando imagem para o site

O processo simples e prtico:


Clique no boto enviar;
Clique no boto Selecione um arquivo;

255/683

Escolha a imagem na sua mquina; e


Clique no boto Iniciar Envio.
Caso ocorra algum problema durante o envio, uma mensagem ser apresentada. Geralmente os erros no envio de imagem decorrem de:
Falta de permisso de escrita no diretrio
entre em contato com o seu provedor ou
altere as permisses do diretrio; e/ou
Tamanho da imagem excede o mximo permitido para upload edite a imagem antes
do envio.
Imagens no site, boas prticas
A manipulao de imagem merece um
captulo parte no livro, pois grande o
nmero de usurios que pecam neste
quesito.
Existem vrias extenses de imagens e voc
deve considerar as seguintes, como sendo
compatveis com a web:
.png extenso livre, apresenta excelente

256/683

qualidade. Permite transparncia, porm,


relativamente pesada. Pode ser usada em
logotipos e pequenas imagens;
.jpg extenso com qualidade e pesos, medianos. No permite transparncia;
.jpeg idntico ao .jpg diferindo no quesito
compresso; e
.gif extenso extremamente leve, porm,
com perda de qualidade.
As extenses mais utilizadas so: .jpg, .jpeg e
.gif.
Algumas dicas de ouro para manipular imagens em websites:
Nunca use caracteres especiais para nomear
suas imagens e evite o uso de espaos em
branco. Ex: Joo Grando p de feijo.jpg;
Trabalhe com um tamanho mximo em peso,
de 180 kb;
Na falta de um editor de imagens, busque
solues online. Um bom editor online de
imagens o Pixlr, permitindo dentre outras
coisas,
redimensionar
uma
imagem

257/683

qualquer. http://pixlr.com/editor/
Uusurios do Fireworks, Photoshop e etc...
devem usar a ferramenta batch (lote), que
permite redimensionar de uma nica vez,
grande quantidade de imagens.

Captulo
Idiomas

11

Gerenciamento

de

Um dos padres de usabilidade aponta no


sentido de termos o site no idioma nativo do
domnio. Para sabermos qual o pas do
domnio basta observarmos a extenso que
acompanha o .com, .net, .org e etc... Por exemplo: no domnio meusite.com.br, o (br)
identifica um domnio comercial do Brasil.
No contexto do Webdesign, o gerenciamento
de idiomas no CMS Joomla! pode
enquadrar-se em uma operao de "Design
de Site."
Instalando um novo idioma
Idioma uma extenso e no Joomla! 3, teve
o processo de instalao centralizado, permitindo que os pacotes sejam baixados e instalados a partir do repositrio oficial. Para

259/683

instalar um novo idioma usando o mtodo


automtico, siga os passos abaixo:
No back-end navegue pelo menu superior
Extenses Gerenciador de Extenses;
No menu auxiliar esquerda, clique na
opo Instalar Idiomas;
A lista com todos os idiomas disponveis ser
carregada, selecione o checkbox do idioma
desejado; e
Clique no boto Instalar.
O acesso internet e algumas diretivas do
PHP, so fundamentais para o perfeito funcionamento dessa nova funcionalidade do
Joomla! 3. Em caso de erro, use o mtodo de
instalao abordado no captulo 4.
Gerenciamento de idiomas
O gerenciamento de idiomas pode ser
efetuado clicando-se no cone rpido Gerenciador de Idiomas, localizado direita do
template sis, ou navegando no Menu superior Extenses Gerenciador de Idiomas.

260/683

Caso tenha dvidas para proceder a instalao do pacote de idioma portugus do


Brasil no site, releia o captulo nr 04.
Aps instalarmos o idioma, seguimos pelo
menu superior Extensions Language Manager para acessarmos a viso de idiomas
instalados.
figura: Alterando o idioma padro do site

Perceba o idioma que instalamos na lista e


que o padro utilizado o English. O idioma
utilizado o referenciado por uma estrela
amarela sob a opo Default. A esquerda
temos vrias opes relacionadas ao gerenciamento de idiomas, a saber:
Installed Site idiomas instalados para o
site (front-end);
Installed Administrator idiomas instalados para a administrao (back end);
Content idiomas de contedo (utilizado

261/683

para sites multi-idiomas); e


Overrides tradues diferenciadas em relao ao pacote. Ex: Suponha que determinada constante foi traduzida, para o portugs
do Brasil, como IR, porm, voc entende que
a melhor traduo, seria OK. Nesta aba, voc
pode sobreescrever a traduo original.
Para alterar o idioma do site, basta clicar na
estrela da opo Default, no idioma Portugus. A mesma ao deve ser feita na aba
Installed Administrator.
No esquea de alterar o cdigo de idioma do
editor tinyMCE, siga pelo menu superior
Extenses Gerenciamento de Plugins Editor- TinyMCE e na aba Opes Bsicas,
altere o cdigo do idioma.
A alterao do idioma deve ser uma das
primeiras aes efetuadas aps a instalao
do Joomla!

Captulo 12 Componentes
Componente um programa desenvolvido
de acordo com os padres de projeto exigidos pelo Framework do Joomla! a extenso de maior complexidade e via de regra
interage com o bando de dados do site, criando novas tabelas.
No Joomla Extensions Directory
(JED), repositrio oficial de extenses para
Joomla, possvel encontrar vrios tipos de
componentes, com as mais diversas funcionalidades. Os componentes so identificados
por uma imagem pequena com a letra C. O
endereo (URL) de acesso ao JED, http://extensions.joomla.org
Uma instalao padro do Joomla! 3.x possui os seguintes componentes embarcados:

263/683

figura: Componentes instalados no Joomla

Atualizao Joomla Componente para atualizao automtica da versodo CMS;


Banners componente de banners;
Busca componente de busca;
Busca Inteligente componente de busca inteligente;
Contatos componente de contatos;
Fonte de Notcias componente de RSS;
Mensagens componente de mensagens
privadas;
Redirecionamento componente de redirecionamento;

264/683

Tags - componente de TAGS para melhoria


da performance de seu site nos motores de
busca. Este componente foi incorporado do
CCk K2; e
Weblinks componente de Weblinks.
Componente Atualizao Joomla!
figura: Atualizao automtica de verso

O componente Atualizao Joomla, permite


verificar
pacotes
e
atualizar

265/683

automaticamente, a verso do CMS utilizada


no seu site. Observe na imagem acima os
passos a serem tomados caso seja encontrado algum pacote de atualizao:
Clique no boto Opoes;
Escolha a forma de atualizao desejada; e
Clique em Salvar ou Salvar & Fechar.
Componente Banners
figura: componente de banner

O componente Banners permite criar e gerenciar campanha publicitria no site, possuindo os seguintes parmetros:
Banners os banners existentes no site;
Categorias categorias do componente banner. Por padro, a categoria Sem Categoria,
est cadastrada;
Clientes clientes do site distribudos dentro

266/683

das respectivas categorias; e


Trilhas

trilhas
das
publicitrias.

campanhas

Antes de criarmos uma campanha fictcia


para o site, clique no boto opes do Gerenciador de Banners, para configurar de forma
global o comportamento do componente.
As configuraes sero aplicadas todos os
clientes, a menos que sejam alteradas para
algum cliente especfico. Os parmetros de
configurao, esto relacionados a:
Tipo de compra a forma global de
compra de espao no site, pode ser:
Ilimitado;
Anual;
Mensal;
Semanal; e
Dirio.
Rastrear Exibies grava diariamente, o
nmero de exibies dos banners;
Rastrear Cliques grava diariamente, o
nmero de cliques no banner; e

267/683

Prefixo das Palavras-Chave - melhorar o


rendimento na comparao de palavraschave.
Campanha Fictcia
Vamos criar uma campanha em nosso site
para visualizar o funcionamento do componente Banners.
Siga pelo menu superior Componentes
Banners Categorias Novo, para criar uma
categoria, com as seguintes caractersticas:
Ttulo - Hospedagem; e
Descrio Provedores parceiros.
O nvel de acesso pblico e a categoria no
descende de outra. Clique em Salvar e
Fechar.
Agora, no menu superior Componentes
Banners Clientes Novo, vamos cadastrar
um cliente, com as seguintes caractersticas:
Estado publicado;
Nome do cliente Cururu Hospedagem;

268/683

Nome do contato Ana;


E-mail de contato ana@cururu.com.br;
Tipo de compra Usar Global;
Rastrear Exibies Sim; e
Rastrear Cliques Sim.
Opes de Metadados fica por sua conta.
Lembra-se para que serve?
Resta cadastrar um banner e basta seguir
pelo menu superior Componentes Banners Banners Novo. A viso de cadastro
dividida em abas, a saber:
Detalhes;
Opes de Publicao; e
Metadados.
Aba Detalhes
Na aba Detalhes existem campos comuns e
especficos.
Campos comuns
Nome Banner Cururu;
Apelido ser preenchido pelo Joomla;e

269/683

Categoria selecione a categoria Hospedagem, que criamos anteriormente.


Campos especficos
Tipo existem duas opes para o tipo de
banner:
Imagem banner usando imagem. Clique
em selecionar para escolher a imagem do
banner. Os tamanhos dos banners (width x
height) seguem padres e um dos mais utilizados 468 x 60; e
Personalizado voc pode colocar um banner em action script (flash), basta preencher
o campo cdigo personalizado, com o
cdigo-fonte do script.
Os parmetros especficos do Tipo imagem
so:
Largura largura (width) da imagem, em
nmero. Ex: 468;
Altura altura (height) da imagem, em
nmero. Ex: 60;
Texto Alternativo Tag alt do html; e

270/683

Descrio descrio do banner.


Os parmetros especficos do Tipo personalizado so:
Cdigo Personalizado cdigo-fonte do banner;
URL do Clique URL que ser aberta
quando o banner for clicado;e
Descrio descrio do banner.
Aba Opes de Publicao
Parmetros relacionados a publicao do
banner, a saber:
Data de Criao data da criao do banner;
Criado por seleo do usurio que criou o
banner;
Data de Reviso Preenchimento
automtico da ltima reviso;
Revisado por usurio que revisou.
Preenchimento automtico;
Reviso tipo de reviso. Preenchimento
automtico;
Iniciar Publicao data de incio da

271/683

publicao do banner; e
Encerrar Publicao data de encerramento
da publicao do banner.
Aba Opes de Meta-dados
Parmetros relacionados indexao dos
robs de busca.
Componente Busca
Jakob Nielsen, com propriedade, definiu que
internauta no navega, internauta busca.
O componente Busca do Joomla! completo
e permite dentre outras coisas mapear o
comportamento do internauta, gerando estatsticas e mtricas, que definiro uma melhor prtica em relao ao design de contedo
do site.
Os dados de pesquisa so inseridos no mdulo do componente de busca, que deve estar
publicado no front-end do site.

272/683

O acesso ao componente deve ser feito pelo


menu superior Componentes Busca
figura: componente de busca

O primeiro passo configurar o componente


de acordo com os requisitos do projeto.
Clique no boto Opes para abrir a tela de
edio, que possui duas abas: Componente e
Permisses.
Aba Componente
Na aba Componente temos 05 (cinco) campos, a saber:
Recolher Estatsticas das Buscas o padro

273/683

No. Altere para Sim se desejar mtricas


baseadas nas buscas dos visitantes do site;
Usar Formulrio de Busca Exibe o formulrio de busca;
Data de Criao Exibe a data de criao;
Nome do OpenSearch Nome exibido para o
site, como um provedor de busca; e
Desrio do OpenSearch Descrio exibida
para o site, como um provedor de busca.
Aba Permisses
Configurao de permisses dos grupos em
relao ao componente.
Componente Busca Inteligente
O componente de busca inteligente permite
uma melhor filtragem e performance nas
pesquisas realizadas pelos visitantes do site.
Para utilizarmos este componente, devemos
primeiro publicar o plugin de busca inteligente. A publicao realizada seguindo o

274/683

caminho menu superior Extenses Gerenciador de Plugins. O plugin a ser publicado


o Contedo - Busca Inteligente, plugin do
tipo content. Para public-lo basta clicar na
imagem de um crculo com um (X) esquerda de seu nome. A mudana para uma
imagem com um (V) verde, significa que est
publicado.
figura: Plugin de busca inteligente

Aps publicar o plugin, voc pode seguir com


a configurao do componente de busca inteligente, voltando ao menu superior Componentes Busca Inteligente
O primeiro passo ser configurar os parmetros do componente, clique no boto
Opes.

275/683

figura: Configurando componente de busca inteligente

276/683

277/683

As configuraes esto divididas nas


seguintes abas: Busca, ndice e Permisses.
Aba Busca
Configuraes do componente em relao
engenharia de busca, algumas so redundantes e j foram abordada no componente
busca, outras so autoexplicativas e referemse :
Reunir Estatsticas de Busca gravar as
frases de busca digitadas pelos visitantes,
para gerar mtricas
Descrio do Resultado define se a
descrio deve ser apresentada junto com o
resultado da busca;
Comprimento da Descrio comprimento
em nr de caracteres, da descrio do texto
buscado;
Pemitir Busca Vazia com um filtro selecionado, permite que uma string de busca
vazia, inicie uma busca dentro das restries
do filtro;

278/683

URL do Resultado mostra a URL associada


ao resultado da busca;
Sugestes de Busca mostrar ou no sugestes de busca, aps realizao de uma
busca;
Busca Avanada definir se os visitantes devem visualizar as opes de busca avanada;
Dicas Avanadas alternar, se desejar que
os usurios visualizem dicas de busca
avanada;
Expandir Busca avanada define a exibio
expandida das opes de busca;
Filtros de Data define a exibio de filtros
de data;
Campo de Classificao valor utilizado
para classificar os resultados de busca. Os
valores possveis so: relevncia, data e lista
de preo;
Mtodo de Classificao definir o tipo de
mtodo de classificao em relao ao banco
de dados: acendente ou descendente;
Destacar Termos Buscados define se os

279/683

termos buscados devem ou no, ser destacados;


Nome do OpenSearch Nome exibido para o
site, como provedor de busca; e
Descrio do OpensSearch Descrio exibida para o site, como provedor de busca.
Aba ndice
Configuraes do componente em relao
forma de indexao. Os parmetros esto
relacionados :

280/683

figura: ndice da busca

Tamanho do lote indexador controla quantos itens so processados por lote. Quanto
maior o nmero, mais recursos de infra (mquina e memria) sero necessrios, alm do

281/683

tempo de processamento. Os valores variam


de 05 a 300 itens por lote;
Limite da Tabela de Memria o padro
30.000 e no deve ser alterado a menos que
voc esteja visualizando erro indicativo de
tabelas cheias. O erro estar relacionado s
tabelas: finder_tokens e finder_tokens_aggregate;
Peso do Ttulo do texto no multiplicador - o
multiplicador usado para controlar a quantidade de influncia que um texto correspondente tem sobre a relevncia global do
resultado da pesquisa. considerado em relao aos outros multiplicadores e o ttulo do
texto vem do ttulo do contedo;
Peso do Corpo do texto no multiplicador - o
multiplicador usado para controlar a quantidade de influncia que um texto correspondente tem sobre a relevncia global do
resultado da pesquisa. considerado em relao aos outros multiplicadores e o corpo do
texto vem de um resumo do contedo;

282/683

Peso da Meta data no multiplicador - o multiplicador usado para controlar a quantidade de influncia que um texto correspondente tem sobre a relevncia global do
resultado da pesquisa. Um multiplicador
considerado em relao a outros multiplicadores. Os meta de dados vem de uma srie
de fontes, incluindo as palavras-chaves,
meta-descrio, nomes de autores, etc;
Peso do caminho do texto no multiplicador o multiplicador usado para controlar a
quantidade de influncia que um texto correspondente tem sobre a relevncia global do
resultado da pesquisa. Um multiplicador
considerado em relao a outros multiplicadores. O texto do caminho vem da URL
amigvel do contedo;
Peso dos textos adicionais no multiplicador o multiplicador usado para controlar a
quantidade de influncia que um texto correspondente tem sobre a relevncia global do
resultado da pesquisa. Um multiplicador

283/683

considerado em relao a outros multiplicadores. O texto vem de vrias fontes, incluindo os comentrios e outros dados associados;
Ativar Derivador deve ser definido Sim se
for um site multi-idiomas;
Lematizadores / Separadores de palavras
O padro bola de neve (snowball), deve ser
mantido se o site tiver contedo multi-idiomas ou se um variao para o seu idioma no
foi encontrada.
Os separadores de palavras e os lematizadores executam a anlise lingustica em todos os dados indexados de texto completo. A
anlise lingustica envolve a localizao dos
limites das palavras (separao de palavras)
e a conjugao de verbos (lematizao). Os
separadores de palavras e os lematizadores
so especficos de idioma, e as regras de anlise lingustica diferem conforme o idioma.
Para um determinado idioma, um separador
de palavras identifica palavras individuais

284/683

determinando onde existem limites de palavra com base nas regras lexicais do idioma.
Cada palavra (tambm chamada de token)
inserida no ndice de texto completo usando
uma representao compactada para reduzir
seu tamanho. O lematizador gera formas
flexionadas de uma palavra especfica com
base nas regras do idioma (por exemplo, "executando", "executou" e "executor" so vrias
formas da palavra "executar"); e
Habilitar Log habilita a criao de um arquivo de log durante o processo de indexao.
Aps configurarmos o componente, podemos
clicar no boto ndice, esquerda e acima,
para criarmos um ndice baseado nos contedos do site e atravs do boto Estatsticas,
gerenciamos as mtricas resultantes das
pesquisas efetuadas.Aps configurarmos o
componente, podemos clicar no boto ndice, esquerda e acima, para criarmos um
ndice baseado nos contedos do site e

285/683

atravs do boto Estatsticas, gerenciamos as


mtricas resultantes das pesquisas efetuadas.
Aps configurarmos o componente, podemos
clicar no boto ndice, esquerda e acima,
para criarmos um ndice baseado nos contedos do site e atravs do boto Estatsticas,
gerenciamos as mtricas resultantes das
pesquisas efetuadas.
Na imagem abaixo temos a ilustrao de
uma pesquisa pelo termo poltica, no site.

286/683

figura: Pesquisa no site

Componente Contatos
Componente que permite a criao de contatos do site, segmentados em categorias, de
acordo com o design de contedo do projeto.
O acesso ao componente realizado pelo
caminho menu superior Componentes
Contatos.
Antes de utilizar o componente importante

287/683

configur-lo de forma global em relao ao


site e para tal, deve-se clicar no boto
Opes.
figura: Configuraes do contatos

Os parmetros de configurao esto divididos em abas, a saber:


Aba Contato
Estas configuraes se aplicam a um contato,
a no ser que tenha sido alterado por um
item de menu ou contato. Os parmetros so
divididos em: Gerais e Formulrio.
Parmetros Gerais
Selecione um Layout - layout de apresentao do componente. Pode ser

288/683

utilizado override para que o componente


seja apresentado em layout exclusivo;
Categoria do Contato defina se a categoria
a qual pertence o contato ser exibida ou
no. A exibio da categoria pode ser acrescentade de um link para a mesma;
Exibir Lista de Contatos define se a lista de
contatos da categoria ser exibida. A exibio
permite ao usurio, alterar o contato que
exibido, a partir da lista de todos os contatos
da categoria de contatos atual; e
Formato de Exibio determina o estilo de
exibio das sees do formulrio de contato.
As opes so: Indicadores, Abas e Liso.
Parmetros do Formulrio do contato
Os parmetros do formulrio referem-se ao
contato em questo e definem a exibio ou
no de determinados campos, a opo de
escolha e envio de uma imagem (avatar) e
links externos com informaes relativas ao
contato. Abaixo, podemos observar o campo

289/683

envio de imagem, marcado com um (*) e a


lista de parmetros cujos valores assumidos
podem ser: Exibir ou Ocultar:
Nome;
Cargo do Contato;
E-mail;
Endereo;
Cidade;
Estado;
CEP;
Pas;
Telefone;
Celular;
Fax;
Site;
Informaes Adicionais;
Imagem;
Imagem (*);
VCard;
Exibir Artigos do Usurio;
Exibir Perfil; e
Exibir Links.

290/683

Aba cones
Nesta aba podemos configurar a exibio ou
no de cones e textos, alm de alterar os
principais cones do componente de contato,
a saber:
cone de endereo;
cone de email;
cone de telefone;
cone de celular;
cone de fax; e
cone de informaes.
Aba Categoria
Configuraes aplicadas a categorias de
Weblinks, que no descendem de outras, exceto se forem alteradas no tem de menu.
Selecione um Layout seleo do layout
para a categoria de Contato. Caso seja feito
override de templates, um template especfico pode ser escolhido;
Ttulo da Categoria defina se o ttulo da

291/683

categoria ser exibida ou no. O padro Exibir;


Descrio da Categoria defina se a
descrio da categoria ser exibida ou no. O
padro Exibir;
Imagem da Categoria defina se a imagem
da categoria ser exibida ou no. O padro
Exibir;
Nveis de subcategorias havendo categorias descendentes, defina quantos nveis sero
apresentados. As opes vo de nenhum at
todos;
Categorias vazias defina se as categorias
que no possuem contatos sero exibidas, o
padro Ocultar;
Descrio de subcategorias defina se a
descrio da(s) categoria(s) descendente(s)
ser(o) exibida(s). O padro Exibir; e
Contato na Categoria defina se os itens existentes na categoria, sero exibidos em
nmeros. O padro Exibir.

292/683

Aba Categorias
Configuraes aplicadas a subcategorias de
Weblinks, exceto se forem alteradas no tem
de menu.
Descrio da categoria base defina se a
descrio da categoria base (pai), ser apresentada. O padro Exibir;
Nveis de subcategorias defina quantos nveis sero apresentados. As opes vo de 5
at todos;
Categorias vazias defina se as subcategorias que no possuem Weblinks sero exibidas, o padro Ocultar;
Descrio de subcategorias defina se a
descrio da(s) subcategoria(s) descendente(s) ser(o) exibida(s). O padro Exibir; e
Contatos na Categoria defina se os itens
existentes na subcategoria, sero exibidos
em nmeros. O padro Exibir.
Aba Layout de Lista

293/683

Por padro os contatos sero exibidos em


lista, formatada por tabela. As configuraes
aplicveis as opes de listas de contatos, a
no ser que tenham sido alteradas por um
item de menu. Os parmetros so divididos
em: Gerais e Formulrio.
Parmetros Gerais
Seleo de Exibio apresenta ou no o
dropdow para a seleo do display;
Cabealhos da Tabela exibir ou ocultar a
lista de ttulos em tabelas;
Parmetros do Formulrio
Cargo exibir ou ocultar a coluna cargo do
contato na tabela;
E-mail exibir ou ocultar a coluna email do
contato na tabela;
Telefone exibir ou ocultar a coluna telefone
do contato na tabela;
Celular exibir ou ocultar a coluna celular
do contato na tabela;

294/683

Fax exibir ou ocultar a coluna fax do contato na tabela;


Cidade exibir ou ocultar a coluna cidade do
contato na tabela;
Estado ou pas exibir ou ocultar a coluna
estado/pas do contato na tabela;
Pas exibir ou ocultar a coluna pais do contato na tabela;
Paginao exibir ou ocultar o recurso de
paginao na tabela; e
Paginao exibir ou ocultar o resultado da
paginao em nmero de pginas. Ex: Pgina 1 de 4; e
Sortear por campo ou campos, pelos quais
o contato ser sorteado.
Aba Opes de Formulrio
Parmetros de configurao do formulrio
de contato. Aplicam-se a um contato, a no
ser que tenha sido alterado por um item de
menu ou contato. As opes de configurao
esto relacionadas :

295/683

Permitir Captcha no Contato - Permite


Captcha no contato, para tal, selecione o plugin captch que ser usado no formulrio de
contato. Pode ser necessrio fornecer informaes ao plugin de captcha, no Gerenciador de Plugin. Se 'Usar Padro' estiver selecionado, tenha certeza que o plugin
captcha esteja selecionado na Configurao
Global;
Formulrio de Contato exibir ou ocultar o
formulrio de contato;
Cpia ao Remetente exibir ou ocultar
caixas de seleo, para permitir que uma
cpia do email seja enviada ao remetente;
E-mails Banidos e-mails que no tm permisso para utilizar o formulrio de contato.
Separe-os por ( ; ). Ex:fulano@fulano.com;
sic@sic.net;
Assunto Banido assuntos que contenham
qualquer palavra da lsita sero banidos.
Separe-os por ( ; ). Ex: vasco da gama;poltica;religio;etc...;

296/683

Texto Banido textos que contenham


qualquer palavra da lsita sero banidos.
Separe-os por ( ; ). Ex: vasco da gama;poltica;religio;etc...;
Verificar Sesso verificar a existncia de
cookie de sesso, valor padro: Sim. Nesta
situao, os cookies devem estar habilitados
no navegador do usurio, para que o mesmo
utilize o oformulrio de contato;
Resposta Personalizada desativa a resposta
automtica para plug-ins que fazem integrao com outros sistemas. Valor padro:
No; e
Redirecionar Contato informe a URL de
redirecionamento do usurio, aps a submisso do formulrio de contato. Caso deixe em
branco, o redirecionamento ser para a index.php.
Aba Integrao
Esta aba determina como o componente
contato relaciona-se com outras extenses.,

297/683

com a opo de exibir ou ocultar link para o


Feed RSS.
Aba Permisses
Configurao de permisses dos grupos em
relao ao componente.
Componente Fontes de Notcias
O componente Fonte de Notcias ( News
Feeds) permite inserir no site, fontes externas de contedo, segmentadas por categorias.
O acesso ao componente realizado pelo
caminho menu superior Componentes
Fontes de Notcias.

298/683

figura: Componente Fonte de Notcias

O componente dividido em categorias e


Notcias. As Notcias (Fontes) so relacionadas s categorias. O primeiro passo clicar
no boto Opes para acessar e definir os
parmetros de configurao do componente.

299/683

figura: Parmetros de configurao componente Fontes de Notcias

Os parmetros so relacionados fonte de


notcias, categoria, categorias, layouts de
lista e permisses.
Aba Fonte de Notcias
Configuraes aplicadas a um Newsfeed, exceto se forem alteradas no tem de menu.
Selecione um Layout seleo do layout
para o News Feed. Caso seja feito override de

300/683

templates, um template especfico pode ser


escolhido;
Imagem do Feed defina se a imagem ser
exibida ou no. O padro Exibir;
Descrio do Feed defina se a descrio do
Feed ser exibida ou no. O padro Exibir;
Contedo do Feed defina se o contedo do
Feed ser exibido ou no. O padro Exibir;
Contador de Caracteres quantidade em
nmero, de caracteres exibidos por fonte de
notcias;
Ordem de exibio ordem de exibio da
lista de Feeds;
Imagem flutuante posio da imagem; e
Imagem flutuante posio da imagem.
Aba Categoria
Configuraes aplicadas a categorias que no
descendem de outras do Newsfeed, exceto se
forem alteradas no tem de menu.
Selecione um Layout seleo do layout
para a categoria do News Feed. Caso seja

301/683

feito override de templates, um template especfico pode ser escolhido;


Ttulo do Categoria defina se o ttulo da
categoria ser exibida ou no. O padro Exibir;
Descrio da Categoria defina se a
descrio da categoria ser exibida ou no. O
padro Exibir;
Imagem da Categoria defina se a imagem
da categoria ser exibida ou no. O padro
Exibir;
Nveis de subcategorias havendo categorias descendentes, defina quantos nveis sero
apresentados. As opes vo de nenhum at
todos;
Categorias vazias defina se as categorias
que no possuem News Feeds sero exibidas,
o padro Ocultar;
Descrio de subcategorias defina se a
descrio da(s) categoria(s) descendente(s)
ser(o) exibida(s). O padro Exibir; e
Feeds da categoria defina se os itens

302/683

existentes na categoria, sero exibidos em


nmeros. O padro Exibir.
Aba Categorias
Configuraes aplicadas a subcategorias do
Newsfeed, exceto se forem alteradas no tem
de menu.
Descrio da categoria base defina se a
descrio da categoria base (pai), ser apresentada. O padro Exibir;
Nveis de subcategorias defina quantos nveis sero apresentados. As opes vo de 5
at todos;
Categorias vazias defina se as subcategorias que no possuem News Feeds sero exibidas, o padro Ocultar;
Descrio de subcategorias defina se a
descrio da(s) subcategoria(s) descendente(s) ser(o) exibida(s). O padro Exibir; e
Feeds da categoria defina se os itens

303/683

existentes na subcategoria, sero exibidos


em nmeros. O padro Exibir.
Aba Layout de Lista
Por padro as Newsfeed so apresentadas
em lista, diagramada por uma tabela. Nesta
aba configuramos de forma geral, a forma de
apresentao.
Seleo de Exibio define se ser exibido
o dropdow para seleo do display;
Cabealhos da Tabela define se exibiremos
o ttulo da lista;
Artigos define a exibio ou no, o nmero
de artigos em cada Feed;
Links do Feed exibir/ocultar o link do
Feed;
Paginao exibir ou ocultar a opo de paginao entre os artigos dos Feeds; e
Paginao exibir ou ocultar informaes do
resultado da paginao.
Aba Permisses

304/683

Configurao de permisses dos grupos em


relao ao componente. Clicando no boto
Carga possvel realizar operaes em lote.
figura: Operaes em lote

Componente Mensagens
Permite a troca de mensagens privadas na
administrao do site. Todas as aes de
usurios com perfil no mnimo Autor, so informadas ao super administrador. Esse dispositivo similar ao You have new email do
Unix.

305/683

O boto opes permite acesso as configuraes relacionadas as permisses dos grupos


em relao ao componente.
O boto minhas configuraes permite
acesso s configuraes de funcionamento
do componente.
figura: Configuraes do componente mensagens

Componente Redirecionamento
Permite o redirecionamento.
Aba Permisses

306/683

Configurao de permisses dos grupos em


relao ao componente.
Componente Weblinks
Componente que permite a criao de links
para sites parceiros, segmentados em categorias, de acordo com o design de contedo
do projeto.
O acesso ao componente realizado pelo
caminho menu superior Componentes
Weblinks.
figura: Componente weblinks

307/683

Antes de utilizar o componente importante


configur-lo de forma global em relao ao
site e para tal, deve-se clicar no boto
Opes.
figura: Configuraes do weblinks

Os parmetros de configurao esto divididos em abas, a saber:


Aba Weblinks
Configurao gerais do componente, exceto
se forem alteradas no tem de menu.
Alvo a forma de abertura do link pode

308/683

variar de acordo com as seguintes opes:


Abrir na janela pai abre o link na mesma
janela do navegador, em que o site apresentado e fechando o link, fecha-se o site.
a tag target _self do html;
Abrir em nova janela - abre o link em uma
nova janela do navegador e fechando o link,
volta-se ao site. a tag target _blank do
html;
Abrir em popup - abre o link em formato de
popup. A maioria dos navegadores bloqueia,
por padro, a abertura de popups e deve-se
evitar usar esta opo;
Modal - abre o link em um modal, que nada
mais que uma moldura light box. Usa o
conceito de layer invisvel e por isso no
pode ser bloqueado pelo navegador. a melhor opo em substituio ao popup.
Contar Cliques define se os cliques no
hiperlink sero registrados. uma boa opo
para mtricas estatsticas;
Texto/cone/Weblinks o que vai ser

309/683

exibido nos weblinks;


cone se a opo for cone, basta selecionar
o que ser utilizado;
Imagem flutuante posio da imagem; e
Imagem flutuante posio da imagem.
Aba Categoria
Configuraes aplicadas a categorias de
Weblinks, que no descendem de outras, exceto se forem alteradas no tem de menu.
Selecione um Layout seleo do layout
para a categoria de Weblinks. Caso seja feito
override de templates, um template especfico pode ser escolhido;
Ttulo da Categoria defina se o ttulo da
categoria ser exibida ou no. O padro Exibir;
Descrio da Categoria defina se a
descrio da categoria ser exibida ou no. O
padro Exibir;
Imagem da Categoria defina se a imagem
da categoria ser exibida ou no. O padro

310/683

Exibir;
Nveis de subcategorias havendo categorias descendentes, defina quantos nveis sero
apresentados. As opes vo de nenhum at
todos;
Categorias vazias defina se as categorias
que no possuem Weblinks sero exibidas, o
padro Ocultar;
Descrio de subcategorias defina se a
descrio da(s) categoria(s) descendente(s)
ser(o) exibida(s). O padro Exibir; e
Weblinksa defina se os itens existentes na
categoria, sero exibidos em nmeros. O
padro Exibir.
Aba Categorias
Configuraes aplicadas a subcategorias de
Weblinks, exceto se forem alteradas no tem
de menu.
Descrio da categoria base defina se a
descrio da categoria base (pai), ser apresentada. O padro Exibir;

311/683

Nveis de subcategorias defina quantos nveis sero apresentados. As opes vo de 5


at todos;
Categorias vazias defina se as subcategorias que no possuem Weblinks sero exibidas, o padro Ocultar;
Descrio de subcategorias defina se a
descrio da(s) subcategoria(s) descendente(s) ser(o) exibida(s). O padro Exibir; e
Weblinks defina se os itens existentes na
subcategoria, sero exibidos em nmeros. O
padro Exibir.
Aba Layout de Lista
Por padro as Newsfeed so apresentadas
em lista, diagramada por uma tabela. Nesta
aba configuramos de forma geral, a forma de
apresentao.
Seleo de Exibio define se ser exibido
o dropdow para seleo do display;
Cabealhos da Tabela define se exibiremos

312/683

o ttulo da lista;
Descrio dos links define a exibio ou
no, da descrio dos links;
Acesso exibir/ocultar acessos ao weblink;
Paginao exibir ou ocultar a opo de paginao entre os Weblinks; e
Paginao exibir ou ocultar informaes do
resultado da paginao.
Aba Integrao
Esta aba determina como o componente
Weblinks relaciona-se com outras extenses,
com a opo de exibir ou ocultar link para o
Feed RSS.
Aba Permisses
Configurao de permisses dos grupos em
relao ao componente.

Captulo 13 Mdulos
O mdulo serve para mostrar o resultado de
alguma ao do componente ou pode estar
isolado executando alguma funo. Temos
como exemplo, o mdulo de login que, uma
vez habilitado, apresenta o formulrio de criao de conta e painel de login para a rea
administrativa do website. Por outro lado, o
mdulo Hora Certa, apresenta o horrio
atmico baseado em um servidor externo e
no interage criando tabelas no banco de
dados.
O gerenciamento de mdulos pode ser
efetuado clicando-se no cone rpido Gerenciador de Mdulos, localizado direita do
template sis, ou navegando no Menu superior Extenses Gerenciador de Mdulos.

314/683

figura: Acesso ao gerenciamento de mdulos

Os mdulos so divididos em dois tipos:


Mdulos do site; e
Mdulos da Administrao.
A alternncia de tipos pode ser efetuada selecionando o desejado ou usando o filtro de
busca, logo abaixo. No template sis, ambos
os recursos ficam esquerda.
Mdulos do Site
Mdulos do site so aqueles que sero exibidos no front-end de acordo com a posio
escolhida.
Para que o mdulo seja visualizado, ele deve

315/683

estar publicado em uma posio existente no


template e atribudo pelo menos 01 (hum)
tem de menu. Observe a imagem abaixo:
figura: Detalhes de mdulo do site

Para visualizarmos a edio de um mdulo,


basta clicar sobre o nome de um j instalado
ou no boto Novo. So 04 (quatro) as abas
responsveis pelo gerenciamento de um mdulo, a saber:
Detalhes;
Opes Bsicas;
Opes Avanadas; e
Atribuir Menu.

316/683

Aba Detalhes
Nesta aba iremos definir os principais parmetros do mdulo:
Estado define o estado do mdulo em relao ao site;
Publicado mdulo publicado. Desde que
em posio existente no template e atribudo
um menu, ser visualizado no front-end;
Despublicado mdulo despublicado. No
ser visualizado no front-end; e
Lixeira mdulo excludo, permanece na
lixeira. No ser visualizado no front-end.
Ttulo ttulo do mdulo, ser visualizado
no front-end do site, desde que definido para
tal;
Exibir Ttulo define se o ttulo do mdulo
ser exibido ou no;
Posio define a posio do mdulo, no
template. Perceba que a lista de posies
ser exibida de acordo com cada template instalado no site, utilizado ou no. A lista

317/683

baseada no arquivo manifesto (xml) de cada


template. Caso o valor desejado no conste
da lista, pode-se digitar normalmente, sendo
o mesmo gravado no banco de dados e
disponibilizado em nova consulta. Durante a
digitao, o Joomla! informa estar adicionando uma posio personalizada;
Nvel de Acesso define o grupo que pode
acessar este mdulo. Por padro ser atribudo o nvel Public, ou seja, todos os visitantes do site podero acessar o mdulo;
Ordem define a oredenao do mdulo, em
relao aos outros mdulos publicados na
mesma posio. Pode ser alterada a qualquer
momento, clicando nos sinais esquerda do
nome do mdulo e arrastando para a nova
posio;
figura: definindo a ordem dos mdulos

318/683

Iniciar Publicao define a data/hora em


que o mdulo comear a ser exibido;
Encerrar Publicao define a data/hora em
que o mdulo deixar de ser exibido;
Esses parmetros foram introduzidos no
Joomla! 1.6.x trazendo um ganho substancial
no planejamento do Gerenciamento de Contedo de um projeto web;
Idioma define o idioma em que o mdulo
ser visualizado e o padro todos. Projeto
multi-idiomas, dependendo dos requisitos
devem ter seus mdulos relacionados aos
idiomas de interesse; e
Nota define uma nota que ser exibida na
lista de mdulos, opcional.
Opes Bsicas
As opes bsicas dependem do escopo do
mdulo.
Opes Avanadas

319/683

As opes bsicas dependem do escopo do


mdulo.
Atribuir Menu
Define em qual tem de menu (pgina) o mdulo ser exibido. As opes de visualizao
so as seguintes:
Em todas as pginas o mdulo ser visualizado em todo o site;
Nenhuma pgina o mdulo no ser visualizado, mesmo que publicado;
Apenas nas pginas selecionadas o mdulo
ser visualizado apenas no tem de menu
escolhido; e
Em todas as pginas exceto as selecionadas
o mdulo ser visualizado em todo o site, exceto na pgina do tem de menu escolhido.
Em uma instalao limpa do Joomla, ou
seja: sem exemplos de contedo, temos os
seguintes mdulos instalados por padro:
Main Menu um mdulo inicial do sistema e serve de base para todos os outros

320/683

mdulos de menu. No pode ser excludo;


Login Form relaciona-se com o componente de cadastro (com_register). As opes
apresentadas ao usurio no front-end, depende das configuraes globais do site em
relao usurios, abordadas no captulo 09.
Por padro, as seguintes opes estaro
disponveis no front-end: acesso a contedo
restrito e criao de uma conta; e
Breadcrumbs caminho de migalhas, auxilia
o usurio ao navegar no site. As opes de
configurao de mdulos, ficam restritas as
permisses de grupos.
Partindo do princpio que o Joomla foi instalado sem exemplos de contedo, iremos
abordar cada mdulo nativo, que pode ser
criado a partir do Gerenciador de Mdulos.
Clique no boto Novo para visualizar os tipos
existentes.
Artigos Newsflash - O Mdulo Newsflash
exibir um nmero fixo de artigos de uma

321/683

categoria especfica;
Artigos Arquivados - Este mdulo exibe uma
lista dos meses do calendrio contendo artigos arquivados;
Banners - O Mdulo Banner permite exibir
os Banners ativos;
Breadcrumbs - Este mdulo exibe o Caminho de migalhas;
Busca - Este mdulo ir exibir uma caixa de
texto de busca;
Categoria de Artigos - Este Mdulo exibe
uma lista de artigos de uma ou mais categorias;
Categoria de Artigos - Este mdulo exibe
uma lista de categorias de uma categoria pai;
Contedo Mais Lido - Este mdulo exibe
uma lista dos artigos publicados atualmente
que tm o maior nmero de pginas visitadas;
Estatstica - O mdulo de estatsticas exibe
informaes sobre a instalao do servidor
juntamente com estatsticas sobre os

322/683

usurios do site, o nmero de artigos em seu


banco de dados e o nmero de links da web;
Exibir Feed - Este mdulo permite a exibio
de uma fonte de notcias;
Imagem randmica - Este mdulo exibe uma
imagem aleatria a partir de um diretrio
escolhido;
Menu - Este mdulo exibe um menu no site;
Mdulo de Busca Inteligente - Este o mdulo para o sistema de Busca Inteligente;
Personalizar HTML - Este mdulo permite
que voc crie seu prprio mdulo HTML
usando um editor WYSIWYG;
Publicao de Feeds - O mdulo Syndication
cria uma publicao de feed para a pgina
onde exibido;
Quem est On-line - O mdulo 'Quem est
On-line' apresenta o nmero de usurios annimos (visitantes, por por exemplo e
usurios registrados (aqueles logados) que
esto acessando o site);
Rodap - Este mdulo exibe as informaes

323/683

dos direitos autorais do Joomla!


Seletor de idioma - Este mdulo exibe uma
lista dos idiomas de contedo disponveis
(como definido e publicado na aba de Gerenciador de Idioma de Contedo) para
alternar-se entre eles quando desejar um site
multi-idiomas;
ltimas Notcias - Este mdulo exibe uma
lista dos artigos mais recentemente publicados;
ltimos usurios - Este mdulo exibe os ltimos usurios registrados;
Weblinks - Este mdulo exibe links de uma
categoria definida no componente Weblinks;
e
Wrapper - Esse mdulo exibe uma janela
iframe para o endereo especificado.
Mdulos da Administrao
Mdulos de administrao so aqueles exibidos no back end. Em uma instalao limpa
do Joomla, ou seja: sem exemplos de

324/683

contedo, temos os seguintes mdulos instalados por padro:


Logged-in Users exibe os uusrios logados
no site;
Popular Articles lista os artigos mais acessados;
Recently Added Articles lista os artigos
adicionados recentemente;
Joomla Version exibe a verso do joomla
utilizada no site;
Quick Icons exibe o painel de cones
rpidos;
Login exibe formulrio de login;
Admin Menu exibe o menu de administrao;
Multilanguage status exibe o estado da estrutura do multi-idiomas, para sites que assim esto configurados;
User Status exibe o estado do usurio;
Admin Submenu exibe o submenu da administrao;
Title exibe o ttulo; e

325/683

Toolbar exibe a barra de ferramentas.


Para que o mdulo seja visualizado, ele deve
estar publicado em uma posio existente no
template administrativo.
Para visualizarmos a edio de um mdulo,
basta clicar sobre o nome de um j instalado
ou no boto Novo. So 03 (trs) as abas responsveis pelo gerenciamento de um mdulo da administrao, a saber:
Detalhes;
Opes Bsicas; e
Opes Avanadas.

Captulo 14 Plugins
Plugins so scripts com determinada funcionalidade, geralmente reagindo a uma ao
do usurio. So dividos em tipos e possuem
parmetros de configurao comuns todos
e especficos a cada um.
No captulo 22 do livro, aprenderemos a criar um plugin para validar cadastro de usurios de acordo com a idade.
O gerenciamento de plugins pode ser
efetuado clicando-se no cone rpido Gerenciador de Mdulos, localizado direita do
template sis, ou navegando no Menu superior Extenses Gerenciador de Plugins.
Os parmetros podem ser visualizados na
imagem abaixo:

327/683

figura: Parmetros configuraes plug-ins

Aba Detalhes
Define os parmetros gerais de configurao
de um plugin, a saber:
Estado define o estado do plugin:
Ativado Publicado; e
Desativado Despublicado.
Nvel de Acesso define o nvel de acesso
relacionado a um grupo que pode acessar o

328/683

plugin. Por padro o nvel de acesso o


Public;
Ordem define a ordenao dos plug-ins;
Tipo de Plugin mostra o tipo de plugin.
Esta campo no pode ser editado;
Arquivo do Plugin mostra o diretrio e
nome do arquivo principal do plugin. No
pode ser editado;
ID Identificador nico (PK) do plugin. No
pode ser editado; e
Descrio uma descrio curta do plugin.
Uma instalao padro do Joomla! 3.x, sem
a instalao de exemplos de contedo possui
os seguintes plug-ins:
Plugins Habilitados
Authentication este plugin gerencia a
autenticao de usurios padro do Joomla!
Voc deve ter pelo menos um plugin de
autenticao ativado ou no conseguir
acesso ao seu site;

329/683

Captcha - Esse plugin usa o servio


CAPTCHA para evitar spammers, enquanto
ajuda a digitalizar livros, jornais e programas
antigos de rdio. Para obter uma chave
pblica e privada para o seu domnio, acesse
http://google.com/recaptcha.
Para usar esta nova conta para o registro, v
para Opes no Gerenciador de Usurio e selecione Captcha - reCaptcha como Captcha;
Content So plugins relacionados ao contedo do site, por padro os seguintes plugins do tipo content, so instalados e habilitados:
Contedo Busca Inteligente - Habilita Indexao para Busca Inteligente;
Contedo Joomla - Fornece processamento
de categorias para as extenses do core;
envia e-mail quando um artigo enviado
pelo site;
Contedo Carregar Mdulos - Dentro do
contedo carrega mdulos de posicionamento, sintaxe: {loadposition user1} ou

330/683

mdulos pelo nome, sintaxe: {loadmodule


mod_login}. Opcionalmente pode especificar
o estilo do mdulo e para loadmodule um
ttulo especfico para o mdulo;
Contedo Ocultar e-mails - Ocultar todos os
e-mails no contedo dos spambots usando o
JavaScript;
Contedo Quebra de Pginas - Permite a criao de artigos paginados com uma tabela de
contedo opcional.
Inserir quebra de pgina atravs do uso do
boto de quebra de pgina normalmente encontrado abaixo do painel de texto no editor
de artigos. A localizao da quebra de pgina
em um artigo ser exibida no editor como
uma simples linha horizontal.
O texto exibido depender das opes feitas
e pode ser o ttulo, texto alternativo (se
fornecido) ou nmero de pginas.
Contedo Navegao da Pgina - Permite a
voc adicionar a funcionalidade Prximo &

331/683

Anterior em um Artigo; e
Contedo Navegao - Adiciona a funcionalidade de votao a um Artigo.
Editors So plugins relacionados a edio
de texto do site, por padro os seguintes
plug-ins do tipo editors, so instalados e habilitados:
Editor CodeMirror este plugin carrega o
editor CodeMirror;
Editor Nenhum este plugin carrega um
editor bsico de texto plano. Ideal para criao de mdulos HTML personalizados com
algum tipo de script e para depurao de textos inseridos;
Editor TinyMCE - um editor HTML
WYSIWYG baseado em JavaScript, sendo o
editor de texto padro do Joomla! Na minha
opinio, o TinyMCE o melhor e mais seguro editor de texto open source da
atualidade;
editors-xtd So plug-ins relacionados as

332/683

funcionalidades do editor de texto, por


padro os seguintes plug-ins do tipo editorsxtd, so instalados e habilitados:
Boto Artigo - Exibe um boto para inserir
em um artigo, links para outros artigos do
site. Exibe um popup permitindo voc escolher um artigo;
Boto Imagem - Exibe um boto que
permite inserir imagens em um artigo. Exibe
um popup permitindo a voc configurar as
propriedades da imagem, bem como enviar
uma nova imagem;
Boto Quebra de Pgina - Habilita um
boto quer permite inserir uma quebra de
pgina em um artigo. Um popup permite
efetuar as configuraes desejadas; e
Boto Leia Mais - Habilita um boto que
permite inserir facilmente o link Leia mais...
em um artigo.
Extension Este plugin gerencia as atualizaes de extenses do site;

333/683

Finder - So plug-ins relacionados as funcionalidades de busca inteligente, por padro


os seguintes plug-ins do tipo Finder, so instalados e habilitados:
Busca Inteligente Categorias - Esse plugin
indexa as categorias do Joomla!;
Busca Inteligente - Contatos - Esse plugin indexa os contatos do Joomla!;
Busca Inteligente - Contedo - Esse plugin
indexa os artigos do Joomla!;
Busca Inteligente - Fonte de Notcias - Esse
plugin indexa as fontes de notcias (RSS) do
Joomla!; e
Busca Inteligente Weblinks - Esse plugin
indexa os weblinks do Joomla!
Quickicon - So plug-ins relacionados as funcionalidades de cones rpidos, por padro
os seguintes plug-ins do tipo Quickicon, so
instalados e habilitados:
cone Rpido - Notificao de Atualizaes
de Extenses - Verifica atualizaes de extenses de terceiros instaladas e notifica voc

334/683

quando visitar o Painel de Controle; e


cone Rpido - Notificao de Atualizao do
Joomla! - Verifica atualizaes do Joomla! e
notifica voc quando visitar a pgina do
Painel de Controle.
Search - So plug-ins relacionados as funcionalidades de busca, por padro os
seguintes plug-ins do tipo Finder, so instalados e habilitados:
Busca Categorias - Esse plugin habilita a
busca de categorias do Joomla!;
Busca - Contatos - Esse plugin habilita a
busca de contatos do Joomla!;
Busca - Contedo - Esse plugin habilita a
busca de artigos do Joomla!;
Busca - Fonte de Notcias - Esse plugin habilita a busca de fontes de notcias (RSS) do
Joomla!; e
Busca - Weblinks - Esse plugin habilita a
busca de weblinks do Joomla!
System So plug-ins relacionados as funcionalidades do sistema, por padro os

335/683

seguintes plug-ins do tipo System, so instalados e habilitados:


Sistema - Poltica P3P - O plugin de poltica
de sistema P3P permite ao Joomla! enviar
uma string personalizada de tag de poltica
P3P no cabealho do HTTP. Isto necessrio
para que as sesses funcionem em alguns
navegadores, ex. Internet Explorer 6 e 7. A
Plataforma para Preferncias de Privacidade
do Projeto (P3P) um protocolo que permite
ao site declarar sua poltica de informaes
coletadas sobre os usurios atravs do navegador. Projetado para dar aos usurios mais
controle sobre suas informaes pessoais ao
navegar, P3P foi desenvolvido pelo World
Wide Web Consortium (W3C) e recomendado oficialmente a partir de 16 de abril de 2002;
Sistema Desconectar - O plugin de desconexo permite ao Joomla redirecionar o
usrio pgina inicial se ele escolher se
desconectar enquanto estiver em uma rea

336/683

restrita do site;
Sistema Debug - Este plugin fornece uma
variedade de informaes do sistema e assistncia para criao de tradues;
Sistema - Log system Este plugin fornece
logs do sistema;
Sistema Redirecionamento - O plugin de
redirecionamento habilita o sistema de redirecionamento do Joomla! para pegar todas
as pginas inexistentes e redirecionar usurios;
Sistema Destaque - Plugin do sistema para
realar termos especficos;
Sistema - Lembrar de Mim - Fornece a funcionalidade lembrar de mim; e
Sistema SEF - Adiciona suporte SEF aos
links nos artigos. Trabalha diretamente no
HTML e no requer tag especial.
Plugins Desabilitados
Autenticao Gmail - Gerencia a
autenticao de usurio com o GMail ou

337/683

conta Googlemail (Requer diretiva cURL do


PHP habilitada no php.ini). Voc deve ter
pelo menos um plugin de autenticao
ativado ou voc no conseguir acesso ao seu
site.
Autenticao LDAP - Gerencia a
autenticao de usurio atravs de um servidor de LDAP, muito utilizado em intranets. Voc deve ter pelo menos um plugin
de autenticao ativado ou voc no conseguir acesso ao seu site;
Contedo - Realce de Sintaxe (GeSHi) - Exibe o cdigo do contedo com formatao
baseada no mecanismo de realce de sintaxe
Geshi;
Sistema - Filtro de Idioma - Esse plugin filtra
o contedo exibido dependendo do idioma.
Esse plugin deve ser usado somente quando
o mdulo ''Troca de Idioma'' estiver publicado. Se o plugin estiver ativado, sugere-se
que seja publicado o mdulo de status multiidioma no Administrador. essencial para

338/683

sites multi-idiomas;
Sistema Cache Fornece cache da pgina;
Sistema - Cdigo de Idioma - Oferece a possibilidade de alterar o Cdigo de Idioma no
documento HTML gerado para melhorar
SEO (otimizao de mecanismos de busca).
Os campos aparecero quando o plugin for
ativado e salvo. Mais informaes em http://www.w3c.org;
Usurio Perfil - Plugin de Perfil do Usurio
um plugin do componente com_users e
aumenta as opes do cadastro de usurios.
Ser analisado no captulo 20 durante a customizao do componente; e
Usurio - Criador de Contato - Plugin para
criar automaticamente informaes de contato para novos usurios.

Captulo 15 Templates
Template ou tema, a camada de viso de
qualquer programa orientado a objetos, isto
mesmo, template no uma exclusividade
do Joomla! Fim manter um padro de nomenclatura, irei utilizar o termo template, ao
invs de tema. No se esquea, o significado
o mesmo.
Existem vrios frameworks e softwares para
criao de templates, sendo os mais conhecidos: Gantry, T3 e Artisteer.
O destaque fica para framework Bootstrap
do Twitter, utilizado para desenvolver extenses, dentre elas templates responsivos e
voltados para o mercado mobile. Alis,
desenvolver template com o bootstrap bem
melhor que usar outro framework.

340/683

Raramente desenvolve-se um template do


zero para um projeto em Joomla! Via de
regra customiza-se um template existente,
adequando-se ao escopo do projeto. Quando
cito customizao no estou me referindo a
mudana de logotipo e sim a alteraes no
cdigo fonte do tema, aproveitando-se a estrutura bsica do layout.
No Brasil o layout grfico consagrado composto por:
Barra superior ou topo (navegao e busca);
Barra lateral esquerda (navegao);
Frame central (contedo);
Barra lateral direita (publicidade); e
Rodap (copyright, endero, navegao auxiliar).
Discorda? Acesse os grandes portais (UOL,
TERRA, G1 e R7) e analise de forma abstrata
os seus respectivos layouts grficos. Com
certeza, perceber que utilizam o layout
grfico citado acima.

341/683

Customizao de Template
Customizar um template, nada mais que
adaptar a camada de viso, aos requisitos de
um projeto. Uso o CMS h 10 anos e desenvolvi apenas 03 templates do zero, pouco
concorda? Via de regra, a customizao
atende a 90% dos projetos.
Um dos maiores desafios que enfrentei em
termos de customizao, esteve relacionado
a projeto para uma grande empresa de
Braslia.
Levantei os requisitos e utilizei o template JA
Purity, lanado em 07/12/2007, enquanto
base. Esse template free do Joomlart, um dos
maiores clubes de templates comerciais, j
apresentava conceitos de responsividade integrados em seu cdigo-fonte.
Abaixo voc pode visualizar o resultado final
da customizao, comparando as imagens:

342/683

figura: Template JA Purity original

figura: Template JA Purity customizado

343/683

Isto customizao e pode ser conseguida


com um simples editor de texto, ou se quiser
melhorar um pouco, o notepad ++
(Windows) ou Gedit (GNU/Linux). S um
detalhe: tem que conhecer PHP, css, Xhtml e
Javascript.
Firefox e Firebug
impossvel falar de customizao de templates, sem mencionar a dupla dinmica
Firefox (navegador) e Firebug (extenso do
firefox). So ferramentas indispensveis na
customizao de um tema e sero devidamente abordadas no decorrer do livro.
Que tal adiantar o servio e baixar essas duas
ferramentas incrveis? O Batman e Robin da
customizao de templates! Acesse http://br.mozdev.org/firefox/download/
e
baixe a ltima verso do navegador Firefox.
A ltima verso do Firebug pode ser baixada
em
http://www.livrodejoomla.com.br/insumos/?#a4

344/683

Estrutura de um Template
Geralmente, novos usurios tm a tendncia
de confundir o conceito de templates,
referindo-se muitas vezes ao site como se
template fosse.
Um template possui basicamente, a rvore
de diretrios e arquivos, parecida com a imagem abaixo:
figura: Estrutura de um template

css diretrio da(s) folha(s) de estilos;


fonts diretrio de fontes;
html contm os overrides de layout do
template em relao ao Joomla;
images diretrio de imagens do template;

345/683

javascript scripts e bibliotecas javascripts


utilizadas pelo template;
language arquivos de idiomas utilizados
pelo template;
component script php que contm instrues especficas para o template;
error script php padro de erro;
ndex arquivo HTML, em branco, inicial do
template;
ndex script php principal do template;
jsstings script em javascript; e
templateDetails manifesto XML do template.
No existe um padro e dependendo da formade desenvolvimento, pode haver variao
na estrutura acima abordada.
Gerenciamento de Template
O gerenciamento de templates pode ser
efetuado clicando-se no cone rpido Gerenciador Temas, localizado direita do

346/683

template sis, ou navegando no Menu superior Extenses Gerenciador de Templates.


figura: Gerenciador de temas

Observe a barra superior do gerenciador de


temas, temos opes interessantes:
Make Default define o tema selecionado
para ser o padro do site, ou da administrao;
Editar permite a edio de arquivos e informaes do tema;
Duplicar permite a cpia do tema;
Excluir permite a excluso de um tema,
desde que o mesmo no seja padro;
Opes configuraes gerais; e
Ajuda servidor padro de ajuda do Joomla!
A primeira ao no gerenciador de temas

347/683

ser clicar no boto Opes e ativar a visualizao das posies de mdulos, por padro
est desativado. Em verses anteriores do
CMS Joomla, bastava o usurio digitar no
navegador, o domnio do site acompanhado
de ndex.php?tp=1, para visualizar as
posies do template padro do site. Isto foi
considerado uma falha de segurana e a
partir do Joomla! 1.6.x necessrio habilitar
esse parmetro nas opes de configurao
do gerenciamento de templates.
Agora, observe que a barra lateral esquerda
possui duas opes:
Styles o padro, lista os estilos dos templates; e
Templates lista os templates instalados,
com seus respectivos thumbnails.
Altere para Templates e visualize a identidade grfica de cada template pr-instalado
no Joomla!
Em uma instalao padro do Joomla! 3.x,
com ou sem exemplo de contedos, o

348/683

template padro do front-end do site o Protostar e o template da administrao o sis.


Ambos os templates foram desenvolvidos
dentro dos rgidos padres da Web 2.0 e
compatveis com o mercado mobile.
figura: Template padro do site

figura: Template padro da administrao

Perceba que o link Preview est habilitado


para o template Protostar, padro do site.
Clique em preview para visualizar as
posies de mdulos do template.

349/683

figura: Posies de mdulos template Protostar

A imagem, retrata in loco, o que um template. Na parte superior, o texto Laboratrio


Joomla o texto que substitui o logotipo e no
frame central, temos o contedo de
destaque, publicado no banco de dados. Os
objetos sombreados e com marcaes em
vermelho, so posies e mdulos publicados. Clicando no link Protostar Details and
Files, temos a opo de editar arquivos e
folha(s) de estilos do template, bem como
fazer uma cpia.

350/683

figura: Editando o Template

Cpia de Template
Grandes projetos podem significar vrios
layouts grficos divididos por segmentos. No
Joomla! 3.x temos a opo de criar templates
baseado em outros existentes e desta forma
ganhar um tempo considervel no desenvolvimento de um grande projeto. Quando digo

351/683

criar realmente clonar toda a estrutura do


template (arquivos e diretrios) e gravar o
novo tema na tabela extensions. S quem j
precisou criar vrios templates em projetos
com Joomla! 1.0 e 1.5 sabe o nvel de melhoria e economia de tempo com este novo recurso do CMS.
O primeiro passo para clonar um template
criar outro baseado no original. Vamos a um
passo-a-passo demonstrando todo o processo:
a) Navegue pelo menu superior Extenses ->
Gerenciador de Temas e selecione direita, a
opo Templates de acordo com a imagem
abaixo:
figura: Menu auxiliar Gerenciamento de Templates

b) Clique em Protostar Details and Files, ao


lado do Template Protostar, se o seu site est
com a instalao padro, ele ser o ltimo
visualizado.

352/683

figura: Template Protostar

c) Na viso de customizao do template,


clique sobre o boto Copiar que est acima
da imagem.
figura: Boto de cpia de Template

d) Digite o nome do novo template e clique


no boto Copy Template. Lembre-se que
trata-se de um diretrio ento, nada de acentos, espaos e caracteres especiais. Cuidado
com a netiqueta e prefira caixa baixa. No

353/683

caso de estudo apresentado, o nome do template ser "andromeda".


figura: Nomeando o clone do Template

e) Clique no boto fechar e observe o novo


template disponvel na lista.
figura: Andromeda, clone do Template Protostar

f) esquerda mude para "Styles" e perceba


que os estilos tambm foram copiados e na
lista aparece o estilo andromeda Padro.
figura: Estilo do Template Andromeda

354/683

g) Aps o processo o novo template est


gravado na tabela #__extensions da base de
dados e pronto para ser utilizado.
figura: Template gravado na tabela #_extensions

h) Altere o template padro do seu site para


"andromeda e verifique o resultado.
Associao de Template
Muitas vezes nos deparamos com projetos
que precisam de layouts grficos diferenciados, para determinadas reas. No Joomla!
usamos a Associao de Templates para
atender demanda.
Muitos profissionais desconhecem este recurso, presente desde a poca do Mambo e
instalam vrios Joomlas no servidor, gerando muita dor de cabea para o cliente.
Imagine ter que atualizar cada verso, cada

355/683

extenso de terceiros, quantas vezes for necessrio? O uso indiscriminado do servidor


de hospedagem, o peso no carregamento e
etc...
Tenho exemplos reais em que foram instalados, por exemplo, 18 Joomlas para atender
uma demanda que poderia ser atendida com
associao de templates.
H tempos recebi um telefonema de um
empresrio que reclamava de uma situao
parecida no portal de sua empresa. Em determinado momento ele falou contratei um
motorista de fusca para pilotar uma Ferrari.
Eu respondi a culpa no dele, por qu voc
no contratou um motorista de Ferrari?
Em 2009 desenvolvi um projeto bem interessante em que utilizei com xito, a associao de templates. Um dos requisitos era
atender os escritrios existentes em todo o
territrio nacional. Cada escritrio deveria
ter uma rea no portal e esta precisaria de
um Layout Grfico diferente do principal.

356/683

Utilizei 28 templates, 01 principal e 27 para


atender aos escritrios nacionais. O projeto
foi um sucesso e permanece ativo, aos cuidados da equipe de manuteno do cliente.
Conhea o portal acessando o endereo http://www.moradiaecidadania.org.br.
A falta de percia com o CMS poderia
induzir-me instalao de 28 Joomlas e a
bomba estouraria no colo da responsvel
pela manuteno do projeto aps a publicao. Quem seria o responsvel por tal
problema? O Joomla! no fim ele sempre leva
a culpa. Voc acha justo?
No projeto proposto no livro, usaremos associao de templates.
Acesse http://www.livrodejoomla.com.br/
insumos/?#a5 e baixe o infogrfico que criei
para demonstrar o que um template.
Apesar de ter sido feito para o Joomla! 1.7,
continua atual.

Captulo 16 Desenvolvendo um Projeto com Joomla! 3.x


Webdesign voc j sabe significa Projeto
para Web. Neste captulo iremos desenvolver
passo-a-passo um webdesign com Joomla!
3.x, desde sua documentao at a publicao no servidor remoto.
Aps minha apresentao no Joomla!Day
Brasil 2012, fui cumprimentado no sentido
de ter documentado todo o processo de
desenvolvimento do case apresentado.
Acredite ou no, infelizmente a maioria dos
profissionais no documentam nada e isso
acarreta prejuzos no decorrer da vida til do
projeto.
A sequncia para o desenvolvimento do projeto, pode variar dependendo do tamanho da
equipe empenhada. Entretanto, no importa
se temos uma equipe ou euquipe, fundamental documentar todo o processo.

358/683

Desenvolveremos um projeto simples e fictcio. Porm, a lgica empregada e os recursos


utilizados serviro de base, para que voc
desenvolva qualquer projeto futuro de
pequeno, mdio ou grande porte, desde que
no seja necessrio o desenvolvimento de extenses, que no foco deste livro.
Leia atentamente as frases abaixo e reflita,
antes de iniciar o seu projeto.
O projeto deve ser desenvolvido para o
pblico-alvo do cliente e no para a google.
O usurio/internauta a principal razo de
ser do site.
Na web a simplicidade, sempre vence a complexidade. Jakob Nielsen
Na web, o contedo Rei. Jakob Nielsen
Documente todo o processo de desenvolvimento do projeto. #FicaDica
Ciclo de Desenvolvimento do Projeto

359/683

Vamos seguir um ciclo simples, porm eficiente, para o desenvolvimento de nosso projeto:
Levantamento de Requisitos primeiro ato
do processo, busca identificar todas as aspiraes do cliente em relao ao site, alm de
identificar o pblico-alvo e mercado vertical
do projeto. Pode ser por email ou vdeo-conferncia, para clientes que no residam na
sua cidade. Evite telefonemas, palavras se
perdem no vento. Caso contrrio, ou seja: o
cliente mora na sua cidade, agende uma reunio presencial.
O levantamento de requisitos o momento
do brainstorming (literalmente: "tempestade
cerebral" em ingls) ou tempestade de ideias,
que ir surgir em prol do sucesso do projeto.
Identifique todos os pontos crticos do projeto, saber:
Domnio o cliente possui domnio registrado?
sim

360/683

tem acesso edio do DNS? Caso negativo,


verifique quem tem acesso ou oficialize a
quem de direito. Caso contrrio, no conseguir publicar o site. Por exemplo em uma
mudana de Host.
no
o cliente tem um nome em mente? Oriente o
cliente quanto ao domnio, cuidado com sopa
de letrinhas. Por exemplo:abdyj.com.br
quem efetuar o registro? Se o cliente delegar voc, seja tico(a), no prenda o
domnio do cliente voc ou sua agncia. O
domnio dele e.
Hospedagem o cliente possui um servio
de hospedagem?
sim
verificar se atende aos requisitos do Joomla
no
ser hospedagem corporativa?
sim verificar se a montagem da mquina
est no escopo do desenvolvimento do

361/683

projeto.
no
qual empresa indicar?
tenho uma revenda e irei utilizar.
Template qual ser a metodologia de aplicao do template?
customizao
criao do zero
desenvolvimento a partir de um layout (html
+ css)
desenvolvimento a partir de uma imagem
(.psd, .cdr, e etc...)
utilizao de template comercial (clube de
templates)
Instalao do Joomla qual a melhor forma
de instalar o Joomla?
com exemplos de contedo
sem exemplos de contedo
Lembre-se que templates comerciais so
fornecidos com pacotes QuickStart que por

362/683

padro, foram a instalao de exemplos de


contedo.
Desenvolvimento de Extenses ser necessrio o desenvolvimento de alguma extenso do tipo componente, mdulo ou plugin?
O JED atende todas as demandas do projeto
Ser necessrio desenvolver uma ou mais extenses
Ser necessria a terceirizao de desenvolvimento de extenses.
Webmarketing o cliente possui uma poltica de webmarketing?
sim ir contratar empresa especializada
no
qual o melhor programa para o cliente? Adwords? Adsense? Nenhum? Em qualquer das
hipteses, lembre-se que o Joomla! 3.x por si
s, potencialmente favorvel aos buscadores e o simples fato de preencher

363/683

corretamente os metadados de artigos, mdulos, categorias, menus e etc... iro ajudar


consideravelmente na indexao do site do
cliente.
Anote tudo, pois ser a base documento de
viso, que dever ser homologado pelo cliente. Muito cuidado para no vender elefante voando;
Documento de Viso - O Documento de
Viso previsto no RUP fornece uma base de
alto nvel delimitando o escopo do projeto.
Captura restries de design e requisitos de
nvel muito elevado para que o leitor possa
compreender o projeto a ser desenvolvido.
Ele fornece informaes para o processo de
aprovao do projeto e, portanto, est intrinsecamente relacionado ao servio a ser entregue. Ele comunica os principais questionamentos relacionados ao projeto e funciona
como um regulador com base no qual todas
as decises futuras devero ser validadas.

364/683

Desenvolvimento do Projeto o desenvolvimento abrange as etapas previstas no Webdesign (design de pgina, design de site e
design de contedo) e ocorrem de forma independente. Ou seja, no existe a necessidade de esperar a concluso de uma etapa
para iniciar-se outra. Ex: Aguardar a concluso do template para iniciar a criao de
categorias e artigos.
Considere deixar disponvel uma verso piloto, em ambiente que possa ser compartilhado pelo cliente, fim acompanhamento e
homologao.
Entrega/Pagamento Opte pela entrega
modular em substituio ao tradicional 50%
no incio e 50% na publicao.
A entrega modular permite um melhor
acompanhamento, documentao e homologao, evitando querncias descabidas por
parte do cliente.
Publicao O pice de um projeto web a
sua publicao na Internet e geralmente

365/683

usando Joomla!, temos dois tipos de publicao:


Com Akeeba Akeeba um componente de
backup que gera um pacote compactado do
site, contendo arquivos, diretrios e banco
de dados, alm di instalador. A publicao de
um site a partir de um pacote do Akeeba,
segue os seguintes passos:
transferir o pacote zipado para o servidor de
hospedagem;
descompactar o pacote no servidor, via
Painel de Controle; e
seguir a sequncia de instalao sugerida
pelo componente.
Caso o provedor no possua servio de
descompactao via painel de controle, faaa localmente e use um programa de FTP
(filezilla, Fireftp, Cutftp e etc...) para transferir os arquivos e diretrios do site.
Sem Akeeba se voc no estiver utilizando
o Akeeba, sinceramente no consigo

366/683

entender o motivo, os passos para a publicao do site em servidor remoto, sero os


seguintes:
No ambiente local (sua mquina)
acesse o phpmyadmin e exporte todas as tabelas do banco de dados do site;
usando o programa de FTP de sua preferncia, transfira todos os arquivos e diretrios
para o servidor remoto; e
ajuste as diretivas de conexo ao banco de
dados remoto, bem como o caminho dos
diretrios /tmp e /log do site.
No ambiente remoto (servidor web)
acesse o phpmyadmin e importe todas as tabelas do banco de dados do site;
digite o endereo do site no navegador; e
acesse o back-end para ajustes que se fizerem necessrios.
Acesse http://www.livrodejoomla.com.br/
insumos/?#a6 e baixe o infogrfico de

367/683

publicao de um site Joomla! O documento


serve para qualquer verso do CMS.
Implementao de Segurana aps a publicao fundamental implementar polticas
rgidas de segurana no site, que englobem
no mnimo:
encapsulamento do diretrio de administrao;
permisses de diretrios e arquivos; e
checagem do usurio e senha de acesso ao
back-end. Suporte / Manuteno Quer
suporte? Compra uma escada. Bela frase,
mas no podemos us-la em desenvolvimento de projeto web. No documento de
viso deve-se prever dentre outras coisas, o
que ser do site aps a publicao. Quem vai
gerenciar o contedo com atualizaes constantes? Quem dar suporte para atualizao
de verso, novas funcionalidades, bugs e
etc...? Tudo isso tem que estar previsto.
Uma boa prtica que uso e recomendo,
disponibilizar no back-end, vdeo-tutoriais

368/683

explicando o funcionamento de cada parte


do site, sem entrar no mrito do CMS em s.
Levantamento de Requisitos
Os requisitos de nosso projeto foram levantados, o site a ser desenvolvido dever
atender ao pblico brasileiro, espanhol,
francs e americano (multi-idiomas). Pertence ao mercado vertical Ensino/Educao
e o escopo voltado ao segmento escola.
Acesse http://www.livrodejoomla.com.br/
insumos/?#a7 e baixe um modelo de documento de viso. Se desejar, use como base de
proposta para seus projetos.
Desenvolvimento do Projeto
Acesse
http://www.joomla.org/download.html e baixe a ltima verso estvel do
Joomla! 3.x.
Todos
os
arquivos
necessrios
ao

369/683

desenvolvimento do projeto podem ser baixados em http://www.livrodejoomla.com.br/


insumos
Vamos iniciar, criando o diretrio escola em
nossa mquina local e fazendo a instalao
do Joomla! 3.x com exemplo de contedos
do tipo Padro.
A imagem abaixo representa o front-end do
site aps a instalao padro.
figura: Template padro do Joomla! 3.x

370/683

Analisando o documento de viso, percebemos que o layout proposto para o template


mster, possui algumas semelhanas com o
template padro Protostar do Joomla! A
melhor opo ser utilizar a metodologia de
customizao do template padro, de acordo
com o proposto no documento de viso.
Perceba a necessidade de serem implementadas funcionalidades relacionadas
acessibilidade, no template, previstas no
documento de viso.
O documento de viso prev ainda, dois layouts diferentes:
uma rea chamada Blog; e
uma rea chamada Corpo Docente.
Utilizaremos a tcnica de associao de temas, para suprir a demanda. O template a ser
utilizado no Blog, ser o template livre SJ,
que baixamos da Internet. O template SJ, deve ser instalado juntamente com o plugin YT
Framework e ser customizado de acordo

371/683

com as demandas previstas para o Blog.


Para o Corpo Docente, utilizaremos o template Beez_20, que transformamos no
captulo 15.
figura: Template proposto documento de viso

372/683

figura: Template SJ padro do Blog

A cada etapa do desenvolvimento, iremos


identificar qual a sua relao com o contexto
do webdesign.
Etapa nr 1 - Design de Site
Nesta etapa iremos abordar as seguintes
aes relacionadas ao projeto:
Preparao da estrutura de multi-idiomas.
muito importante perceber ainda na fase de
planejamento, a necessidade ou no, do projeto ser dotado de recursos de multi-idiomas;
Criao de poltica de ACL;
Cadastro de usurios;

373/683

Configuraes Globais do Site; e


Configuraes Globais do site para artigos.
Exerccio nr 1 Estrutura do multi-idiomas

Joomla! 3.x possui o recurso de multi-idiomas, nativamente. Porm, algumas aes so


necessrias
para
o
seu
perfeito
funcionamento.
Instalao dos pacotes de idioma
Aps a instalao do Joomla, vamos preparar a estrutura de multi-idiomas do site.
Releia o captulo 12 caso esteja com dvidas.
Se precisar, baixe os pacotes de idiomas em:
http://www.livrodejoomla.com.br/insumos/
?a#8
O pacote de idiomas ingls no precisa ser
baixado, tendo em vista ser instalado por
padro, com o Joomla!
Pacotes instalados, vamos definir o idioma
padro para o back-end e front-end do site,
atravs do menu superior ou cone rpido

374/683

Language Manager. Defina o idioma Pt-BR,


para ser o padro do nosso projeto.
figura: Idiomas instalados

Criao de idiomas de contedo


Para cada idioma instalado, devemos criar
seus idiomas de contedo. Esses idiomas
podero ser selecionados, quando da criao
de novos artigos.
Para criarmos um idioma de contedo, basta
acessar o gerenciamento de idiomas e na aba
esquerda, clicar sobre o link Contedo e
Novo.

375/683

figura: Criando idiomas de contedo

Os idiomas de contedo seguem um padro


bsico de parmetros a serem preenchidos,
destacando-se:
Ttulo o nome do idiomas que ser apresentado na lista de idiomas do site;
Ttulo Nativo o ttulo nativo do idioma, reservado ao sistema;
Cdigo URL de Idioma ser adicionado a
URL do site. Por exemplo: Com SEF ativo a
URL ser algo do tipo seusite.com.br/pt-br e
com URL dinmica, ser algo do tipo
&Lang=pt-br;

376/683

Prefixo da imagem o nome da bandeirinha


do idioma. Normalmente uma imagem (.gif)
nomeada com as iniciais do idioma. Ex:
en.gif. A bandeira do Brasil uma exceo,
tendo sido nomeada pt_br.gif;
Tag de Idioma a tag de idioma deve ser
composta pelo prefixo do idioma acompanhado da identificao do pas, em maisculo.
Por Exemplo: pt-BR;
Estado o estado do idioma, se publicado ou
no; e
Nvel de acesso o nvel de acesso ao
idioma.
Aps criar os idiomas de contedo para o
nosso projeto, clique em ordem para
reorden-los. Perceba que o idioma ingls
est com o nr 1, altere para o idioma portugus e salve a ordenao.

377/683

figura: Idiomas de contedo criados e reordenados

Habilitao do plugin de idiomas


O prximo passo ser a habilitao do plugin
Sistema Filtro de Idioma. O processo
simples, acesse o gerenciamento de plugins,
use o filtro para selecionar os plugins no
publicados e publique o plugin de filtro de
idioma.
Habilitao do mdulo Status do multiidiomas
O ltimo passo na verificao da estrutura
publicar o mdulo administrativo Multilanguage Status. Acesse o gerenciamento de
mdulos, escolha administrador no filtro
esquerda e busque pelo mdulo Multilanguage Status, basta public-lo.

378/683

O mdulo poder visualizado esquerda e


baixo do template administrativo sis.
figura: Mdulo multilanguage publicado

Clique sobre o link Estdo do Multi-idioma


para verificar a situao da estrutura do
multi-idiomas do site. Observe a imagem
abaixo, ela apresenta a situao atual que
aponta para um site multi-idiomas, que deve
apresentar a seguinte situao:
Idiomas de Site Publicados OK;
Idiomas de Contedo Publicados OK; e
Pginas Iniciais padro publicados Artigos
de pgina inicial, de cada idioma. No publicados. Os artigos sero publicados durante
o design de contedo do projeto.
Caso o seu site no esteja de acordo com a
imagem, verifique a criao dos idiomas de
contedo, particularmente no tocante a tag
de idioma.

379/683

figura: Estrutura de multi-idiomas do site

Exerccio nr 2 Poltica de ACL

A prtica leva excelncia. Que tal relermos


o captulo 9 do livro? Usaremos para o projeto, a poltica de ACL que foi explanada
anteriormente.
Exerccio nr 3 Cadastro de Usurios

Crie os usurios, de acordo com o explanado


no captulo 9.
Exerccio nr 4 Configuraes Globais do Site

Os parmetros sero os mesmos utilizados


no captulo 6 do livro.
Exerccio nr 5 Configuraes Globais do Site para Contedo

380/683

Os parmetros sero os mesmos utilizados


no captulo 10 do livro.
Etapa nr 2 - Design de Pgina
Nesta etapa iremos trabalhar com a customizao dos templates previstos no escopo do
projeto. Sero utilizados 03 (trs) templates
e as customizaes sero focadas nos
seguintes pontos:
Template principal customizao da pgina de erro, criao de posio de mdulo e
alterao do logotipo padro; e
Template do corpo docente customizao
da folha de estilos do template relacionado
ao item de menu professores.
Exerccio nr 1 Criao de um Logotipo para o Projeto

Ensinar a criar um logotipo, foge do escopo


deste livro. Existem vrios programas que
auxiliam nesta tarefa e usarei o Adobe Fireworks. Aps viajar pelo mundo da

381/683

imaginao, desenvolvi o logotipo demonstrado na imagem seguinte, para representar


a Escola Expresso do Saber.
figura: logotipo da escola [arquivo logo-limpo.png]

O logotipo foi desenvolvido a partir de uma


imagem cilndrica com tonalidade pastel e
gradiente linear, com outra em sobreposio.
A segunda imagem foi distorcida para lembrar um arco e no vazio da primeira imagem
as iniciais da escola foram destacadas em
branco sobre fundo preto. Adicionou-se uma
imagem de trem bala, para fazer referncia
ao termo: Expresso.
Criei tambm, um logotipo com slogan, que
ser utilizado no template master do projeto.
Voc deve baixar o logotipo em http://www.livrodejoomla.com.br/insumos/
templates

382/683

Caso deseje, poder assistir o vdeo-tutorial


que criei durante o desenvolvimento do logotipo. http://www.livrodejoomla.com.br/insumos/?#a9
Exerccio nr 2 Alterando o logotipo do template master

Este o primeiro exerccio de customizao


de templates e pegarei leve, no iremos interagir com linhas de cdigos.
A maioria dos templates modernos, possuem
a opo de utilizar ou no, uma imagem representativa do negcio, ou seja, o logotipo.
Este parmetro definido na aba opes da
edio de estilos do template.
Para inserirmos o logotipo no template Protostar, padro de nosso projeto, devemos
seguir os seguintes passos:
Acesse o back-end do site e siga pelo menu
superior Extenses Gerenciamento de
Templates Aba Esquerda Styles e clique no

383/683

hiperlink Protostar Default;


Na viso de edio de estilos, clique na aba
Opes;
figura: Aba opes

Esta aba apresenta parmetros de configurao e podem variar de acordo com o template. No caso do Protostar, as opes
avanadas abrangem:

384/683

Cor do Template Cor a ser aplicada em todo o template, deve ser passado o valor hexadecimal da cor. Ex: Se desejar a cor preta, o
hexadecimal ser #000 ou #000000;
Cor de Fundo Cor de fundo a ser aplicada
em layouts estticos, deve ser passado o valor hexadecimal da cor. Ex: Se desejar a cor
preta, o hexadecimal ser #000 ou
#000000;
Logo Logotipo do site. Se no for definida
uma imagem, o ttulo do site ser inserido
por padro;
Ttulo Ttulo alternativo para o site;
Descrio texto opcional a ser exibido
como subttulo;
Fontes da google para Ttulos Usa as fontes
da google para as Tags de ttulo do HTML (
H1, H2 ...H6); e
Layout Fluido voc pode utilizar tanto o
Bootstrap fluido (adapta-se ao tamanho do
monitor), ou esttico. Ambos so responsivos.

385/683

Clique em selecionar, na opo Logo, para


definir o logotipo do site. Faa o upload da
imagem logo-limpo que voc baixou do site
do livro, para o site do projeto;
Aps o trmino do envio (1), clique na imagem (2) para selecion-la (3) e clique em inserir (4) para que a mesma seja setada no
campo da opo Logo;
figura: Inserindo logotipo

Clique em Salvar e Fechar na viso de edio


de estilos; e
Acesse o front-end apertando as teclas ctrl +
f5 para atualizar o site e visualizar a insero

386/683

da imagem.
Essa no a imagem que iremos utilizar no
template mster, esse logotipo ser utilizado
no artigo intitulado Estatuto. Portanto, refaa o processo e insira a imagem logo.png
no template mster.
figura: Logotipo inserido no template mster

Exerccio nr 3 Customizao da pgina de erro do template


Master

muito ruim clicar em algum link e ser redirecionado para uma pgina dizendo algo
parecido com: "Erro artigo no encontrado,
cdigo do erro: #104". O simples fato de
comear com a palavra erro, induz o usurio
a pensar: "caracas, fiz merda." Por qu o espanto? merda mesmo!

387/683

Aproveitarei o livro para apoiar a campanha


da AACD (Associao de Assistncia a Criana Deficiente) e customizaremos a pgina
de erro do projeto, com foco na campanha
deles. Vamos ao passo-a-passo:
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Temas;
Na aba esquerda selecione a opo Templates e clique sobre o hiperlink Protostar
Details and Files;
Na viso Customise Template, clique no
hiperlink Edit error Page template para abrir
o editor de arquivos do Joomla; e
figura: Editando a pgina de erro do template

Acesse http://www.livrodejoomla.com.br/
insumos/?#a10 e baixe a pgina de erro com
foco na AACD. Descompacte, copie todo o
contedo e cole dentro do editor do Joomla,
substituindo o contedo da pgina de erro

388/683

nativa. Clique no boto Salvar e Fechar para


encerrar o processo.
figura: Resultado final no front-end

Caso deseje customizar a pgina de erro de


forma mais direta, acesse por FTP o seu site
e/ou renomeie o arquivo error.php que est

389/683

em /templates/protostar/, substituindo pelo


arquivo error.php, baixado do site.
Exerccio nr 4 Criando uma posio de mdulo no template
Master

Dependendo dos requisitos do projeto e do


template escolhido, voc pode deparar-se
com uma situao complicada. Por exemplo,
a necessidade de uma posio de mdulo que
inexiste no template. Por isso iremos abordar de forma simples, como criar uma nova
posio.
As posies de mdulos so identificadas no
template, por trechos de cdigo especficos.
Ex:
Em contrapartida, todo o contedo que deva
ser renderizado no frame central do template, identificado pelo trecho de cdigo
"include tyoe component".
Dependendo do framework utilizado para

390/683

criar o template, a chamada aos mdulos


pode ser diferente.
Chegou o momento de meter a mo no
cdigo. As operaes de customizao no
template Master, sero as seguintes:
Arquivo principal criao de uma nova
posio no arquivo ndex.php, para visualizao do slide show; e
Pgina de erro customizao da pgina de
erro.
Demonstrarei passo-a-passo, o processo para
criao de uma nova posio de mdulo:
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Temas;
Na aba esquerda selecione a opo Templates e clique sobre o hiperlink Protostar
Details and Files;
Na viso Customise Template, clique no
hiperlink Edit Main Page Template para abrir o editor de arquivos do Joomla;
O nome da posio a ser criada slide e ser
responsvel pela renderizao do mdulo de

391/683

Slide Show, do projeto. Aperte as teclas


ctrl+f para buscar e digite component. Clique
em prximo, o component que nos interessa
o mostrado na imagem abaixo:
figura: Posio component

Precisamos criar uma posio de mdulo,


imediatamente acima do contedo da pgina
inicial. Logo, ela ficar acima do trecho de
cdigo <jdoc:include type=component>.
Perceba na imagem, que o template Protostar possui uma posio chamada position-3, logo acima do message. Copie (ctrl+c)
todo o trecho do cdigo <jdoc:include type=modules name=position-3 style=xhtml> e
cole (ctrl+v), antes do trecho de cdigo <jdoc:include type=component> substitua o
name= position-3 por name=breadcrumbs e

392/683

style=none. Esta ser a posio para nosso


Caminho de migalhas;
Substitua
o
name=
position-3
por
name=slide;
Agora, vamos incluir uma clusula condicionante, visando o processamento do
cdigo,
somente
quando
necessrio.
Dependendo da situao, a no incluso
dessa clusula pode causar problemas. No
o nosso caso pois no iremos estilizar o mdulo, mas, se houvesse uma <div> no contexto da posio, a mesma seria carregada
havendo ou no, um mdulo publicado. Consequncia: buracos no site, sem nenhum
contedo publicado.
Edite a Main Page do template Protostar, inserindo a condicionante antes da posio de
mdulo criada. O cdigo dever ficar
idntico ao demonstrado abaixo:
figura: Nova posio de mdulo no template

393/683

Posies breadcrumbs e slide criadas no template

Clique no boto Salvar e Fechar.


Exerccio nr 5 Transformao de template do Joomla! 2.5 para
Joomla! 3.x

Joomla! 3.x segue a mesma estrutura do


Joomla! 2.x e o pnico de alguns usurios em
torno de seu lanamento tem um pouco de
glamour, um pouco de marketing e muito de
desconhecimento da ferramenta.
Faa uma anlise do Docktype da instalao
de um template do Joomla! 3.x e perceber
que o mesmo do Joomla! 2.x.
A transformao de um template do Joomla!
2.5 extremamente simples, partindo do
princpio que foi desenvolvido dentro dos
padres do CMS, basta mudar a tag extension version, do cabealho do manifesto

394/683

XML. Este manifesto o arquivo templateDetails.xml, que est na raiz de


qualquer template. Observe abaixo a diferena entre os cabealhos:
Joomla! 2.x - <extension version="2.5"
type="template" client="site">
Joomla! 3.x - <extension version="3.0"
type="template" client="site">
Vamos transformar o template beez_20,
padro do Joomla! 2.5, que no Joomla! 3.x
chama-se beez_3, em um template compatvel com Joomla! 3.x. Os passos sero os
seguintes:
baixe o template beez_20 em http://www.livrodejoomla.com.br/insumos/
templates
descompate em sua mquina;
abra o arquivo templateDetails.xml e altere a
tag de cabealho extension version;

395/683

figura: tag extension alterada

compacte novamente todos os arquivos e


diretrios do template, gerando um novo pacote beez_20.zip; e
instale o template em seu site atravs do
Gerenciador de Extenses.
figura: template instalado

Se voc comparar o template beez_20 original do Joomla! 2.x com o que baixou no
site do livro, perceber uma diferena: criei
arquivos de traduo para o portugus do
Brasil no template, fim evitar constantes sem
traduo, no ato da instalao. No quero
que fique com a sensao de erro.

396/683

figura: Criando arquivos de idioma pt-BR para o template

Templates criados com softwares, frameworks e afins, devem seguir o mesmo


padro. Alis, sonho com o dia em que os
usurios iro entender que template to
somente a camada de viso. Neste dia, eles
deixaro de gastar com cursos de templates e
passaro a utilizar apenas sua criatividade,
aliada uma IDE ou framework.
Webdesign no um dom divino e ningum
nasce webdesigner. Porm, design grfico
depende e muito, do dom de desenhar. Logo,
se algum teve o dom, esse algum foi do designer grfico, jamais o webdesigner.

397/683

Exerccio nr 6 Alterao da imagem de fundo do topo do template beez_20

Aps instalar o template beez_20 no site,


defina-o por padro seguindo o menu superior Extenses Gerenciamento de Templates Aba Esquerda Styles e clique na estrela defronte ao template bezz_20.
Perceba que por padro o layout utilizado foi
o Nature, vamos alterar para o Personal. Na
aba esquerda do gerenciamento de templates, clique em Styles e sobre o nome
beez_20 Padro.
Na viso de edio do estilo, vamos configurar corretamente o template beez_20. Na aba
opes, no parmetro Cor do Template,
escolha personalizado. Aps essa operao,
clique em salvar e fechar.
Opes do template
Alterao de imagem de fundo do topo de
um template uma demanda comum em
projetos e por isso irei abordar um exemplo

398/683

de customizao de imagens de fundo utilizadas em topos.


Existem muitas formas de alterar a imagem
de fundo de um template, vou citar apenas
02 (duas), que penso serem as mais utilizadas. Por questes de performance, usaremos
a segunda opo.
1 opo: Substituir a imagem por outra com
mesmo tamanho, extenso e nome; ou
2 opo: Identificar quem chama a imagem
(ndex.php ou folha de estilos) e fazer a alterao. Neste caso, voc poder interagir com o
tamanho, nome e extenso, mudando a seu
bel prazer, desde que fique atento quanto as
DIVS do template e suas estilizaes.
O primeiro passo ser identificarmos qual o
contexto da imagem dentro do template.
Est sendo chamada pelo arquivo principal
do template? Est sendo chamada pela folha
de estilos? Os questionamenstos sero respondidos pelo Firebug, que um

399/683

complemento para o Firefox. Acesse http://www.livrodejoomla.com.br/insumos/


?#a11 e visite os sites dos desenvolvedores
para baixar as verses atuais dos programas.
O processo para mudana da imagem de
fundo do template bem simples. Basicamente, voc abre a pgina com o Firefox,
clica em Ferramentas Firebug Abrir
Firebug e comea a utilizar o programa.
Vamos ao passo-a-passo da mudana da imagem do topo do template bezz_20.
figura: Firebug em ao

Clique no cone do inseto, direita e acima,


para iniciar o Firebug;
Clique no cone ao lado do inseto para

400/683

selecionar a rea a ser inspecionada;


Passe o mouse sobre a rea que deseja inspecionar e d um clique. Em nosso caso, a imagem de fundo;
Observe que dentro do cdigo do arquivo ndex.php, representado pela aba HTML,
temos apenas <div class="logoheader"> representando uma DIV que herda a estilizao
grfica da classe logoheader. Ou seja, a imagem no est sendo chamada pelo arquivo
PHP. Ento, quem chama a imagem?
Observe direita, o seguinte pedao de
cdigo: .logoheader { background: url("../
images/personal/personal2.png").
A imagem est sendo chamada pelo arquivo
personal.css, ou seja, uma folha de estilos. O
nome da imagem personal2.png, imagem
de fundo da classe logoheader e est no
diretrio images/personal do template.
Acesse o back-end e navegue pelo superior
Extenses Gerenciamento de Templates

401/683

Template Manager. Na aba esquerda do gerenciamento de templates, clique em Templates. O Beez_20 est logo abaixo do Beez3,
notou a semelhana? Observe o layout
grfico e o desenvolvedor, o mesmo template, apenas modificado para a verso 3.
figura: Editando os arquivos do template Beez_20

Clique no hiperlink Beez_20 Details and


Files para acessar a rea de customizao do
template. So as seguintes, as opes de
edio/customizao:
Opes esquerda
Edio/customizao de reas comuns do

402/683

template, divididas em:


Edit main Page editar a pgina inicial, index.php, do template;
Edit error page template editar a pgina de
erro do template; e
Edit print view template editar a forma de
impresso do template.
Opes direita
Edio/customizao da(s) folha(s) de estilos.
direita, utilizando a barra de rolagem do
seu navegador, identifique a folha de estilos
personal.css e clique sobre Edit css/personal.css. O arquivo ser aberto para permitir a
edio.
O Joomla! possui seu prprio editor, logo, se
voc conhece HTML, PHP, JAVASCRIPT e
CSS, no precisar de outro para customizar
seu template. Dentro do editor aperte as teclas ctrl+f para permitir a busca dentro do
cdigo. O Firefox apresenta uma aba esquerda e abaixo, o IE apresenta uma aba

403/683

direita e acima. Busque pelo nome da classe


.logoheader ou pelo nome da imagem personal2.png. Aps encontrar, substitua personal2.png por docente.png e clique em salvar e fechar.
figura: Substituindo a imagem de fundo

Acesse o front-end do site e aperte as teclas


ctrl+f5 para atualiz-lo e a imagem deve desaparecer. Caso continue aparecendo, reveja

404/683

o processo.
Acesse http://www.livrodejoomla.com.br/
insumos/templates e baixe a imagem docente.png. Aps fazer o download, transfira a
imagem para o site de seu projeto. Ela deve
ficar em /templates/beez_20/images/personal/
Acesse o front-end e aperte as teclas ctrl+f5
para atualizar o site e visualizar a nova imagem.
Terminada a customizao, vamos voltar o
template Protostar, para padro do site.
Beez_20 ser utilizado apenas na rea Corpo
Docente do nosso projeto final, que ser relacionada ao item de menu Professores. Ficar
a seu critrio, a apresentao dos mdulos,
de acordo com o projeto final publicado na
Internet.
Acesse o back-end do site e siga pelo menu
superior Extenses Gerenciamento de
Templates Aba Esquerda Styles e clique na
estrela defronte ao template Protostar.

405/683

Etapa nr 3 - Design de Contedo


Nesta etapa iremos comear o design de contedo e para tal, releia o captulo 10, se for o
caso, para aplicar as configuraes globais do
site em relao ao contedo, inserir imagens
e/ou vdeos e configurar corretamente o plugin do editor TinyMCE.
Vamos criar as categorias, subcategorias e
artigos, de acordo com o documento de viso
do projeto.
Lembre-se que estamos desenvolvendo um
projeto multi-idiomas, logo, as categorias devem ser criadas nos idiomas portugus,
ingls, espanhol e francs. Fim evitar repeties desnecessrias, abordarei no livro,
apenas o idioma portugus. Entretanto, o
site publicado na Internet estar completo,
com todos os idiomas.
O processo o mesmo. Digite o nome da categoria no idioma desejado (ingls, espanhol

406/683

ou francs) e da mesma forma, selecione o


idioma alvo na aba Detalhes da viso de criao de categoria.
figura: Estrutura de contedo do projeto

Exerccio nr 1 Criao das categorias

So as seguintes as categorias e subcategorias do nosso projeto:


Notcias
Acadmicas
Gerais

407/683

Blog
Tutores
Colunistas
Para cri-las, seguiremos os seguintes passos:
Acesse o back-end e navegue pelo menu superior Contedo Gerenciamento de Categorias Nova Categoria, ou clique no cone
rpido Gerenciador de Categorias;
As acategorias sero criadas na viso Adicionar Categorias de Artigos. Existem alguns
parmetros repetitivos e que devem ser aplicados de acordo com o escopo de cada projeto e seria invivel reproduzi-los no livro,
por exemplo o parmetro Opes de MetaDados. Este parmetro deve ser preenchido
em todas as oportunidades, de acordo com a
poltica de webmarketing do seu site. Em
nosso projeto, criarei meta-Dados a ttulo de
exemplo, apenas para a categoria Notcias.

408/683

Clique em Novo e crie a categoria Notcias,


com as seguintes caractersticas:
Aba Detalhes
Ttulo Notcias
Apelido deixe em branco (ser preenchido
automaticamente pelo Joomla!)
Descrio Deixe em branco (no ser necessrio)
Pai Nenhum Pai
Estado Publicado
Idioma - Portugus
Aba Opes
Layout Alternativo Usar Global
Imagem Deixe em branco
Nota Deixe em branco
Aba Opes de Meta-Dados
Descrio Notcias da escola expresso do
saber
Palavras-chave fique por dentro das

409/683

notcias da escola expresso do saber


Autor Deixe em branco
Robs Indexar, No seguir
Aba Permisses
O grupo Blog, criado de acordo com o
captulo 9, no deve ter nenhum tipo de
acesso categoria Notcias. Voc perceber
que por padro o grupo tem acesso total
tendo em vista herdar as permisses, do
grupo pai, Manager. Clique sobre o nome do
grupo esquerda e no campo de seleo,
defina a negao total de acesso.
Aps a criao da categoria, clique em Salvar
Como para criar uma cpia da categoria
Notcias;
Renomeie a cpia para Acadmicas e no
parmetro pai da Aba Detalhes, selecione
Notcias e no parmetro Idiomas selecione
Portugus. A subcategoria herdar os parmetros da categoria pai, Notcias. Clique em
Salvar Como e renomeie a nova categoria

410/683

para Gerais, mantendo todos os parmetros


copiados;
Crie a categoria Blog, atentando para o fato
da mesma no possuir categoria pai e na aba
permisses, negue o acesso ao grupo Publisher, permitindo acesso total ao grupo
Blog;
Crie as categorias Tutores e Colunistas, atentando para o fato de serem filhas da categoria Blog. Ambas, herdaro automaticamente os parmetros da categoria pai;
Copie as categorias criadas para o idioma
ingls;
Copie as categorias criadas para o idioma espanhol; e
Copie as categorias criadas para o idioma
francs.
Perceba na prxima imagem a estrutura
completa do nosso site, com todas as categorias e subcategrias criadas.
Trabalhoso concorda? Mas, no tenha dvidas, melhor desenvolver um projeto multi-

411/683

idiomas baseado em planejamento e utilizando a estrutura nativa do Joomla! As


tradues literais de mdulos baseados na
google Translator, no so as melhores
opes. Imagine o quanto a credibilidade
pode ser abalada por uma traduo incorreta
e/ou fora do escopo do artigo.

412/683

figura: Categorias criadas

Exerccio nr 2 Criao dos artigos

Antes de falarmos de criao de artigos, vamos relembrar alguns conceitos e dicas de


webdesign relacionados ao design de

413/683

contedo:
O texto deve conter no mximo 02 pargrafos e a opo de Leia +;
O texto deve estar alinhado esquerda;
Todas as imagens que fazem parte do texto,
devem possuir uma descrio. (TAG alt do
HTML);
A tecla (enter) ser utilizada para criar um
novo pargrafo no texto. (TAG
do HTML);
O uso das teclas (enter + shift) permitiro
pular uma linha no texto. (TAG </br> do
HTML);
Jamais copie (ctrl+c) um texto do Microsoft
Word e cole (ctrl+v) diretamente no editor
de texto do Joomla! Use o boto Paste From
Word, do prprio editor TinyMCE e cole no
editor que ser aberto; e

414/683

figura: colando artigo do word

Use uma nica fonte (tipo de letra) para todos os artigos do site.

So os seguintes os artigos a serem criados


dentro das respectivas categorias e subcategorias do nosso projeto:
Sem categoria
Estatuto
Bem-vindos
Notcias
Acadmicas
Matrculas abertas
Gerais
Artigo nr 1

415/683

Artigo nr 2
Blog
Tutores
Artigo de apresentao
Colunistas
Artigo de apresentao
Destaco os artigos Estatuto e Bem-vindos,
que contaro com sistema de ncoras e insero de vdeo no texto.
Lembro que cada artigo deve ser criado em
todos os idiomas do projeto e no livro, abordarei a criao dos artigos no idioma portugus. Os insumos esto disponveis no site
do livro: http://www.livrodejoomla.com.br/
insumos/?#a12
Para criar o artigo Bem-vindos, seguiremos
os seguintes passos:
Acesse o back-end e navegue pelo menu superior Contedo Gerenciador de Artigos

416/683

Novo Artigo, ou clique no cone rpido Gerenciador de Artigos. O primeiro artigo a ser
criado, Bem-vindos, pertence a categoria Uncategorized (sem categoria) e ser artigo inicial de nosso site multi-idiomas;
No pasta artigos que voc baixou do site, existem subpastas divididas por idiomas.
Clique na pasta pt-BR, abra o arquivo Bemvindos, selecione o texto (ctrl+a), copie
(ctrl+c) e cole (ctrl+v) no editor de texto do
Joomla, todo o contedo;
Perceba que o ttulo do artigo foi copiado
para o corpo do editor. Selecione este pedao, copie e cole na opo ttulo do editor e
mantehna a categoria Uncategorised. Retire
os espaos entre os pargrafos utilizando a
tecla (del) e use a tecla (enter) para cri-los
novamente.
Insira o Leia mais depois da palavra pretendidos do segundo pargrafo, clicando no
boto Leia Mais, no rodap do editor de
texto. Uma linha pontilhada vermelha

417/683

surgir, demonstrando o local do ponto de


corte. Caso deseje excluir o Leia Mais, ou alterar o local, basta clicar no boto HTML do
editor, procurar, alterar ou excluir do texto, a
linha ( <hr id="system-readmore" /> );
Clique com o mouse no incio do artigo e insira a imagem logo-limpo.png, alinhada esquerda e com a descrio Logo da escola.
No acredito que voc j esqueceu os passos
para inserir a imagem. Releia o captulo 10,
item Inserindo imagens nos artigos e bola
pra frente;
Em Detalhes, direita, escolha o idioma Portugus;
Na aba Opes de Publicao no irei alterar
nada;
Partindo do princpio que voc configurou
globalmente, os parmetros globais de contedo, para o site, no iremos alterar nenhuma opo nas abas Opes do Artigo e
Configurar Tela de Edio;
Na aba Opes de Meta-dados iremos

418/683

preencher com informaes relevantes para


as mquinas de busca. Lembre-se das melhores prticas:
Descrio descrio curta do artigo em at
25 palavras;
Palavras-chave 06 frases curtas relacionadas ao artigo, no precisa usar (;);
Robs normalmente ser utilizada a opo
Indexar, No seguir;
Autor o seu nome;
Direitos de Contedo cite, se for o caso, a
licena do contedo; e
Referncia Externa cite, as fontes, se for o
caso; e
Clique em Salvar e Fechar.
O artigo Bem-vindos ser o artigo de pgina
inicial e portanto, responsvel pela carga do
site multi-idiomas. Marque o checkbox esquerda do nome do artigo e na barra de ferramentas, clique no boto Carga (1), para copiar o artigo.

419/683

O artigo Bem-vindos ser o artigo de pgina


inicial e portanto, responsvel pela carga do
site multi-idiomas. Marque o checkbox esquerda do nome do artigo e na barra de ferramentas, clique no boto Carga (1), para copiar o artigo.
figura: Copiando artigos

Observe a imagem, aps clicar no boto


Carga, ser aberto um formulrio, com
opes relacionadas cpia.
Definir Nvel de Acesso mantenha o nvel
original do artigo a ser copiado;

420/683

Definir Idioma altere para o idioma ingls;


Selecione a Categoria para Mover/Copiar
mantenha a categoriaUncategorisde;
Copiar / Mover Defina Copiar; e
Cancelar / Processar clique no boto processar.
Repita o processo para os idiomas Francs e
Espanhol e ao final, teremos 04 artigos Bemvindos, segmentados nos 04 idiomas do site.
Acesse a pasta de insumos que voc baixou e
para cada idioma, exceto portugus, copie o
texto do artigo e substitua, no editor do
Joomla, o ttulo e contedo dos mesmos. O
resultado final dever ser parecido com o
demonstrado abaixo:
figura: Artigo em vrios idiomas

421/683

O artigo Estatuto no contar com a opo


Leia mais, tendo em vista que ser renderizado a partir de um item de menu. Porm, fim
melhorar a navegao, criaremos um ndice
com sistema de ncoras.
Para criar inserir ncoras no artigo Estatuto,
seguiremos os seguintes passos:
Acesse o back-end e navegue pelo menu superior Contedo Gerenciador de Artigos
Novo Artigo, ou clique no cone rpido Gerenciador de Artigos. O artigo tambm pertence a categoria Uncategorized (sem categoria);
No pasta artigos que voc baixou do site, existem subpastas divididas por idiomas.
Clique na pasta pt-BR, abra o arquivo Estatuto, selecione o texto (ctrl+a), copie (ctrl+c)
e cole (ctrl+v) no editor de texto do Joomla,
todo o contedo;
Perceba que o ttulo do artigo foi copiado
para o corpo do editor. Selecione este pedao, copie e cole na opo ttulo do editor e

422/683

mantehna a categoria Uncategorised;


Para criarmos as ncoras faremos o seguinte:
Posicione o cursor do mouse no incio do 1
pargrafo, selecione a primeira palavra e
clique na imagem de ncora do editor de
texto;
Nomeie a ncora na caixa popup. Por exemplo: ncora1;
No ndice, selecione todo o texto do primeiro
pargrafo e clique no boto de inserir hiperlink, uma corrente;
Na caixa popup que ser aberta, deixe a
opo Link URL em branco e selecione a
ncora criada na opo Anchors; e
Preencha os parmetros relacionados ao
hiperlink.

423/683

figura: ncora criada

Repita o processo para todos os pargrafos


do artigo e no se esquea de criar os estatutos nos outros idiomas. A prtica leva
perfeio.
Exerccio nr 3 Criando menus

O prximo passo ser criarmos menus para


cada idioma do site. Seguiremos o seguinte
roteiro:
Acesse o back-end e navegue pelo menu

424/683

superior Menus Gerenciador de Menus


Adicionar Novo Menu, ou clique no cone
rpido Gerenciador de Menus. O primeiro
menu a ser criado, ser o Menu Portugus;
Na aba Detalhes, preencha os campos da
seguinte forma:
Ttulo - menuportugues;
Menu menu portugus; e
Descrio menu para o idioma portugus
do Brasil.
Clique em Salvar e Novo, repita o processo
paras os outros idiomas e ao final clique em
Salvar e Fechar. Voc deve observar algo
parecido com a imagem abaixo.

425/683

figura: Menus criados

Exerccio nr 4 Criando itens de menus

Aps criarmos os menus, criaremos os itens


de menus (botes) relacionados aos mesmos.
Esses primeiros itens sero responsveis
pelo funcionamento do relacionamento de
contedos do site multi-idiomas. Seguiremos
o seguinte roteiro:
esquerda do Gerenciador de Menus, temos
o hiperlink Itens de Menu, clique sobre ele;

426/683

Clique no boto Novo, direita e acima e na


viso Gerenciador de Menus: Novo Item de
Menu, preencha as opes da seguinte
forma:
Aba Detalhes
Tipo de Iten de Menu Selecione Artigo
nico Artigo. Perceba que surgiu uma nova
opo abaixo, denominada Selecione um
Artigo. Clique em Selecionar e escolha o
artigo Bem-vindos ... no idioma portugus;
Ttulo do Menu O ttulo do item ser Incio;
Apelido deixe em branco;
Link no est passvel de edio;
Localizao do Menu selecione menuportugues;
tem Pai no altere;
Nvel de Acesso public;
Pgina Inicial Sim;
Janela Destino Pai;
Tema Destino Usar Padro; e

427/683

Idioma Portugus.
Aba Opes Avanadas
Opes do Artigo Partindo do princpio
que voc configurou globalmente, os parmetros globais de contedo, para o site, no
iremos alterar nenhuma opo;
Opes de Tipos de Link Sem alterao.
Perceba o parmetro Imagem do Link, aqui
que inserimos uma imagem no link, se for
necessrio;
Opes de Exibio de Pgina esses parmetros esto relacionados ao SEO:
Ttulo no Navegador o texto a ser exibido
no navegador. Se ficar em branco, usar o
padro definido nas configuraes globais;
Cabealho da Pgina se for definido Sim, o
ttulo associado ao item ser apresentado. O
padro No;
Classe da Pgina uma classe CSS exclusiva
para esse item. Em branco, ser utilizada a
classe padro do template.

428/683

Opes de Meta-Dados aes para ajudar


na indexao pelos mecanismos de busca.
Vale a mesma dica de configurao dos artigos. Perceba o parmetro Seguro, ele deve
ser utilizado, se e somente se, este item de
menu utilizar SSL. Geralmente o protocolo
SSL utilizado exclusivamente no acesso e
utilizao do back-end;
Aba Mdulo de Atribuio deste tem de
Menu
No iremos atribuir nenhum mdulo ao item
de menu.
Clique em Salvar e Fechar e esquerda do
Gerenciador de Menus, perceba que temos
um filro. O menu selecionado por padro o
Main Menu. Selecione o Menu Portugus e
verifique o item registrado e com a bandeirinha do Brasil. Lindo quando tudo funciona!

429/683

figura: Artigo inicial do menu portugus

Repita o processo para os outros idiomas,


mantendo a seguinte nomenclatura para os
tens:
Menu Ingls - Home;
Menu Espanhol - Casa;
Menu Francs Maison;
Lembre-se que os artigos devem ser selecionados de acordo com o idioma. Se desejar,
de forma anloga aos artigos, utilize o boto
Carga para copiar. Cuidado, ateno aos
campos nico Artigo (verifique o idioma),
Localizao do Menu (verifique se o menu
est correto), Destaque (o artigo deve ser
destaque) e Idiomas (verifique se o idioma
do item est correto), na aba Detalhes e mais
uma vez, selecione o nico Artigo, de acordo
com o idioma. A qualquer momento clicando

430/683

no menu desejado, pode-se tornar o artigo,


um destaque.
Ao final do processo navegue pelo menu superior Menus, que dever estar de acordo
com a imagem abaixo:
figura: Menu multi-idomas

Caso no esteja visualizando as bandeirinhas, refaa o exerccio com especial ateno


ao menu, opo destaque e idioma de cada
item.
Exerccio nr 5 Criando categoria de contato

431/683

Vamos criar a categoria Diretoria no componente de contato.


Acesse o back-end e navegue pelo menu superior
Componentes
Contatos
Categorias; e
Clique no boto Novo para criar a categoria
Diretoria.
Exerccio nr 6 - Criando o contato

Vamos criar o contato Diretor no componente de contato. Releia o item Contato do


captulo 12 Componentes, para relembrar
o processo.
Acesse o back-end e navegue pelo menu superior Componentes Contatos Contato;
Clique no boto Novo para criar o contato
Prof. Teseu. Diretor da Escola Expresso do
Saber;
Configure os parmetros da aba Detalhes do
Contato, lembre-se de setar o idioma para
portugus; e
Clique no boto Salvar e Fechar.

432/683

Etapa nr 4 - Design de Site


Chegou o momento de fazermos o site multiidiomas funcionar, a estrutura est pronta,
verificamos que o funcionamento est correto e os artigos publicados de acordo com
cada idioma do projeto.
Vamos trabalhar com alguns mdulos para
visualizar o funcionamento.
Exerccio nr 1 Criando mdulos de menus

Os itens de menu esto criados e os menus


funcionais. Agora, vamos criar mdulos de
menu, para cada idioma e public-los na
parte superior do template para visualizarmos a troca de artigos de acordo com o
idioma. Para concluirmos o exerccio
seguiremos os seguintes passos:
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;
No filtro esquerda, defina Menu, na opo

433/683

Selecionar Tipo. Perceba que temos dois mdulos de menu publicados:


Main Menu mdulo do menu principal do
Joomla! O Main Menu publicado por
padro e no pode ser excludo;
User Menu mdulo do menu de usurios.
Esse menu permite, por padro, a edio dos
dados dos usurios cadastrados;
Podemos criar o mdulo de duas formas:
Clicando no boto Carga, para copiar o mdulo, de forma idntica a cpia de artigos,
exceto as opes em relao publicao na
posio correta; e/ou
Clicando no boto Novo. Vou optar por usar
o boto Novo. Caso tenha dvidas, releia o
captulo 13;
So vrias as opes de mdulos a serem criados, com suas respectivas particularidades.
Lembra do captuloo 13? Clique em Menu Este mdulo exibe um menu no site para criarmos um novo mdulo de menu;
So vrias as opes de mdulos a serem

434/683

criados, com suas respectivas particularidades. Lembra do captuloo 13? Clique em


Menu - Este mdulo exibe um menu no site
para criarmos um novo mdulo de menu. O
primeiro mdulo a ser criado ser o Menu
Portugus e usaremos os seguintes parmetros:
Aba Detalhes
Estado Defina o estado como publicado;
Ttulo Menu Portugus;
Exibir Ttulo No iremos exibir o ttulo do
mdulo;
Posio Selecione a posio do mdulo, no
template Protostar, a posio a ser usada,
ser a Navegao [position-1];
Nvel de Acesso Public;
Ordem a ordenao do mdulo dentro da
posio;
Iniciar Publicao define a data/hora do
incio de publicao. No usaremos;
Encerrar Publicao define a data/hora do

435/683

fim da publicao. No usaremos;


Idioma - Portugus; e
Nota No usaremos.
Aba Opes Bsicas
Selecione o Menu Define o Menu Portugus;
tem Base - Defina menu- Portugus Incio;
Nvel Inicial Mantenha o nvel 1;
Nvel Final Mantenha todos;
Itens do Sub-Menu Defina Sim para exibir
itens de sub-menu, dessa forma ser possvel
visualizarmos menus dinmicos, se for o
caso.
Aba Opes Avanadas
ID Tag do Menu este atributo serve para
atribuir a tag URL na raiz do menu. No
usaremos;
Sufixo de Classe do Menu uma classe de

436/683

CSS para o menu. Usaremos a mesma do


main menu: nav-pills;
figura: Configurando os sufixos

Perceba na imagem a cima que existe


um espao em branco antes da classe
nav-pills. Fique atento esse detalhe
pois caso contrrio no ir funcionar.
Posio e Direo valores de javascript
para o caso de usar popup no mdulo;
Layout Alternativo usaremos o padro;
Sufixo de Classe do Mdulo - uma classe de
CSS para o mdulo. Usaremos a mesma do
main menu: _menu.
Os parmetros Sufixo de Classes so fundamentais para a correta visualizao do mdulo no front-end;

437/683

Cache cache para o contedo do mdulo;


Tempo do Cache tempo do cach;
Tag Mdulo TAG do HTML5 que ser
usada no mdulo;
Tamanho Bootstrap quantas colunas o mdulo usar. Manteremos 0;
Tag Cabealho TAG de cabealho do
HTML a ser utilizada. Usaremos a <h3<;
Classe Cabealho classe CSS do cabealho/
ttulo do mdulo. No usaremos; e
Estilo do Mdulo opo para sobreposio
de estilos CSS. No usaremos.
Aba Atribuir Menu
Atribuir Mdulo defina apenas na pginas
selecionadas e deixe marcada a opo Menu
Portugus Incio. Desta forma o mdulo
ser visualizado apenas nas pginas relacionadas ao idioma portugus. Sempre que um
novo item de menu for criado no menu

438/683

portugus, deve-se verificar a necessidade de


visualizar o mdulo, nessa nova pgina;
figura: Atribuindo o mdulo

Clique em Salvar e Fechar e despublique o


mdulo Main Menu que est publicado na
mesma posio;
Repita o processo ou use o boto Carga para
copiar o mdulo, para os idiomas alvos:
Ingls, Espanhol e Francs. Mantenha a
mesma posio e defina o idioma alvo no ato
da cpia.

439/683

figura: Copiando mdulos de menu

Ateno especial deve ser dada aos seguintes


parmetros, aps copiar o mdulo:
Aba Detalhes
Ttulo de acordo com o idioma alvo;
Idioma de acordo com o idioma alvo, caso
no tenha escolhido durante a cpia;

440/683

Aba Opes Bsicas


Selecione o Menu de acordo com o idioma
alvo;
Aba Atribuir Menu
Atribuir Mdulo defina apenas na pginas
selecionadas e deixe marcada a opo Menu
Alvo Incio. Desta forma o mdulo ser
visualizado apenas nas pginas relacionadas
ao idioma portugus. Sempre que um novo
item de menu for criado no menu portugus,
deve-se verificar a necessidade de visualizar
o mdulo, nessa nova pgina.
Exerccio nr 2 Criando mdulo de seletor de idiomas

Para finalizar o teste de funcionamento do


site multi-idiomas, falta apenas publicar o
mdulo Seletor de Idiomas, ou simplesmente: O mdulo de bandeirinhas. Vamos
l?
Acesse o back-end e navegue pelo menu

441/683

superior Extenses Gerenciador de Mdulos; Clique no boto Novo e selecione Seletor


de Idioma. O mdulo Seletor de Idioma exibe uma lista dos idiomas de contedo
disponveis e poderemos alternar entre eles.
A descrio do mdulo, direita, bem
ampla e explicativa;
Sero os seguintes, os parmetros do mdulo:
Aba Detalhes
Estado Defina o estado como publicado;
Ttulo Selecione o Idioma;
Exibir Ttulo No iremos exibir o ttulo do
mdulo, as bandeirinhas proporcionaro um
tipo de mensagem no verbal;
Posio Iremos posicionar o mdulo esquerda e no template Protostar, a posio selecionada dever ser Esquerda [position-8];
Nvel de Acesso Public;
Ordem a ordenao do mdulo dentro da
posio;

442/683

Iniciar Publicao define a data/hora do


incio de publicao. No usaremos;
Encerrar Publicao define a data/hora do
fim da publicao. No usaremos;
Idioma Defina Todos e o motivo simples:
O mdulo comum todos os idiomas do
site; e
Nota No usaremos.
Aba Opes Bsicas
Antes do Texto texto a ser exibido antes do
idioma selecionado;
Aps o Texto texto a ser exibido aps o
idioma selecionado;
Usar Caixa de Seleo Definir como ''Sim'',
impede o uso das imagens de bandeiras e assim as opes de exibio sero ignoradas.
Deixe marcada a opo No;
Imagens de Bandeiras Defina como Sim
para usarmos as imagens de bandeiras no
mdulo;
Exibio Horizontal Define se as bandeiras

443/683

seri exibidas na horizontal ou vertical.


Usaremos Horizontal;
Idioma Ativo Define se a bandeira aparecer, inclusive, no idioma nativo. Defina
No, pois redundncia no o meu forte;
Nome dos Idiomas Se a a opo de Usar
Imagens de Bandeiras estiver definida como
Sim, este parmetro no ser utilizado.
Estamos usando as bandeirinhas, ento
escolheremos o parmetro No.
Aba Opes Avanadas
ID Tag do Menu este atributo serve para
atribuir a tag URL na raiz do menu. No
usaremos;
Sufixo de Classe do Menu uma classe de
CSS para o menu. No usaremos;
Posio e Direo valores de javascript
para o caso de usar popup no mdulo;
Layout Alternativo usaremos o padro;
Sufixo de Classe do Mdulo - uma classe de
CSS para o mdulo. No usaremos;

444/683

Cache cache para o contedo do mdulo;


Tempo do Cache tempo do cach;
Tag Mdulo TAG do HTML5 que ser
usada no mdulo;
Tamanho Bootstrap quantas colunas o mdulo usar. Manteremos 0;
Tag Cabealho TAG de cabealho do
HTML a ser utilizada. Usaremos a <h3<;
Classe Cabealho classe CSS do cabealho/
ttulo do mdulo. No usaremos; e
Estilo do Mdulo opo para sobreposio
de estilos CSS. No usaremos.
Aba Atribuir Menu
Atribuir Mdulo defina em todas as
pginas. Lembre-se que este um mdulo
comum a todo o site; e
Clique no boto Salvar e Fechar e visualize o
mdulo publicado no front-end do site.

445/683

figura: Mdulo publicado no front-end

Etapa nr 5 - Design de Contedo


O prximo passo ser criar os itens de menu
que faltam no projeto. Perceba que voltamos
ao Design de Contedo e esta flexibilidade de
voltar a uma determinada fase do webdesign
muito importante no desenvolvimento de
um projeto. O Joomla! permite mesclarmos
as fases do desenvolvimento sem prejuzo de
prazo e/ou execuo.
Vou tentar ilustrar a explicao de outra
forma: Em 2008 participei de um evento e o

446/683

palestrante que me antecedeu, explanou com


desenvoltura, sobre a utilizao do Joomla!
em sua Instituio. Porm, observou enquanto ponto negativo, o fato de ficarem 3
meses aguardando o envio do template.
Em silncio eu me perguntava: Por qu? O
template nada mais que um pacote zipado,
a camada de viso e enquadra-se no design
de pgina. Poderiam ter partido para o
design de contedo e design de site sem
problema algum. Partindo do princpio que
tratava-se de uma grande Instituio, com
certeza o projeto foi bem elaborado e a
equipe tinha conhecimento do layout grfico
e consequentemente das posies de mdulos que seriam implementadas no template.
Resumo da pera: perdeu-se tempo aguardando o trmino de uma fase do webdesign,
para iniciar-se outra. Lembre-se: Tempo
vida!
Exerccio nr 1 Criando itens nos menus multi-idiomas

447/683

Os seguintes itens de menu devem ser criados em cada menu, de acordo com o idioma:
Estatuto - abre o artigo estatuto;
Notcias lista os artigos da categoria Notcias;
Blog acesso ao blog da escola, com tema
associado; e
Fale Conosco.
Demonstrarei o processo para o idimoa portugus e lembro que o mesmo deve ser feito
para os outros idiomas. Para concluirmos o
exerccio seguiremos os seguintes passos:
Acesse o back-end e navegue pelo menu superior Menus Menu Portugus Adicionar
Item de Menu;
Selecione o Tipo de Item de Menu Artigos
nico Artigo;
Use o filtro Selecionar Idioma Portugus,
para facilitar o processo e clique sobre o
artigo Estatuto;

448/683

figura: Usando o filtro para criar o item de menu

ttulo do item de menu ser Estatuto. Selecione o idioma portugus e clique no boto
Salvar e Novo;
O prximo item de menu ser do tipo Artigos
Lista de Categorias e o ttulo ser Notcias.
Selecione a categoria Notcias. Na aba Detalhes selecione o idioma portugus e na aba
Opes Avanadas, voc poder alterar os
parmetros de visualizao da lista;
Clique no boto Salvar e Novo;
O prximo item de menu ser do tipo Artigos
Categoria como Blog e o ttulo ser Blog.

449/683

Selecione a categoria Blog. Na aba Detalhes


selecione o idioma portugus e na aba
Opes Avanadas, voc poder alterar os
parmetros de visualizao da categoria;
Clique no boto Salvar e Novo;
O prximo item de menu ser do tipo Contatos nico Contato e na opo Selecione o
Contato, escolha Prof. Teseu. O ttulo do
item de menu ser Fale Conosco e selecione
o idioma portugus. Na aba Opes Avanadas, voc poder alterar os parmetros de
visualizao do contato;
Clique no boto Salvar e Fechar; e
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos
e clique no nome do Menu Portugus. Na
aba Atribuir Menu, marque todas as opes
do memu portugus.

450/683

figura: Mdulo de menu portugus atribudo

Repita o processo usando o boto Carga para


copiar os itens de menu, com ateno especial aos idiomas de cada um ou utilize o
boto Novo. Neste caso, no esquea de alterar a opo Localizao do Menu, para o
menu desejado, de acordo com o idioma.
figura: Viso do Menu portugus no back end

Perceba que no est ordenado corretamente, vamos reordenar usando o recurso de


arrastar e soltar na posio desejada.

451/683

figura: Viso do Menu portugus no front-end

Est faltando alguma coisa nesse menu?


Acesse o site do projeto http://www.livrodejoomla.com.br/projeto, descubra e corriga o
seu projeto.
Etapa nr 6 - Design de Pgina
De volta ao design de pgina, iremos associar
o template que ser renderizado quando clicarmos no item de menu Blog. #Engage
Exerccio nr 1 Associar tema ao item de menu

Demonstrarei o processo para o idimoa portugus e lembro que o mesmo deve ser feito
para os outros idiomas. Para concluirmos o
exerccio seguiremos os seguintes passos:
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Temas;
Na aba Styles, clique no nome do template

452/683

sj_joomla3-Default;
Na aba Menus assignment (1) marque o
checkbox do item de menu Blog, no menu
portugus (2); e

figura:

Clique no boto Salvar e Fechar.


Acesse o front-end do site e clique no item
Blog para visualizar a associao do template. A prxima etapa ser a customizao
do tema do Blog.

453/683

figura: Resultado no front-end ao clicar no item Blog

Etapa nr 7 - Design de Site


Chegou o momento de instalarmos no projeto, extenses previstas no documento de
viso. Nosso projeto, alm de ser multi-idiomas, contar com as seguintes funcionalidades:
Estatsticas de Desempenho;
MP3;
Slide Show;
Encapsulamento do /administrator;

454/683

Ocultao da TAG Generator; e


Backup com Instalador.
Estatsticas de Desempenho
A primeira extenso ser o mdulo google
Analytics Dashboard for Joomla, que est
disponvel
em
http://www.livrodejoomla.com.br/insumos/
extensoesdoprojeto
Utilizarei um case real, para demonstrar o
funcionamento do mdulo, a implementao
no
meu
site
pessoal,
www.juliocoutinho.com.br.
Exerccio nr 1 Criando a API Google Console

Acesse http://www.livrodejoomla.com.br/
insumos/?#a13 para conhecer a Google
Developers. Entre com o seu login do Google
(gmail, youtube e etc...) para utilizar o servio;

455/683

Navegue na pgina Google Developers e


identifique a rea Developer Tools. Clique no
link API Console. Caso no possua nenhum
projeto na google Developers, clique em create Project.
figura: Primeiro projeto na google Developers

Caso contrrio crie um novo projeto;


figura: Criando novo projeto na google Console

456/683

Digite o nome do projeto. D asas sua


imaginao;
figura: Nomeando o projeto

Na aba Services, habilite a opo do servio


Analytics API;
figura: Habilitando o servio google analytics

457/683

Clique na aba API Access e na pgina que


ser aberta, clique sobre Create an OAuth
2.0 client ID;
figura: Autorizando o acesso

O prximo passo ser preencher os dados solicitados, para a autorizao:


nome do produto; e
caminho do logotipo de seu site. Clique no
boto Next;

458/683

figura: Informaes do produto

Agora, vamos as Configuraes do ID do cliente. (Client ID settings):


Application Type Web application;
Your site or hostname Altere o protocolo
para http e o domnio do seu site; e

459/683

figura: Clique no boto Create client ID;

Conclumos o processo de criao da API,


observe na imagem os campos com alguns
dos parmetros necessrios ao funcionamento do mdulo; e

460/683

figura: Informaes da API

O ltimo passo ser a configurao da URL


de redirecionamento, que ser composta do
seudominio + administrator + index.php.

461/683

figura: Configurando URL de redirecionamento

Exerccio nr 2 Google Analytics

A google Analytics um servio da google e


permite um acompanhamento completo de
toda a performance de um site. Alguns detalhes so fundamentais para o perfeito funcionamento desse servio. No captulo 7 - SEO x
Joomla!, apesar de no ser um especialista,
dei algumas dicas interessantes, lembra?
Que tal fazer a releitura do mesmo?
Vamos abordar aqui alguns detalhes simples
e fundamentais:

462/683

Acesse http://www.livrodejoomla.com.br/
insumos/?#a14 para validar a propriedade
do seu domnio no site Webmasters Google,
se ainda no o fez. O modo mais comum
baixar uma pgina de validao da google e
transferir para a raiz do seu site. Depois,
basta voltar e clicar no boto de validao;
Crie um sitemap para o seu site. Indico o http://www.xml-sitemaps.com/ que muito
fcil de usar. Escolha a opo de arquivo
.xml e aps o trmino do processo, baixe o
sitemap para a sua mquina e faa a transferncia via FTP para a raiz do site. Volte ao
google Webmasters e confirme o envio do
sitemap; e
No esquea de colar o cdigo da google
Analytics, referente ao site, no seu template.
Partindo do princpio que voc possui uma
conta na google Analytics, que a propriedade
do domnio foi ocnfirmada, o sitemap enviado e o cdigo de rastreamento incorporado
ao template, vamos continuar o processo:

463/683

Acesse sua conta da google Analytics, http://www.google.com/analytics/;


Escolha o domnio a ser renderizado pelo
mdulo; e
Clique na aba Administrador e copie o ID da
conta.
Observe a imagem a seguir com o ID a ser
colado no parmetro Table ID do mdulo.
Acredite, ele me deu muita dor de cabea. ;-)
figura: ID da conta do Analytics

Exerccio nr 3 Mdulo google Analytics


Dashboard

464/683

Chegamos ao final da etapa. Vamos instalar,


configurar e utilizar o mdulo para obtermos
mtricas a respeito do nosso site.
Acesse http://www.livrodejoomla.com.br/
insumos/extensoesdoprojeto e baixe o mdulo;
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Extenses e instale o mdulo;
figura: Instalando o mdulo no site

Navegue pelo menu superior Extenses


Gerenciador de Mdulos e na aba esquerda, selecione a opo Administrador. O
mdulo no uma extenso de site e sim da
administrao;
O mdulo deve ficar publicado na posio
Cpanel, do template sis;

465/683

Os parmetros da Aba Opes Bsicas, so


os neurnios do crebro do mdulo. Foram
explanados nos exerccios nr 1 e nr 2 e sua
configurao deve ser criteriosa e com extrema ateno;
figura: Parmetros do mdulo

Clique no boto Salvar e Fechar e acesse o


Painel de Controle do seu site, para autorizar
o funcionamento do mdulo;

466/683

figura:

Aps autorizar o mdulo, autorize o acesso


da API ao servia google Analytics; e
figura: Autorizando o acesso da API

Acompanhe a performance de seu site atravs da google analytics.

467/683

figura: Mdulo funcionando

Este mdulo indispensvel qualquer projeto e permite ao profissional, prover ao cliente, uma forma de medir os resultados da
poltica de webmarketing criada para o
projeto.
MP3 Integrado
Usaremos o JosDewplayer, plugin para renderizao de arquivos .mp3 no site.
Exerccio nr 1 Plugin para MP3

468/683

Acesse http://www.livrodejoomla.com.br/
insumos/extensoesdoprojeto e baixe o plugin;
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Extenses e instale o plugin;
Aps a instalao, os parmetros de configurao do plugin, sero apresentados, a
saber:
Player para renderizao de 01 arquivo .mp3,
basta utilizar a tag {play}caminho-do-arquivo{/play}
Partindo do princpio que o arquivo musica.mp3 encontra-se no diretrio images/
audio/, a sintaxe correta para a utilizao do
plugin, seria:
{play}images/audio/musica.mp3{/play}
Para utilizar substituir os parmetros
[AUTOPLAY] e [AUTOREPLAY], basta adicionar um "|" entre cada um dos parmetros:
Sintaxe para utilizar os 2 parmetros:

469/683

{play}images/stories/musica.mp3|[AUTOPLAY]|[AUTOREPLAY]{/
play}
O plugin Josdewplayer pode reproduzir um
arquivo mp3 onde quer que esteja. Apenas
certifique-se, nesse caso, de usar a URL completa da fonte (tem que conter "http"),
mesmo que seja no mesmo servidor do site
Joomla.
Sintaxe:
{play}http://meusite.com.br/images/audio/
musica.mp3{/play}
O plugin Josdewplayer pode renderizar mltiplos arquivos .mp3. Um conjunto de setas
permite passar de um para o outro arquivo.
Podem ser locais ou remotos, utilizando os
mesmos parmetros como o nico player.
Use a Estrela como separador: *
Sintaxe:

470/683

{play}images/stories/musica.mp3*http://meusite.com.br/images/audio/musica.mp3*images/stories/outramusica.mp3|[AUTOPLAY]{/play}
A partir da verso 2.0, o plugin Josdewplayer
pode reproduzir listas de reproduo via arquivo .xml.
Envie um arquivo xml para a raiz do
diretrio dos arquivos .mp3 (existe um exemplo na pasta do plugin); e
Use-o nas tags.
Sintaxe:
{play}images/stories/myplaylist.xml{/play}
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Plugins,
selecione o plugin instalado e publique-o.
Perceba na aba Opes Bsicas que os parmetros Autostart e Autoreplay, podem ser
definidos, alm de um multiplayer retangular;

471/683

Crie o diretrio audio em /images e faa upload de um arquivo .mp3 para o mesmo.
Usarei o arquivo que est no diretrio insumos/audio, do site do livro; e
Podemos usar o plugin em um mdulo
HTML personalizado e/ou em um artigo.
Mdulo HTML personalizado Acesse o
back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos. Clique no
boto Novo e crie um novo mdulo HTML
personalizado com os seguintes parmetros:
Ttulo Msica
Exibir ttulo No
Posio Direita [position-7] template Protostar; e
Aba Sada Personalizada digite {play}images/audio/ride.mp3{/play}
figura: Resultado no front-end

472/683

Artigo Acesse o back-end e navegue pelo


menu superior Contedo Gerenciador de
Artigos. Clique no nome do artigo Bem-vindos a Escola Expresso do Saber para Editlo. Em qualquer ponto do artigo, usarei o incio, insira o cdigo {play}images/audio/
ride.mp3{/play} e clique no boto Salvar e
Fechar.
figura: Resultado no front-end

Slide Show
Usaremos o Jt Slide, mdulo para exibio
de Slide Show no site do projeto.
Exerccio nr 1 Mdulo Slide Show

Acesse http://www.livrodejoomla.com.br/
insumos/extensoesdoprojeto e baixe o mdulo;

473/683

Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Extenses e instale o mdulo;
Aps a instalao, acesse o mdulo para configurao e publicao. Os parmetros de
configurao do mdulo, so os seguintes:
Aba Detalhes
Estado publicado;
Ttulo Slide Show;
Exibir Ttulo ocultar; e
Posio Utilizaremos a posio slide, que
criamos anteriormente. Perceba que ela no
est na lista apresentada, por qu? So listadas as posies existentes no manifesto XML
do template e as gravadas no banco de dados. Por enquanto, nossa posio no
enquadra-se em nenhuma das opes, ela est no arquivo ndex.php. Digite slide no
campo Posio e aperte a tecla Enter. A nova
posio
ser
listada
como
Posio
Personalizada.
Aba Opes Bsicas

474/683

figura: Parmetros do mdulo

Vamos ao que interessa:


Habilitar boot jquery mantenha habilitado
o uso da Jquery;
Version jQuery verso da Jquery;
Mtodo de carregamento usaremos o
padro do mdulo;
Largura das imagens o comprimento em
pixels, do Box do mdulo. Para o projeto
utilizarei 460px;
Altura das imagens a largura em pixels, do
Box do mdulo. Para i projeto utilizarei
150px;

475/683

Botes de Navegao define a exibio dos


botes de navegao.
Aba Imagens
figura: Parmetros das imagens

O mdulo permite a transio de at 10 imagens. Para o projeto, utilizaremos 3 imagens que esto disponveis no site do livro.
Os parmetros de configurao so os
seguintes:
Image a imagem do 1 slide, pode ser selecionada da mquina ou do prprio servidor;

476/683

Alt Image a descrio da imagem (TAG


ALT DO HTML), muito importante para a
acessibilidade do site;
URL endereo que ser aberto ao clicarmos sobre a imagem; e
Target forma de abertura da URL.
As abas Opes Avanadas e Atribuir Menu,
so comuns todos os mdulos e no abordarei novamente. Lembre-se apenas de atribuir o mdulo ao menu portugus item
de menu Incio.
Clique na aba Detalhes e publique o mdulo,
alternando a opo Estado, para Publicado;
Clique no boto Salvar e Fechar;
Na opo de filtro esquerda, defina o parmetro Selecionar Posio Position-3 e
despublique o mdulo Image Module, que
foi publicado por padro durante a instalao do Joomla!; e
Visualize o resultado no front-end do site.

477/683

figura: Mdulo publicado

Encapsulamento do /administrator
Encapsular, nada mais que esconder.
Usaremos o pluginAdminExile, para esconder o /administrator de nosso site, aumentando sensivelmente a segurana contra tentativas de invases.
Existem Scanners que buscam a URL administrativa de sites que uma vez encontradas,
so vtimas de ataques do tipo Fora Bruta.
Engana-se quem pensa que esses programas
buscam apenas a URL /administrator e

478/683

dessa forma s atingiriam sites desenvolvidos com Joomla. A grande maioria dos
CMS esto na lista dos Scanners, dentre eles,
Wordpress e OsCommerce.
Exerccio nr 1 Plugin AdminExile

Acesse http://www.livrodejoomla.com.br/
insumos/extensoesdoprojeto e baixe o plugin;
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Extenses e instale o plugin;
Aps a instalao, acesse o plugin para configurao e publicao. Use a aba Filtrar para
ganhar tempo. O plugin, do tipo System;
de Os parmetros de configurao do mdulo, so os seguintes:

479/683

figura: Configuraes do plugin

URL Access Key a chave de acesso rea


administrativa do site. Digite uma palavra,
ou um conjunto de caracteres. Alguns caracteres especiais so reservados e no devem
ser utilizados;
Use Key+Value novidade nesta verso para
Joomla! 3.x, pode-se adicionar um valor
chave, tornando o sistema mais seguro.
Defina Sim e no campo de texto apresentado,
digite a palavra ou nmero, complementar a
chave;
Redirect
URL

o
endereo
de

480/683

redirecionamento, caso tentem acessar /administrator. O valor padro {HOME}, ou


seja, a pgina inicial do site. Recomendo
deixar esta opo, tendo em vista no ser
uma boa prtica, provocar um possvel
cracker que o esteja atacando.
Aps configurar o plugin, a URL administrativa do site, passa a ser algo parecido com:
http://www.seusite.com.br/administrator/?suachave=seuvalor
Faa Logout e tente acessar o back-end do
site, digitando /administrator. Voc ser redirecionado(a) para a pgina inicial.
Para acessar o back-end necessrio digitar
/administrator/?+chave=valor. No caso
do
nosso
projeto:
/administrator/
?livro2012=joomla e s ento, digitar
usurio e senha.
Caso esquea a chave ou valor definidos para
o plugin, ser necessrio acessar manualmente a base de dados e despublicar o plugin
AdminExile, na tabela #__extensions.

481/683

TAG Generator
A TAG Generator est presente no cabealho
de um site desenvolvido com Joomla! e pode
ser visualizada apertando-se por exemplo, as
teclas ctlr+u, no Firefox.
Usaremos um plugin que possibilita a customizao ou eliminao dessa TAG. Isto
eliminar ataques automticos que buscam
por essa TAG no cdigo.
Exerccio nr 1 Plugin ByebyeGenerator
Acesse http://www.livrodejoomla.com.br/
insumos/extensoesdoprojeto e baixe o plugin;
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Extenses e instale o plugin;
Aps a instalao, acesse o plugin para configurao e publicao. Use a aba Filtrar para
ganhar tempo. O plugin, do tipo System;

482/683

Ative o plugin na aba Detalhes e configure-o


na aba Opes Bsicas;
figura: Configurando o plugin

So as seguintes as opes de configurao:


Generator defina o que deseja fazer com a
TAG Generator. No projeto final do livro, optei por customizar;
Custom o generator que criei; e
Robots defina o que fazer com os robs.
Clique no boto Salvar e Fechar; e
Acesse o front-end do site usando o Firefox e
aperte as teclas ctrl+u, para visualizar o

483/683

cdigo fonte. Perceba o novo Generator do


site.
figura: Novo generator

Akeeba Backup
Uma das operaes mais importantes na manuteno de um site, o Backup. A melhor
extenso para o Joomla, chama-se Akeeba
Backup e desde a verso 1.5.x do CMS, vem
emprestando funcionalidades ao core do
Joomla!
O Akeeba faz um dump no banco de dados,
ou seja, cria o backup de todas as tabelas. A
engenharia do sistema permite at mesmo
backups de grandes bancos de dados, sem
perda de informao, atravs do particionamento dos registros. Alm do banco de dados, o Akeeba copia todos os arquivos e
diretrios, gerando um pacote de todo o site.

484/683

O Akeeba vai alm de uma extenso de


backup, possibilita a recuperao de todo o
site, a qualquer momento, com um dispositivo que permite a reinstalao de forma
rpida e simples. Facilita a publicao de
qualquer site, na Internet.
Vamos instalar e configurar o Akeeba em
nosso projeto.
Exerccio nr 1 Instalao do Componente Akeeba Backup

Acesse http://www.livrodejoomla.com.br/
insumos/extensoesdoprojeto e baixe o componente com seu pacote de idioma pt-BR;
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Extenses e instale o componente;

485/683

figura: Akeeba instalado

Da mesma forma, instale o pacote de idioma


pt-BR;
No menu superior clique no item de menu
Componentes Akeeba Backup e na tela de
ps-instalao, configure os recursos opcionais que desejar. No deixe de marcar a opo
I have read, understood and accept the license of the software e I understand that
support for the software is only provided to
subscribers. Ou seja, voc leu, compreendeu
e aceita a licena de uso do componente,
alm de saber que o suporte, ser prestado
apenas para assinantes;
Clique no boto Aplicar as preferncias e
aguarde a concluso do processo; e

486/683

figura: Ps-instalao akeeba

Terminado o processo clique no boto Configuraes. Vamos configurar o componete


para nosso site.
Exerccio nr 2 Configurao do Akeeba Backup

Na aba Configuraes do componente,


somos recebidos com uma mensagem muito
interessante: Suas configuraes so protegidas por criptografia de 128 bits. Voc pode
armazenar com segurana suas senhas na
configurao. Akeeba backup um componente acima da mdia dos gratuitos,

487/683

existentes no JED. Participei de um grande


projeto, que s foi exexutado com xito,
graas ao Akeeba. Tendo em vista sua funo, o componente possui vrios parmetros
de configurao, alguns deles com alta complexidade tcnica. Abordarei apenas 1 parmetro de configurao.
figura: Configuraes bsicas do akeeba

Passe o mouse sobre cada parmetro e visualize a explicao do que cada um faz.
Abaixo, em Configurao Avanada, iremos
alterar a opo Engenharia do Arquivo. O

488/683

padro Formato JPA, altere para o


Formato zip.
JPA, assim como ZIP, um tipo de extenso
para comprimir arquivos. Porm, para
extra-los depois, ser necessrio um extrator especfico. No site do livro, disponibilizei
junto com o Akeeba, o programa extrator.
Detalhe: o mesmo funciona apenas em ambiente Windows.
Clique no boto Salvar e Fechar para conhecer o painel de controle do Akeeba.
figura: Painel de controle do akeeba

489/683

Etapa nr 8 - Design de Site


Todas as extenses foram instaladas, publicadas e os contedos criados. Chegou o momento de alterarmos a pgina inicial do projeto e ajustarmos o posicionamento dos mdulos, para finalizarmos o projeto e partirmos para a publicao na Internet.
Exerccio nr 1 Alterando o layout da pgina inicial

O item de menu da pgina inicial aponta


para um nico Artigo. Foi o recurso que utilizei para demonstrar de forma didtica, a criao da estrutura do site multi-idiomas. Entretanto, faremos uma alterao para melhor
adequao do documento de viso do
projeto.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Contedos e copie o Artigo Bem-vindos... para a categoria Notcias;

490/683

Navegue pelo menu superior Menus Menu


Portugus ;
Clique no item de menu Incio e altere o seu
tipo para Artigos Categoria como Blog;
Selecione a categoria Notcias; e
Clique no boto Salvar e Fechar e visualize o
resultado no front-end.
Exerccio nr 2 Duplicando o mdulo de menu

O documento de viso prev a navegao do


tipo L invertido em nosso site. Precisamos
ajustar o nosso projeto. Vamos aos passos:
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;
Na aba Filtrar selecione o tipo menu;
Marque o check Box do menu Portugus e
clique no boto Carga para copi-lo. Na
opo Definir Posio, escolha a position-8 e
marque a opo Copiar. Esta a mesma
posio do Seletor de idiomas, esquerda do
template;

491/683

Altere o nome do mdulo para Menu Lateral,


na aba Opes Avanadas retire o item
Sufixo de Classe de Menu e publique-o.
Exerccio nr 3 Reposicionando o mdulo MP3

Neste exerccio iremos alterar a localizao


de um mdulo. O documento de viso prev
que o MP3 seja o primeiro mdulo da direita.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
Personalizar HTML. Verifique sua posio e
altere a ordenao do mesmo, dentro da
posio, clicando no cone de reposicionamento e aps habilit-lo, arrastando o mdulo para a primeira posio. Perceba na imagem abaixo, o cone de reposicionamento.
figura: cone de reposicionamento

Exerccio nr 4 Reposicionando o mdulo Image Module

492/683

Neste exerccio iremos alterar a localizao


do mdulo Image Module. O documento de
viso prev uma imagem direita do template do site.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
Personalizar HTML. Clique no nome do mdulo e verifique sua posio. Altere para position-7 e altere a ordenao do mesmo, dentro da posio, devendo ficar logo aps o mdulo de MP3.
Exerccio nr 5 Movendo o mdulo Seletor de Idiomas

Neste exerccio iremos alterar a localizao


do mdulo de seleo de idiomas. O documento de viso prev que as bandeirinhas
fiquem acima e direita do site.
Acesse o back-end e navegue pelo menu superior
Extenses
Gerenciador
de

493/683

Mdulos;e
Use a aba Filtrar para encontrar o mdulo
Seletor de Idiomas e mude a posio do mdulo para [Pesquisar position-0].
Exerccio nr 6 Habilitando o mdulo de busca

Neste exerccio iremos habilitar o mdulo de


busca que est publicado, porm, no foi atribudo a nenhum item de menu.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
busca, clique sobre o seu nome, na aba
Opes Bsicas defina Sim para boto buscar
e na Aba Atribuir Menu, escolha a opo Todas as Pginas; e
Clique no boto Salvar e Fechar.
Exerccio nr 7 Movendo o mdulo de Login

494/683

Neste exerccio iremos mover o mdulo de


login que est publicado, na position-7.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
Acessar, marque o checkbox e clique no
boto Carga para mover o mdulo para a
posio [Esquerda position-8]; e
Clique no boto Salvar e Fechar.
O menu lateral deve ser o primeiro mdulo
da esquerda. Logo, se for o caso, reposicione
o mdulo de login, de forma idntica ao mdulo MP3.
Exerccio nr 8 Movendo o mdulo Breadcrumbs

Neste exerccio iremos mover o mdulo


Breadcrumbs, que o Caminho de Migalhas
do site. A Navegao estrutural (em ingls,
breadcrumb navigation, literalmente navegao por migalhas de po) uma tcnica

495/683

usada em interfaces de usurio para


proporcionar-lhes um meio de localizao
dentro da estrutura de programas ou documentos.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
Breadcrumbs, clique no nome do mdulo e
altere a posio para breadcrumbs; e
Clique no boto Salvar e Fechar.
Observe o front-end do nosso site, vamos aos
ajustes finais.
Exerccio nr 4 Reposicionando o mdulo Image Module

Neste exerccio iremos alterar a localizao


do mdulo Image Module. O documento de
viso prev uma imagem direita do template do site.
Acesse o back-end e navegue pelo menu

496/683

superior Extenses Gerenciador de Mdulos;e


Use a aba Filtrar para encontrar o mdulo
Personalizar HTML. Clique no nome do mdulo e verifique sua posio. Altere para position-7 e altere a ordenao do mesmo, dentro da posio, devendo ficar logo aps o mdulo de MP3.
Exerccio nr 5 Movendo o mdulo Seletor
de Idiomas
Neste exerccio iremos alterar a localizao
do mdulo de seleo de idiomas. O documento de viso prev que as bandeirinhas
fiquem acima e direita do site.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
Seletor de Idiomas e mude a posio do mdulo para [Pesquisar position-0].

497/683

Exerccio nr 6 Habilitando o mdulo de busca

Neste exerccio iremos habilitar o mdulo de


busca que est publicado, porm, no foi atribudo a nenhum item de menu.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo
busca, clique sobre o seu nome, na aba
Opes Bsicas defina Sim para boto buscar
e na Aba Atribuir Menu, escolha a opo Todas as Pginas; e
Clique no boto Salvar e Fechar.
Exerccio nr 7 Movendo o mdulo de Login

Neste exerccio iremos mover o mdulo de


login que est publicado, na position-7.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Mdulos;e

498/683

Use a aba Filtrar para encontrar o mdulo


Acessar, marque o checkbox e clique no
boto Carga para mover o mdulo para a
posio [Esquerda position-8]; e
Clique no boto Salvar e Fechar.
O menu lateral deve ser o primeiro mdulo
da esquerda. Logo, se for o caso, reposicione
o mdulo de login, de forma idntica ao mdulo MP3.
Exerccio nr 8 Movendo o mdulo Breadcrumbs Neste exerccio iremos mover o mdulo Breadcrumbs, que o Caminho de
Migalhas do site. A Navegao estrutural (em ingls, breadcrumb navigation, literalmente navegao por migalhas de po)
uma tcnica usada em interfaces de usurio para
proporcionar-lhes um meio de localizao dentro da estrutura
de programas ou documentos.
Acesse o back-end e navegue pelo menu superior Extenses
Gerenciador de Mdulos;e
Use a aba Filtrar para encontrar o mdulo Breadcrumbs, clique
no nome do mdulo e altere a posio para breadcrumbs; e
Clique no boto Salvar e Fechar.
Observe o front-end do nosso site, vamos aos ajustes finais.

499/683

figura: Front-end do projeto

Ocultaremos algumas informaes do item de menu da pgina


inicial.
Exerccio nr 9 Retirando informaes do artigo

Neste exerccio iremos remover informaes


desnecessrias ao artigo, de acordo com os

500/683

requisitos do projeto.
Acesse o back-end e navegue pelo menu superior Extenses Gerenciador de Menus
Menu Portugus;
Configure os parmetros da aba Opes
Avanadas Opes do Artigo, ocultando os
parmetros desnecessrios; e
Clique no boto Salvar e Fechar.
Exerccio nr 10 Preparando para a publicao

Chegamos ao final do projeto e cumprimos


todos os requisitos do documento de viso.
Neste exerccio iremos criar o pacote de instalao do site, utilizando o componente
Akeeba Backup.
Acesse o back-end e navegue pelo menu superior Extenses Componente Akeeba
Backup;
Clique no cone Backup Agora;
No campo Descrio curta, nomeie o pacote
de sada do backup e clique no boto Backup
Agora;

501/683

Aguarde o final do backup. Durante o processo, no navegue pelo site; e


figura: Backup em execuo

Aps o backup concludo, clique no boto


Administrar Arquivos de Backup, para gerenciar o mesmo.

502/683

figura: Backup concludo

Os arquivos compactados ficam listados no


painel de controle do componente e podem
ser baixados, clicando-se no boto, abaixo do
nome de cada arquivo gerado.
figura: Baixando o arquivo de backup

Os backups ficam no diretrio /administrator/components/com_akeeba/backup


e
muitas vezes ser melhor utilizar seu programa de FTP para baixar o arquivo.
No se esquea de apagar o arquivo anterior,
antes de criar um novo backup do site.
A verso PR do Akeeba, permite o agendamento de backups, atravs do CRON.

Captulo
17
Publicao

Recuperao

Recuperando um site com Akeeba


O backup gerado com o Akeeba pode ser utilizado a qualquer momento, para recuperar o
seu site. O processo simples e lembra a instalao do Joomla! Vamos aos passos para
recuperao do site:
crie um diretrio no seu ambiente local. (Ex:
www/novosite | htdocs/novosite);
descompacte o pacote gerado pelo Akeeba; e
siga o processo de instalao.
O processo ser ilustrado frente, durante a
publicao de nosso site no provedor.
Publicao do Projeto
Chegou o momento to esperado, publicar o
projeto do livro na Internet. No site do livro,
disponibilizei um infogrfico de publicao

504/683

que serve para qualquer projeto, com ou sem


a utilizao do componente Akeeba Backup.
O documento no cita o Fantstico, programa utilizado por muitos provedores na
automatizao do processo, tendo em vista
que sou contrrio este programa. Por qu?
Simples, na maioria das vezes o Joomla instalado estar desatualizado, colocando em
risco a segurana de seu projeto e consequentemente sua credibilidade e de seu
cliente, se for o caso.
Usaremos o arquivo gerado pelo Akeeba
Backup para realizarmos a tarefa, por ser
muito prtico e rpido este processo.
Lembre-se: Tempo vida!
O projeto do livro ser publicado no mesmo
provedor do site do livro e para tal, criaremos um novo diretrio, dentro do diretrio
raiz da conta.
Partindo do princpio que voc contratou um
provedor e que o mesmo tenha um CPanel,
vamos ao passo-a-passo.

505/683

Exerccio nr 1 Criando um banco de dados

No painel de controle do provedor, criaremos o banco de dados do nosso site.


Acesse o CPanel do seu domnio e clique no
boto Banco de Dados;
figura:

Dependendo do seu plano, inmeros bancos


de dados podero ser criados. Porm, todos
sero atrelados ao seu domnio/plano.
Minha conta livro560, ento, o banco a ser
criado, ter o seguinte nome: livro560_projeto;
Clique no boto Criar Banco de Dados;
figura: Banco de dados criado

Com o banco de dados criado, vamos relacionar um usurio ao banco. Criarei um novo

506/683

usurio para demonstrar o processo e ajudlo (a) caso necessite desse esclarecimento.
Criarei o usurio livro560_projeto. No h
necessidade de ser idntico ao banco de dados. Clique no boto Criar usurio;

figura:

Os dados para acesso ao nosso banco de dados sero:


Host localhost
Banco de dados livro560_projeto
Senha a senha que criamos para o usurio
Usurio livro560_projeto
Agora precisamos adicionar o novo usurio,
ao banco de dados e permitir que o mesmo
possa fazer qualquer operao. Selecione o

507/683

usurio e banco e clique no boto Adicionar;


e
figura: Adicionar usurio ao banco

D permisso total ao usurio, ou restringa


as operaes que no deseja. Fica a seu
critrio. Permisso total siginifica que para
este banco, o usurio ter poder de Root.

508/683

figura: Determinando as operaes permitidas

Clique no boto Fazer Alteraes para gravar


os parmetros.
Exerccio nr 2 Criando o usurio de FTP

Dependendo do plano contratado, as informaes de acesso FTP so enviadas por


email.Porm, abordarei a criao do usurio,
dentro da mxima: Treino difcil, jogo fcil.

509/683

Acesse o CPanel do seu domnio e clique no


boto Contas de FTP na aba domnio; e
figura: Contas de FTP

Preencha os dados do novo usurio e clique


no boto Criar.
figura: Novo usurio FTP criado

Exerccio nr 3 Criando o Diretrio

Se voc no possui site publicado no seu


provedor, no ser necessrio criar diretrio
dentro da raiz, pule para o exerccio nr 4.

510/683

Lembre-se que criaremos o diretrio projeto,


dentro do diretrio raiz do provedor, no caso
public_html, apenas para aproveitar a conta.
O endereo do site do projeto, ser http://www.livrodejoomla.com.br/projeto, ou
seja, um Hot Site do site principal.
Acesse o CPanel do seu domnio e clique no
boto Gerenciador Padro na aba Arquivo; e
figura: Criando um diretrio

Crie a pasta projeto dentro da raiz (www,


public_html, etc...).
figura: Diretrio criado

Exerccio nr 4 Transferindo o Site para o Provedor

Dependendo do seu provedor, o mesmo contar com a opo de descompactar o arquivo


ao ser enviado, ou aps o envio. Isto muito

511/683

importante para ganharmos tempo durante o


processo.
Para transferirmos o arquivo usaremo o
prprio CPanel do provedor. Dependendo do
seu provedor, voc pode optar pelo uso de
um programa de FTP. Ex: Filezila ou Fireftp.
O CPanel deve ser utilizado para a transferncia de sites compactados, gerados pelo
Akeeba ou no.
Se optar por transferir o site sem compactlo, use um programa de FTP.
Acesse o CPanel do seu domnio e clique no
boto Gerenciador Avanado na aba Arquivo. O diretrio poderia ter sido criado, a
partir do clique neste boto. Porm, no so
todos os provedores que o possuem, por isso
optei por usar o Gerenciador Padro;
figura: Gerenciador avanado

512/683

D 2 cliques no diretrio projeto, que foi


recm-criado.
figura: Enviar site

Clique no boto Upload e altere as permisses, se for o caso; e

513/683

figura: Permisses de Diretrios

Verifique se o diretrio est correto e confira


as permisses. Lembre-se que as permisses
corretas so:
Diretrios 755
Arquivos 644
Selecione o arquivo com o backup do site em
sua mquina. O upload iniciarse- automaticamente e o tempo depender de sua conexo com a Internet;

514/683

Aps o trmino do processo, atualize o


diretrio apertando as teclas ctrl+f5;
figura: Pacote enviado com sucesso

Clique sobre o pacote e escolha a opo de


Extrair e verifique se o diretrio est correto.
No caso public_html/projeto;
figura: Extrair os arquivos

Aps a descompactao do arquivo, clique no


boto Close e atualize o endereo do site, no
navegador.
Caso a mensagem Your host needs to use

515/683

PHP 5.3.1 or higher to run this version of


Joomla! aparea, seu provedor no possui a
verso do PHP compatvel com Joomla! 3.x.
Dependendo do provedor, isso no ser um
problema e bastar criar uma flag no arquivo
htaccess.txt existente na raiz do Joomla.
Estou usando o Hostgator e no meu caso,
basta criar a flag com o seguinte contedo:
figura: flag no arquivo .htaccess

Aps criar a flag devo renomear o arquivo


para .htaccess.
Este arquivo muito importante e j foi
abordado no livro, fundamental para a segurana, URLs amigveis e etc...
Exerccio nr 5 Publicando o site no provedor com o Akeeba

Fizemos todo o processo, nosso site foi


descompactado e atualizamos a verso do
PHP. Agora, basta atualizar o site apertando
as teclas ctrl+f5 e seguir os passos do

516/683

Akeeba.
A primeira tela do Akeeba nos traz informaes do provedor de hospedagem, do PHP e
dos diretrios tmp, logs e cache;
figura: Tela 1 restore akeeba

A prxima tela nos avisa da mudana de


banco de dados, clique em Sim;

517/683

figura: Tela 2 mudana de banco

A prxima tela nos apresenta as diretivas de


conexo ao banco de dados, que devero ser
preenchidas para o devido Restore. Aps
preencher as informaes clique no boto
Next do Akeeba;
figura: Tela 3 diretivas so banco de dados

518/683

Perceba que o usurio, senha e banco de dados, so os que criamos anteriormente.


Aps o Restore do banco, a imagem abaixo
ser visualizada.
figura: Restore completo

Clique no boto OK para dar continuidade.


Chegamos aos ajustes finais do processo,
verifique as informaes, com especial
ateno para os diretrios (tmp, log e cache)
e crie a nova senha para o administrador do
site. O Akeeba sugere outro usurio diferente
de admin. Clique no boto Next do Akeeba
para a ltima operao.

519/683

figura: Configuraes finais

O site est recuperado e pronto para fazer


sucesso, remova o diretrio de instalao e
aguarde a visualizao do front-end.

520/683

figura: Removendo o diretrio de instalao

O processo de publicao de um site com


Akeeba muito mais simples que o processo
de transferir todos os arquivos e diretrios
via FTP e importar o banco de dados para o
provedor.

521/683

figura: Site publicado no provedor

Captulo 18 Programando para a


Plataforma Joomla!
Introduo
O nosso projeto foi publicado mas no significa que est terminado. Pelo contrrio, a
publicao de um site na internet o inicio
de um ciclo de atualizaes constantes e melhorias que ficaram para trs por cortes oramentrios ou esgotamento de prazo.
Nos prximos captulos aprenderemos a customizar o componente de usurios
(com_users), criaremos Override de Templates, alm de construirmos juntos um novo
plugin de validao, para o com_users.
Fim desenvolver o proposto neste captulo e
posteriores, instalei um novo Joomla sem exemplo de contedo e usarei o Gedit em ambiente GNU/LINUX e notepad++ em ambiente Windows. O sistema operacional e IDE
de desenvolvimento devem ser aqueles que

523/683

voc domina.
No existe forma errada ou certa de programar, o principal ter lgica. Alguns programam de forma estruturada outros orientado a objeto. Para o Framework Joomla,
devemos programar orientado a objetos.
Alis, se voc conhece um pouco do cdigo
dos componentes do Joomla! 1.5, perceber
o quanto o nvel de abstrao aumentou no
Joomla! 3.x. Lembra muito a programao
em Java.
No foco deste captulo ensinar programao, logo, sugiro a leitura de algum livro de PHP orientado a Objetos para ajudar,
se for o caso.
Joomla! Platform
Precisamos conhecer a Joomla! Platform e os
comandos PHP mais utilizados no Joomla
antes de iniciarmos.
Podemos pensar o CMS Joomla como uma
plataforma para criao de aplicativos.

524/683

Podemos tambm ver o CMS Joomla como


uma aplicao que fica em cima de algo
ainda mais fundamental, algo que constitui a
base sobre a qual tudo construdo no
Joomla. Esse algo a plataforma Joomla. J
foi chamada de "Joomla! Framework", "as
bibliotecas joomla" e provavelmente muitas
outras coisas. O que estamos falando, no entanto, so os programas dentro da pasta de
bibliotecas da distribuio Joomla.
Antes da verso 1.5 do joomla, as classes e
funoes fundamentais da distribuio eram
todas misturadas em um punhado de arquivos dentro da pasta includes. Para o Joomla
1.5, decidiu-se criar uma forma mais limpa e
sustentvel de manter o cdigo-fonte organizado, de forma a tornar-se mais profissional, onde os frameworks so invocados para
fornecer a lgica fundamental. Um dos obejtivos foi tornar o desenvolvimento de extenses em Joomla, mais amigvel aos
profissionais provenientes do java ou do

525/683

.NET. Devido a isso, foi construdo o hoje


conhecido como a plataforma Joomla.
Quando voc olhar na pasta de bibliotecas,
voc ver sete pastas e cinco arquivos PHP
(junto com o arquivo HTML obrigatrio).
Dentro do arquivo loader.php existe uma
classe e duas funes muito importantes.
A classe chamada JLoader manipula e inclui
os programas da plataforma para que voc
possa us-los em seus projetos. As duas funes so jexit () e jimport ().
A funo jexit () um invlucro em torno da
funo de sada do PHP (na verdade, uma
construo de linguagem). Ela existe para
tornar a unidade de teste mais fcil e voc
deve sempre us-la em seus scripts em vez
de usar exit() diretamente.
A funo jimport () uma forma abreviada
de chamar JLoader :: import () e se destina a
fornecer uma sintaxe semelhante declarao de importao em Java ou a instruo usando em C #.

526/683

A idia geral que voc use o mtodo jimport () mtodo com um caminho separado
por ponto para a biblioteca que deseja usar e,
em seguida, a plataforma garante que ele esteja disponivel para voc quando for us-lo.
As pastas so joomla, cms, phpmailer,
phputf8 e SimplePie. Phpmailer, phputf8 e
simplepie, no fazem parte do core do
Joomla, so bibliotecas de terceiros que o
CMS Joomla usa para oferecer diversas funcionalidades, a saber:
phpmailer: um pacote para lidar com o envio de e-mail complexo escrito em PHP;
phputf8: um pacote para fazer o PHP mais
amigvel ao encoding UTF-8 e utilizado
para aumentar a funcionalidade nativa do
PHP para lidar com UTF-8 enconding;
SimplePie: um pacote para lidar com anlise de XML alimentado com Atom e RSS.
A pasta Joomla contm todas as bibliotecas
que compem a plataforma Joomla.
A pasta cms foi adicionado na verso 2.5. Ela

527/683

mantm classes da biblioteca joomla necessrias ao CMS Joomla, mas no aplicveis


plataforma joomla. Existem dois arquivos
PHP na pasta libraries/joomla:
factory.php: contm uma classe esttica chamada JFactory e fornece uma maneira fcil
de obter vrios objetos do sistema a partir de
uma interface comum; e
methods.php: contm algumas classes estticas auxiliares para interagir com URLs e
traduzir o texto.
As pastas encontradas dentro de libraries /
joomla so conhecidas como pacotes de bibliotecas e so agrupadas logicamente em todo o tipo de funcionalidade que eles
fornecem.
Estrutura de Arquivos PHP
PHP uma linguagem de programao estruturada, cujo cdigo interpretado em sequncia do incio ao fim sem guardar objetos
na memria. uma linguagem executada a

528/683

nvel de servidor.
Arquivos .php podem ser criados e editados
em qualquer programa editor de texto, por
exemplo bloco de notas e uma boa prtica de
programao no Joomla, ou no, usar codificao UTF-8 para todos os arquivos.
O cdigo PHP pode ser escrito junto com a
linguagem de marcao de texto HTML e a
extenso que identifica arquivos php a
.php. Ex: index.php
Arquivos PHP no Joomla
O CMS Joomla possui vrios arquivos que
possuem somente cdigo PHP. Arquivos
PHP so identificados pelas tags <?php e
?>.Exemplo: <?php echo $info; >
Quando o arquivo composto apenas de
cdigo PHP, no existe a necessidade da tag
de fechamento. Alis, uma boa prtica de
programao com PHP no usar a tag de
fechamento para arquivos que possuam
apenas cdigo PHP, tendo em vista que

529/683

espaos deixados aps a tag de fechamento


podem causar erros no processamento do
arquivo.
Lembre-se: Omita sempre a tag de
fechamento, quando o arquivo possuir apenas cdigo PHP.
Arquivos com PHP e HTML
O arquivo index.php do template utilizado
no CMS Joomla composto de uma mistura
de cdigos PHP com elementos do HTML.
Nesses arquivos, o cdigo PHP identificado
pelas tags <?php e ?>. comum utilizar
PHP junto com o HTML.
PHP Sintaxe Bsica
Espao em branco
Espao em branco (espao, tabulao e etc...)
so ignorados pelo interpretador do PHP. O
importante a formatao do cdigo para o
perfeito processamento. Observe o exemplo

530/683

abaixo:
$a=$b+$c;
equivalente a: $a = $b + $c;
A segunda notao a preferida porque
mais legvel. Alm disso, uma nica linha de
cdigo pode levar at mais de uma linha de
texto. Por exemplo:
$a = $b + $c + $d;
Caracteres importantes
Toda declarao PHP:
termina com um pontoe vrgula (;)
Parnteses ( ) e Chaves { } so usados para
delimitar blocos de cdigo
Blocos de cdigo so usados para designar o
incio e o fim do cdigo para:
CLASSES (possuem atributos e mtodos)
FUNES
DECLARAES
INSTRUES
SWITCHS
LOOPS
Parnteses so usados para a instruo

531/683

condicional for if (para se) e declaraes


switch (mudar), e while (enquanto).
Os comentrios podem ser inseridos da
seguinte forma:
em uma linha de cdigo - como quaisquer
caracteres aps " / / "
blocos de comentrios - comeam com a
linha " / * " e terminam com a linha " * / "
O trao junto ao smbolo maior que ( " -> " )
chamam um mtodo de classe. Por exemplo:
$name = $db->loadResult();
(*) Chama o mtodo loadResult() do objeto
na varivel chamada $db
Dois pontos duplos ( " :: " ) fazem a mesma
coisa para mtodos estticos. Por exemplo:
$user= Jfaxtory::getUser();

532/683

figura: Tabela de caracteres utilizados no PHP

533/683

534/683

Operaes Comuns
Operaes Aritmticas e Concatenao de
Strings
No PHP as quatro operaes matemticas
so representadas pelos smbolos:
+ (ADIO)
- (SUBTRAO)
* (MULTIPLICAO)
/ (DIVISO)

535/683

O smbolo ponto ( . ) sozinho antes de uma


varivel ou com sinal de igualdade (".=") ,
significa concatenar (juntar). Por exemplo:
$a = ' $dog ';
$b = 'cat ';
$c = ' $a . $b;
Chegamos a seguinte concluso: $c um
'dogcat'
$a += $b; // assume que $a = $a + $b
$c .= $d; // assuma que $c = $c . $d
O duplo sinal de adio "+ +" significa adicionar um ($ a + +;).
Sinal de adio com sinal de igualdade ("+
=") significa incrementar um valor por outro
valor.
Fixando Tipos de Variveis
Para definir ou converter um tipo de varivel, utilize o tipo entre parnteses como
operador. Por exemplo:
$a = (string) $b; // $a assume $b convertida
em uma string (caracter)

536/683

$c = (int) $d; // $c assume $d convertida em


um nmero inteiro
Regras especficas so aplicadas ao converter
valores de um tipo para outro. Por exemplo,
para converso de caracteres em nmeros
inteiros:
$int = (int) 'abc'; // $int ser o nmero zero
(0)
$int = (int) '123abc'; // $int assume 123
Se este primeiro grupo de letras pode ser interpretado como um nmero inteiro, este o
valor utilizado. Caso contrrio, o valor zero.
Operadores Lgicos
Um nico smbolo de igualdade ( = )
atribui um valor a uma varivel (e retorna este valor);
Um duplo ou triplo sinal de
igualdade ( == ou === ) atribui um
valor de igualdade.
Observe o exemplo:
$a = $b; // a varivel $b recebe o valor de $a

537/683

( $a == $b ); // verdadeiro se $a possui o mesmo valor de $b


( $a === $b); // verdadeiro se $a
possui o mesmo valor e tipo de $b
O sinal de ( ! ) utilizado para negar
uma comparao.
Observe o exemplo:
( $a != $b ); // a varivel $a diferente da varivel $b
( $a !== $b); // a varivel $a no
igual a varivel $b
Os sinais "&gt;" e "&lt;" so utilizados
para determinar a condio tamanho
de uma varivel em relao outra.
Observe o exemplo:
($a &lt; $b); // a varivel $a menor
que a varivel $b
($x &gt; $y); // a varivel $x maior
que a varivel $y
Os sinais =&lt; e &gt;= ) so utilizados para determinar a condio de

538/683

tamanho e igualdade de uma varivel


em relao outra.
Observe o exemplo:
($a &lt;= $b); // a varivel $a menor ou igual a varivel $b
($x =&gt; $y); // a varivel $x
maior ou igual a varivel $y
Pipe ( || ) e ( OR ) so utilizados para
expresses lgicas do tipo OU.
Observe o exemplo:
($a || $b); // a varivel $a ou a varivel $b
($x OR $y); // a varivel $x ou a varivel $y
O ecomercial &amp;&amp; e AND
so utilizados para expresses lgicas
do tipo E.
Observe o exemplo:
($a &amp;&amp; $b); // a varivel
$a e a varivel $b
($x AND $y); // a varivel $x e a varivel $y

539/683

Abaixo temos alguns exemplos


usando operadores lgicos.
( $a == $b || $c == $d )
( $a == $b OR $c == $d )
( $a == $b && $c == $d )
( $a == $b AND $c == $d )
Declaraes ( if elseif - else )
Declaraes so muito comuns para executar
condies no cdigo. A sintaxe bsica pode
ser observada abaixo.
IF (Se)
Exemplo 1: IF - ELSE
if ($a == $b) {
/*
testa a condio se a varivel $a igual a varivel $b.
Se o resultado verdadeiro executa o cdigo
entre chaves.
*/

540/683

$c = d;
$e = $f;
}
else
{
// caso contrrio
$g = $h;
$i = $j;
}
Perceba que usamos a clusula else para testar a condio.
Em blocos com muitas condies devemos
usar elseif para os blocos de cdigo subsequentes.
Exemplo 2: IF - ELSEIF
if ($a == $b)
{
$x = $y; // se a condio verdadeira
}
elseif ($c == $d)
{
$g == $h; // somente se ($a == $b) e ($c

541/683

igual $d)
}
Podemos usar vrios blocos elseif no cdigo.
Ateno: Nunca use sinal de igualdade
simples ( = ), para comparar valores. A comparao deve ser feita com o sinal de
igualdade duplo ( == ). O sinal de igualdade
simples utilizado para atribuir valor a uma
varivel.
Por exemplo, considere o cdigo abaixo:
$a = dog ;
$b = cat ;
If ($a = $b) // foi usado = ao invs de == por
engano.
{
echo true\n; // resultado sempre verdadeiro
echo $a . \n; // $a agora cat }
Acidentalmente, utilizamos o sinal simples
de igualdade ao invs do sinal duplo.
O sinal simples de igualdade tem duas funes iguais:

542/683

(1) Atribuir o valor de $b $a; e


(2) Retorna o novo valor para $a.
Assim $a = $b retorna o valor cat, que retorna verdadeiro para valor booleano. Portanto,
a declarao if verdadeira.
Podemos usar um nico sinal de igualdade (
= ) dentro de uma condio if quando executamos um mtodo e atribuimos os resultados a uma varivel.
Por exemplo: O mtodo loadResult() da
classe JDatabase retorna um valor ou valor
nulo se a consulta for vazia. Por isso, podemos usar um valor de retorno loadResult()
dentro de uma condio if.
Observe o exemplo abaixo:
If ( $link = $db->loadResult() ) { // verdadeiro se a consulta no retornar zero }
O cdigo acima ir:
1) executar o mtodo loadResult () da classe
JDatabase,
2) salvar esse valor para a varivel $ link, e
3) usar esse valor como condio para o if.

543/683

Poderamos escrever o mesmo cdigo em


apenas duas linhas, observe:
$link = $db->loadResult ();
if ($link) { // link verdadeiro se a consulta
retorna um resultado
Existe uma precauo importante no cdigo.
Se a consulta retornar um zero como um resultado vlido, este cdigo no vai funcionar
como esperado. Isto ocorre, porque o zero ir
tornar a condio falsa. Neste caso, poderamos usar o seguinte cdigo para corrigir o
problema:
$link = $db->loadResult();
if ($link !== null) { // retorna falso se o resultado da consulta for nulo
Voc pode usar o operador ternrio do PHP
para substituir alguns simples comandos if,
da seguinte forma:
$a = ( $b == $c ) ? $d : $e; // $d retorna verdadeiro, caso contrrio $e retorna verdadeiro
Isto atribui a varivel $a, o valor da varivel

544/683

$d se a condio for verdadeira. Caso contrrio ser atribudo o valor da varivel $e.
Declarao ( Switch )
A declarao Switch utilizada para executar
diferentes blocos de cdigo, baseados no valor de uma expresso. A sintaxe bsica da declarao a seguinte:
switch ($a)
{
case 'abc';
$b = $c;
break;
case 'def';
$d = $e;
break;
default:
$f = $g;
break;
}
Entendendo o cdigo:
a declarao switch testa o valor de $a da

545/683

seguinte forma:
a) se for 'abc', o valor atribudo a $b ser $c;
b) se for 'def', o valor atribudo a $d ser $e;
c) se nenhuma
das condies forem satisfeitas o valor
padro ser assumido, neste caso, o valor atribudo a $f ser $g.
Perceba que a cada teste, o cdigo interrompido pelo comando break. Ou seja, caso a
primeira condio seja atendida, o bloco da
declarao switch encerrado e o processamento do cdigo continua.
Declaraes ( Looping )
Foreach
Loops do tipo foreach so a maneira mais
simples de percorrer um array. O bloco de
cdigo do loop executado uma vez para
cada elemento do array. Por exemplo, no
bloco de cdigo abaixo, $groups um
simples array:
Foreach ($groups as $group) // groups um

546/683

array
{
echo $group; // $group contm os elementos do array
// aqui seria inserido o restante do cdigo, se
fosse o caso
}
Neste exemplo, se $groups no um array,
voc receber um aviso do PHP que o array
est vazio. Neste caso, o loop ser ignorado.
Voc pode usar loops do tipo foreach com arrays associativos, especificando as variveis a
usar para cada chave e valor.
Observe o exemplo:
$assoc = array(name => Fred, age =>
29);
Foreach ($assoc as key => value) {
echo $key . : . $value . \n; // imprime cada
par chave/valor
}
Aqui, $key vai ser a chave para cada elemento da matriz e $valor vai conter o valor

547/683

para cada elemento.


For
Loops do tipo for permitem que voc execute
o loop, n vezes.
Observe o exemplo:
// comea com 0, adiciona 1 a cada excuo
do $i, continua at que a condio no seja
verdadeira
For( $i = 0; $i < $len; $i++)
{
echo $i; // ser executado at que $i == $len
}
Aqui ns usamos $i como nosso contador e
usamos $i++ para increment-lo. O loop
ser executado at que a condio $i < $len
no seja verdadeira.
Do/While Loops do tipo Do/while permitem processar um bloco de cdigo at que
uma condio no seja verdadeira. Um tipo
executa um bloco de cdigo primeiro e depois verifica uma condio para ver se ir
repet-la.

548/683

Observe o exemplo:
do
{
// bloco de cdigo processado uma vez e
depois ser repetido
// enquanto ao mesmo tempo a condio
verdadeira
// cdigo no bloco de cdigo deve finalmente
satisfazer a condio
}
While ($a != $b);
O segundo tipo checa a primeira condio,
antes de executar o bloco de cdigo.
Observe o exemplo:
While ($a != $b)
{
// bloco de cdigo ser executado apenas se
a condio for verdadeira
// cdigo no bloco de cdigo deve, eventualmente, seri nserido para condio falsa
}
Em ambos os casos, importante

549/683

compreender que o bloco de cdigo executado deve eventualmente tornar a condio falsa. Caso contrrio, voc vai ter uma
condio de loop infinito.
Comando Foreach
O comando continue usado para ignorar o
restante do bloco de cdigo do para uma iterao do loop.
Foreach ( $groups in $group )
{
if ( $group = 'Public' ) {
continue; // ignora group 'Public'
}
echo $group;
}
Sintaxe Alternativa
Em arquivos contendo somente o cdigo
PHP, normalmente, o cdigo colocado em
um elemento de PHP. Em arquivos de layout, no entanto, podemos misturar elementos do PHP com outro elemento HTML,

550/683

tendo assim mltiplos elementos PHP no arquivo. Dependendo da situao, podemos


desejar a sada de elementos HTML nos blocos de cdigo de if e loops.
Nesta situao, geralmente prefervel usar
a sintaxe alternativa para comandos if e
loops. Isso permite-nos elementos de sada
HTML fora de elementos de PHP, ento no
precisa colocar elementos HTML entre aspas. Ele tambm evita ter um cdigo PHP
que contm apenas uma tag aberta ou
fechada, que muito fcil de se perder
quando se olha para o cdigo.
Na tabela abaixo temos alguns exemplos
padro de sintaxe alternativa. Na sintaxe alternativa, os comentrios do PHP devem ser
colocados dentro de elementos PHP. Alm
disso, embora caracteres de espao em
branco no sejam importantes no interior
dos elementos de PHP, so importantes fora
destes elementos. Por exemplo, as duas

551/683

seguintes linhas de cdigo iro produzir resultados diferentes:

552/683

figura:

Variveis

553/683

Todas as variveis em PHP comeam com


um cifro seguido por uma letra ou sublinhado. Por exemplo: $minhavariavel ou
$_minhavariavel.
Voc pode usar nmeros e traos aps a letra
ou sublinhado. Os nomes de variveis so
case sensitive, ento $minhavariavel $minhaVariavel so diferentes. muito fcil
enganar-se na referncia de uma uma varivel, por conta do case sensitive.
Essa uma razo pela qual bom ser consistente na nomeao de variveis. (por exemplo, usando "capitalize", tipo: $nomeMinhaVariavel.
Declarando Variveis
Via de regra voc no precisa declarar variveis no PHP, mas deve atribuir-lhes um valor
antes de us-la em uma expresso. Caso contrrio voc receber um aviso, do PHP, tipo
warning.
Escopo de Variveis

554/683

Em geral, as variveis so definidas e o


escopo est somente no bloco de cdigo,
onde so definidas. Por exemplo, se uma varivel definida no bloco de cdigo mais externo de um script, o escopo ser para o resto
do script, incluindo blocos de cdigo contidos, como declaraes if e loops.
Se um arquivo includo usando comando
include ou require, o escopo das variveis
ficar no mbito dos arquivos includos.
por isso que as variveis de uma view ainda
esto no escopo quando usamos o mtodo
LoadTemplate () para carregar arquivos de
layout.
Quando estamos dentro de um mtodo de
classe ou de uma funo, apenas as variveis
locais para o mtodo ou funo esto no
escopo.
Arrays (Matrizes)
As matrizes podem ser criadas com ou sem
valores iniciais. O cdigo a seguir cria uma
matriz vazia:

555/683

$emptyArray = array( );
O cdigo abaixo cria uma matriz com dois
valores:
$simple = array(zero, one); // $simple[0]
= zero, $simple[1] = one
Matrizes podem ser indexadas ou associadas.
Matrizes usam nmeros inteiros 0,1,2, etc...
para aceesar elementos, na indexao.
Por exemplo, o cdigo seguinte acede ao
primeiro elemento no exemplo anterior
(note que o primeiro elemento 0, e no 1):
echo $simple[0]; // ser printado zero na
tela
As matrizes de associao so armazenadas
em pares chave-valor. Este exemplo cria uma
matriz associativa:
$assoc = array (name => Jim , age =>
29);
Para acessar os valores, use o seguinte:
echo $assoc[ name ]; // printa Jim, na tela
echo $assoc[ age ]; // printa 29, na tela
Para adicionar um novo elemento ao array

556/683

indexado, use [], da seguinte forma:


$simple[ ] = new value ; // adiciona ao fim
do array
Para adicionar um novo elemento ao array
associado, adicione uma nova chave, da
seguinte forma:
$assoc[ telephone ] = 123-4567;
Use o comando unset para remover um elemento de um array. Por exemplo:
unset( $assoc[ age ] ) // remove o elemento
age
Elementos de matriz podem ser de qualquer
tipo, incluindo objetos ou outras matrizes.
Por exemplo, este cdigo cria uma matriz indexada, onde os elementos so arrays associativos:
$person1 = array( name => Jim , age =>
29);
$person2 = array( name => Jill , age =>
27);
$people = array($person1, $person2);
Neste exemplo, acessamos um elemento da

557/683

matriz anterior, como se segue:


echo $people[0][name]; // printa Jim, na
tela
Aqui, $people[0] a primeira matriz associativa, $people[0][name] d o nome de elemento da matriz associativa
Trabalhando com Arrays Aqui alguns exemplos de como trabalhar com matrizes com os
comandos: count(), is_array() e isset().
$count = count( array(1,2,3)); // 3: o
nmero de elementos da matriz
is_array($a); // retorna verdadeiro se $a
um array, caso contrrio retorna falso
isset($person1[`name`]) // verdadeiro se
elemento existe, caso contrrio falso
Acesse http://www.livrodejoomla.com.br/
insumos/?#a15 para mais informaes sobre
Array.
Strings
Strings so variveis que contm caracteres,
incluindo textos, nmeros e smbolos e PHP

558/683

possui vrios mtodos que trabalham com


strings.
Alguns desses mtodos no funcionam corretamente com conjuntos de caracteres
UTF-8.
A classe Jstring que fica em (libraries/
joomla/utilities/string.php) contm mtodos
para comparao e uso correto com UTF-8.
Por essa razo, voc deve usar o mtodo
Jstring quando for operar com string que
contenha codificaoUTF-8. Veja os exemplos abaixo:
$pos = JString::strpos( 'abc' , 'bc' ) ; //
deveria ser 1
$len = JString::strlen( 'abc' ); // deveria ser
3
$replace = str_replace( 'dog' , 'cat' , 'I love
dogs.'); // I love cats.
Acesse http://www.livrodejooma.com.br/insumos/?#a16 para maiores informaes
sobre Strings no PHP.
Acesse http://www.livrodejoomla.com.br/

559/683

insumos/?#a17 para maiores informaes


sobre a classe Jstring.
Funes e Mtodos
Constantes e Diretrio Atual
Podemos definir constantes em PHP usando
a instruo define.
Observe o exemplo: define( '_JEXEC' , 1 );
Define a constante _JEXEC com um valor de
1. Lembre-se que esta constante muito importante e impacta na segurana do sistema.
Cuidado ao criar suas extenses, _JEXEC
deve ser usada para ter certeza que os arquivos so executados dentro da aplicao
Jomla. Uma vez definida, as constantes no
podem ser alteradas. Por conveno, as constantes so definidas com letras maisculas.
No PHP temos algumas constantes mgicas
pr-definidas.
Observe o exemplo:
A constante __FILE__ igual ao nome completo do caminho do arquivo atual.

560/683

A funo dirname() retorna o nome do


diretrio para qualquer arquivo ( parte ou
nome completo do caminho antes da ltima
barra ). Podemos usar __FILE__ e dirname() juntos para obtermos o diretrio do
arquivo atual.
Observe o exemplo:
define(
'
JPATH_BASE
'
,
dirname(__FILE__));
O cdigo define a constante JPATH_BASE
como o nome do diretrio dos arquivos
atuais. Tambm inclui mtodos chamados
file_exists() para checar se o arquivo existe
ou no no sistema.
Acesse http://www.livrodejoomla.com.br/
insumos/?a=18 para maiores informaes
sobre comandos de sistemas de arquivos.

Captulo 19 Componente com_users


Introduo
Muitas vezes a particularidade do projeto
nos deixa em uma situao difcil, aquela
sensao de estarmos em uma sinuca de
bico.
Nem sempre, a melhor sada procurar no
JED uma extenso de terceiros, podemos
customizar um componente j instalado, de
preferncia nativo, que atenda a demanda.
Usarei como exemplo um projeto que desenvolvi a alguns anos. O cadastro de usurios,
era complexo e na poca no encontrei no
JED algo que atendesse a demanda, exceto
talvez, componentes de formulrios que criariam imensas tabelas no banco de dados. A
soluo encontrada foi customizar o

562/683

componente de usurios do Joomla 1.5.x e


desta forma resolver a questo.
No Joomla! 3.x a customizao ficou mais fcil, no simplria, sabendo um pouco de
PHP e estando atento aos detalhes da Programao Orientada a Obejtos, possvel
customizar um componente nativo e/ou de
terceiros desde que distribudo sob licena
GNU/GPL.
Neste captulo iremos aprender a customizar
o com_users, componente responsvel pelo
cadastro e gerenciamento de usurios. Esta
tcnica conhecida por hacking e no a
mais recomendado pois podemos perder o
trabalho realizado em uma atualizao de
verso. Por isso, iremos ao longo do captulo,
aprender o mesmo processo, de forma
menos invasiva, utilizando o plugin Usurio Perfil.

563/683

Nosso objetivo incluir um campo no formulrio de cadastro do componente e criar


uma nova viso.
Customizando o com_users
Imagine que precisamos de um campo chamado CPF no nosso formulrio de cadastro e
os dados recebidos neste campo precisam ser
recuperados no back-end.
Apesar de habilitarmos o plugin Perfil de
Usurio, no conseguimos atender demanda. A forma mais fcil seria customizar o
plugin Perfil de Usurio, mas, quem disse
que quero facilitar?
Anatomia do componente com_users
O componente com_users um dos mais
complexos do CMS Joomla sendo responsvel por todas as aes relativas aos usurios. Interage simultaneamente com diversas

564/683

tabelas do banco de dados. Abaixo temos a


estrutura do componente.
figura: estrutura com_users

Os diretrios e arquivos do back-end (/administrator/components) so responsveis

565/683

por gerenciar todas as aes administrativas


do componente com_users:
Cadastro de usurio
Edio do cadastro
Excluso de usurio
Cadastro de grupo
Edio de grupo
Exlcuso de grupo
Cadastro de nvel de acesso
Edio de nvel de acesso
Excluso de nvel de acesso
Cadastro de notas de usurios
Edio de notas de usurios
Excluso de notas de usurios
Listagem de usurios
Listagem de grupos
Listagem de nveis de acesso
Listagem de notas de usurios
Os diretrios e arquivos do front-end (/components) so responsveis por gerenciar todas as aes de:
Cadastro de usurio

566/683

Edio do perfil do usurio


Login do usurio
Relembrar senha
Resetar a senha
Nossa customizao deve ser feita nas duas
camadas do componente (back-end e frontend), dessa forma poderemos interagir com
os dados na rea administrativa e criar uma
nova listagem com nome e CPF. Ou seja, criaremos uma nova viso.
(MVC) Model-view-controller
O componente foi desenvolvido seguindo o
modelo (MVC) Model-view-controller, atualmente considerado um Design_Patterns
(padro de projeto) utilizado na Engenharia
de Software. O modelo isola a "lgica da aplicao" da interface do usurio (Inserir e exibir dados), permitindo desenvolver, editar e
testar separadamente cada parte. A separao da lgica e interface um dos conceitos de WEB 2.0

567/683

O Model ( Modelo ) responsvel por operaes relacionadas ao Banco de dados tambm conhecidas pelo acrnimo CRUD (
Create Read Update Delete).
A View ( Viso ) responsvel por apresentar
os formulrios do componente responsveis
por inserir, editar e apagar dados, alm do
resultado das consultas realizadas contra o
banco de dados.
O Controller ( Controlador ) responsvel
por gerenciar e relacioanr as tarefas do
Model e da View.
Customizao do com_users (Back-end)
Gerenciamento de usurios
Iniciaremos a customizao do componente
pela parte administrativa, a mais complexa.
Registrar o campo cpf no manifesto de
formulrio
No Joomla! 3, todos os campos do

568/683

formulrio so passados via XML, mais um


avano em direo a Web 2.0.
Com a IDE de sua preferncia abra o arquivo
user.xml localizado em administrator/components/com_users/models/forms/.
Este
manifesto responsvel por apresentar o
form de cadastro com seus respectivos campos.
Insira o trecho de cdigo em negrito, abaixo:
figura: Registrando o campo cpf no manifesto de formulrio

Agora, precisamos criar os relacionamentos


do campo ( cpf ) com a tabela do componente com_users.

569/683

figura: Resultado no back-end

Criando o novo campo na tabela #__users


A tabela ou entidade #__users a responsvel por armazenar os dados digitados durante o cadastro do usurio.
Usaremos o programa phpMyAdmin, para
criarmos a nova coluna ou atributo cpf, no
nosso banco de dados. O programa um editor de SQL que permite operaes contra o
banco de dados em ambiente grfico, de
forma simples e sem necessidade de linha de
comando.

570/683

Em ambiente local basta digitarmos http://localhost/phpmyadmin


e
teremos
acesso ao programa, em ambiente remoto
siga as instrues do painel de controle do
seu provedor
figura: Painel de controle do phpMyAdmin

A esquerda temos listados todos os bancos


de dados existentes no SGBD MySQL. O
nome do banco de dados do meu site de
estudo joomla3.
Para acessar as tabelas basta clicar sobre o
nome do banco de dados.

571/683

figura: Acesso ao Banco de dados

No frame central do phpMyAdmin busque


pela tabela #__users e clique sobre o seu
nome para visualiz-la em detalhes. Lembrese que o Joomla! 3 cria prefixos randmicos
para as tabelas durante a instalao. Portanto, substitua o #__ pelo prefixo de tabelas
do seu banco de dados. Na imagem anterior
podemos perceber que o prefixo das tabelas
do meu projeto h0gpe.
Clique na aba Estrutura para visualizar as
colunas da tabela.

572/683

figura: Colunas da tabela #__users

Aps as acolunas temos uma barra de ferramentas que permite criar uma nova, basta
escolher o local e clicar no boto executar.
figura: Criando a coluna cpf

Perceba na imagem que estamos adicionando uma coluna depois da coluna username.
Agora, basta preencher os parmetros da
coluna e clicar no boto Salvar.
figura: Parmetros da coluna

573/683

A coluna cpf foi criada e podemos continuar


a customizao de nosso componente.
Registrar o campo cpf na biblioteca user do
Joomla
O novo campo deve ser inserido na classe
JUser que estende a classe Jobject. O arquivo a ser customizado o user.php localizado
em /libraries/joomla/user/.
O registro feito com a insero do cdigo
abaixo, em negrito. O trecho de cdigo entre
/** e */ so comentrios.
figura: Registrando o campo cpf na biblioteca user do Joomla

574/683

Registrar o campo cpf na biblioteca user da


biblioteca table do Joomla
O objetivo desse registro verificar se o
campo CPF foi deixado em branco, um tipo
de validao a nvel de servidor e se existem
CPFs duplicados no banco. A validao do
CPF e verificao de duplicidade devem ser
inseridos na classe JTableUser que estende a
classe JTablet. O arquivo a ser customizado
o user.php localizado em /libraries/joomla/
table/user/.
A validao do CPF feita com a insero do
cdigo abaixo, em negrito. O trecho de
cdigo entre // so comentrios.
figura: Validao cpf

575/683

Na imagem abaixo temos a mensagem impressa na tela, que impede o cadastro do


usurio, alertando sobre a necessidade de
preencher o campo CPF. A constante no foi
traduzida, por isso uma mensagem inteligvel. Ao final do captulo, todas sero
traduzidas.
figura: Mensagem de erro

A verificao de duplicidade feita com a insero do cdigo, abaixo, em negrito. O


trecho de cdigo entre /** e */ so
comentrios.

576/683

figura: Verifica duplicidade CPF

Na imagem abaixo temos a mensagem impressa na tela, que impede o cadastro do


usurio, alertando sobre a duplicidade de
CPF no banco de dados . A constante no foi
traduzida, por isso uma mensagem inteligvel. Ao final do captulo, todas sero
traduzidas.
figura: Mensagem de erro CPF duplicado

Cadastrando um novo usurio

577/683

Aps criarmos a coluna cpf no banco de dados chegou a hora de testar o que foi feito at
agora, cadastrando um novo usurios atravs
do back-end do site.
figura: Usurio cadastrado com sucesso

Perceba na imagem acima que um novo


usurio foi cadastrado e o campo cpf foi
preenchido.
No banco de dados podemos observar que o
valor digitado no campo cpf, para o novo
usurio, est gravado na coluna cpf da tabela
#__users.
O usurio admin foi criado durante a instalao do Joomla e por isso no possui cpf

578/683

grvado na base. Basta editar o seu perfil e incuir o cpf para que a devida gravao ocorra
com sucesso.
figura: Registro cpf gravado no banco de dados

Registrar o campo cpf no template de


listagem
Clicando no boto Salvar e Fechar, aps o cadastro do novo usurio, voc perceber que o
CPF no est aparecendo.
O componente usa trs templates para
mostrar o retorno da consulta aos registros
gravados no banco de dados:
default.php lista todos os registros
encontrados;
default_batch.php template com as
opes de filtro; e

579/683

modal.php template com opes de


edio de dados com uso de modal.
O arquivo que nos interessa o default.php
que est localizado em administrator/components/com_users/views/users/tmpl/.
Insira o cdigo abaixo, em negrito, no arquivo default.php.
figura: Customizao do arquivo

580/683

Perceba que o componente usa tabelas para


montar o template, mais um ponto de
destaque para o recurso de Override de Templates que srugiu com o Joomla! 1.6 e foi
aprimorado agora no Joomla! 3.x.
Nosso cdigo customizado est dividido em
duas partes:
Aps a linha 54 criamos uma nova
coluna e registramos a constante
JGLOBAL_CPF; e
Aps a linha 127 criamos uma nova
coluna e recuperamos o registro cpf,
da tabela #__com_users.
Agora o campo cpf est integrado viso de
listagem de registros.
figura: Registro do cpf integrado listagem padro do componente

581/683

Uma boa prtica para seus desenvolvimentos


futuros obervar o seguinte:
Os templates das vises (VIEWS) que
retornam registros, so nomeadas
no
plural.
Ex:components/
com_users/views/users/tmpl/
Os templates das vises (VIEWS) que
montam formulrios so nomeadas no singular. Ex:components/
com_users/views/user/tmpl/
Customizao do com_users (Front-end)
Formulrio de cadastro O pior j passou,
a customizao do Front-end do componente
muito simples.
Quando clicamos no hiperlink Criar uma
conta, no front-end, abrimos o formulrio de
cadastro de usurio. O processo de cadastro
envolve os seguintes arquivos:
models/forms/registration.xml

neste manifesto ficam declarados os


campos do formulrio; e

582/683

views/registration/tmpl/default.php
arquivo que carrega os campos do
form
Abra o arquivo registration.xml na sua IDE
preferida e insira o cdigo abaixo, em
negrito:
figura: Registration xml
figura: Resultado no front-end

Perceba que a constante, sem traduo para


o idioma e o campo do formulrio j esto
aparecendo e podemos efetuar o cadastro do
novo usurio normalmente.
Traduo de Constantes
Override de Idiomas do com_users (Back-end)

583/683

Estamos terminando a customizao do


componente, vamos traduzir as constantes
criadas de forma simples e rpida, usando o
recurso de Override de Idiomas.
Iniciaremos com o Back-end, vamos ao
passo-a-passo:
Navegue pelo menu superior Extenses Gerenciador de Idiomas
Sobreposies;
na aba Filtrar, selecione o idioma
Portgus Brasil Administrador;
clique no boto Novo;
no campo Constante de Idioma digite
a primeira constante que criamos, a
COM_USERS_REGISTER_CPF_LABE
no campo Texto, digite CPF
clique no boto Salvar e Fechar.
No back-end, abra o formulrio para cadastrar um novo usurio. Na imagem abaixo
temos o resultado, perceba que a label do
formulrio est traduzida, faltando apenas
sua descrio.

584/683

figura: Constante COM_USERS_REGISTER_CPF_LABEL traduzida

Repita o processo para as outras constantes


que foram criadas durante a customizao
do componente, a saber:
COM_USERS_REGISTER_CPF

Texto: Nr do CPF do Usurio


JGLOBAL_CPF Texto: CPF
JLIB_DATABASE_ERROR_PLEASE_E
Texto: Digite o nr do CPF
JLIB_DATABASE_ERROR_CPF_INUS
Este CPF j est cadastrado no
Sistema

585/683

Na imagem abaixo temos o resultado final do


processo.
figura: final do processo

Traduo de Constantes
Override de Idiomas do com_users (Front-end)

Para finalizar a customizao do componente, vamos traduzir as duas constantes criadas no Front-end.
Navegue pelo menu superior Extenses Gerenciador de Idiomas
Sobreposies;

586/683

na aba Filtrar, selecione o idioma


Portgus Brasil Site;
clique no boto Novo;
no campo Constante de Idioma digite
a primeira constante que criamos, a
COM_USERS_REGISTER_CPF_LABE
no campo Texto, digite CPF
clique no boto Salvar e Fechar.
Repita o processo para a constante
COM_USERS_REGISTER_CPF, digitando
no campo Texto: Nr do CPF do Usurio.
As sobreposies (overrides) ficam listadas
no Gerencidor de Idiomas.
figura: Sobreposies criadas para o site

587/683

Repita o processo para o idioma ingls e todos os outros que possuir no seu projeto.
Plugin Usurio Perfil
Antes de sairmos alterando o cdigo-fonte
do componente bom conhecermos o plugin
do tipo usurio, Perfil. Este plugin nativo
no Joomla! 3.x e trabalha em sincronia com
o com_users aumentando os campos
comuns do cadastro. Para habilt-lo basta
seguir pelo menu superior Extenses
Gerenciador de Plugins.
Habilitando o plugin de Perfil de Usurios
Para habilitar o plugin basta nevegar pelo
menu superior Extenses Gerenciador de
Plugins e habilitar o plugin Perfil de Usurio.
Automaticamente ele ser inserido no formulrio do cadastro padro do Joomla.

588/683

figura: Cadastro com plugin habilitado

Os dados dos campos do plugin Perfil de


Usurio ficam disponveis no back-end,
menu superior Gerenciador de Usurios,
na aba Perfil de Usurio. Esta aba foi fica
disponvel aps a habilitao do plugin.
Perceba que na imagem acima, temos um
link para os Termos de Servio, habilitado.
Criando um Termo de Servio/Uso

589/683

Um dos destaques desse plugin a capacidade de relacionar e incorporar ao cadastro


um artigo que contenha os termos de servio/uso do site. Lojas virtuais e sites adultos
so exemplos de projetos que precisam dessa
funcionalidade.
Para criar e relacionar um Termo de Uso ao
plugin faa o seguinte:
navegue pelo menu superior Contedo
Gerenciador de Artigo Novo artigo;
crie um artigo comum com os termos de uso
do seu site;
acesse o plugin Perfil de Usurio;
selecione o artigo a ser utilizado (1);
escolha o artigo no modal (2);
habilite o plugin e clique no boto Salvar e
Fechar.

590/683

figura: Termos de Uso habilitado.

figura: cadastro modificado

Cadastro de usurio via front-end

591/683

No front-end do site clique na opo de criar


uma conta e observe os vrios campos que
surgiram. No prprio plugin, na aba Opes
Bsicas, podemos escolher quais os campos
sero ou no mostrados. No exemplo, deixarei apenas Endereo 1, cidade e CEP. Observe a imagem abaixo. Aps configurar o
seu plugin Usurio Perfil, algo parecido deve ser visualizado.
figura: cadastro modificado

Vamos preencher o cadastro e efetuar o registro de um usurio fictcio, o user 1.

592/683

figura: cadastro do user 1 efetuado com sucesso

CRUD efetuado no Registro


Quando efetuamos o cadastro de um usurio
em nosso site, algumas aes de CRUD so
praticadas contra o banco de dados.Nessa
operao, interagimos com a tabela
#__users que ser responsvel por
armazenar no banco de dados, todas as informaes do registro.
Com a habilitao do plugin Usurio Perfil,
passamos a utilizar tambm, a tabela

593/683

#__users_profiles que ser responsvel por


armazenar as informaes digitadas no formulrio do plugin. Atravs de um relacionamento entre tabelas, a integridade estar
garantida e temos certeza que as informaes digitadas no form do plugin, pertencem ao mesmo usurio do form de cadastro padro do Joomla.
Na imagem abaixo temos as tabelas
#__users e #__user_profiles que so afetadas no processo. A tabela #__user_notes
utilizada quando criamos notas para os
usurios e no est no escopo deste tutorial.
figura: tabelas afetadas

Estrutura das Tabelas


Observe a estrutura da tabela #__user_profiles e perceba que o campo user_id

594/683

armazena o valor do campo id, chave


primria (PK), da tabela #__users. O campo
user_id da tabela #__user_profiles, uma
chave estrangeira (FK), responsvel pelo
relacionamento entre as tabelas.
figura: estrutura tabela #__user_profiles

Alterando o manifesto xml do plugin


Vamos trabalhar com a insero do campo
CPF antes do campo Endereo 1 do plugin
Usurio Perfil. Logo, iremos customizar o
manifesto xml do plugin, que est localizado
em seusite/plug-ins/user/profile/profiles/
profile.xml

595/683

figura: manifesto xml

Abra o arquivo na sua IDE preferida e antes


do campo address1 insira o campo CPF de
acordo com a imagem abaixo.
figura: Inserindo o cpf no manifesto xml

596/683

Perceba as caractersticas do campo que foi


inserido no manifesto xml do plugin Usurio
Perfil.
Campos no XML x Campos na Tabela
A insero dos campos criados no manifesto
xml, na tabela #__user_profiles,
automtico facilitando muito a utilizao do
recurso por usurios leigos. Uma vez criado
o novo campo no arquivo xml, o seu identificador nico (id) ser a (key) do campo profile_key da tabela. Ex: o campo id=cpf do
manifesto xml ser identificado na tabela
#__user_profiles, por profile.cpf.
Ainda que em um primeiro momento possa
parecer um risco segurana, permitir que o
usurio crie qualquer campo no formulrio
de registro, vale lembrar que o prprio
Joomla! possui vrias regras de segurana
para impedir ataques, por exemplo do tipo
SQL INJECTION, muito utilizados em formulrios.

597/683

Aps inserirmos o campo no manifesto xml,


devemos voltar ao front-end para cadastrarmos um novo usurio.
figura: campo cpf sem traduo

Override de Idiomas para as constantes


criadas
Perceba que o campo est disponibilizado no
formulrio, entretanto, falta traduzir a constante e sua descrio. Faremos isso atravs
de overrides ou sobreposio de idiomas.
Navegue pelo menu superior Extenses ->
Gerenciador de Idiomas -> Sobreposies.
No filtro, escolha Portugus (Brasil) Site e
clique no boto novo. Em constante do
idioma cole a constante utilizada no description do manifesto xml. Em texto, digite o seu

598/683

significado. Faa o mesmo processo para o


campo label e clique no boto Salvar e
Fechar. Este processo deve ser repetido para
todas as inseres efetuadas no plugin.
Na imagem seguinte temos a constante
traduzida atravs de override de idioma.
figura: constante CPF traduzida

Validao
digitados

Autenticao

de

dados

A validao dos dados digitados no novo


campo ser garantida por regras existentes
ou ainda por novas regras inseridas em
diretrio especfico do site. Em nosso exemplo, usaremos uma regra de validao e
Autenticao de CPF criada pelo joomleiro
Bruno Batista e disponibilizada sob licena
GNU/GPL,
em
http://www.livrodejoomla.com.br
O destaque da regra fica por conta da

599/683

Autenticao do CPF, ou seja, voc precisa


digitar um CPF verdadeiro para que o cadastro prossiga.
Utilizao da regra
Autenticao de CPF

de

Validao

1) Copie (ctrl+c) todo o contedo do arquivo


cpf.php;
2) Abra sua IDE preferida e altere o manifesto xml do plugin Usurio Perfil, de
acordo com o demonstrado no cdigo
seguinte:
3) crie um novo arquivo em branco;
4) Cole (ctrl+v), todo o contedo copiado anteriormente; e
5) Salve com o nome de cpf.php em libraries/joomla/form/rules

600/683

figura:regra para validao e autenticao de CPF

Teste de Cadastro com Validao


Autenticao do CPF digitado

No front-end do site tente cadastrar um novo


usurio, sem inserir um CPF vlido.
Experimente utilizar um CPF qualquer,

601/683

caracteres do tipo strings e tudo o mais o


que sua imaginao permitir para observar a
regra em ao.
Para obter xito no cadastro, o CPF deve existir e ser digitado no formato: 3nr.3nr.3nr-2nr. Ex:111.111.111-11
Editando o CPF no back-end do site
O ltimo passo visualizar se o CPF do
usurio est disponvel no back-end do seu
site Joomla.
Acesse o back-end e navegue pelo menu superior Usurios -> Gerenciador de Usurios > Editar Usurio. Lembre-se de fazer override para a constante do CPF, observando
que o escopo agora administrao e no
site.

602/683

figura: campo CPF no perfil do usurio

figura: campo CPF aps override de idioma

Chegamos ao final deste captulo, um


captulo recheado de dicas avanadas e contedo tcnico.
Uma desvantagem no processo de customizao de componentes nativos do Joomla, a
possibilidade de perder tudo durante uma
atualizao de verso. Logo, aconselho a
fazer um backup do que customizou e
guardar em local seguro.
Com certeza a forma mais fcil seria utilizar
um override de layout para o componente ou
at mesmo criar um plugin, porm, escrevi

603/683

este livro pensando nos meus alunos e


usurios novatos, autodidatas. Geralmente
comeo os meus cursos dizendo: Eu no estou aqui para te dar o peixe, estou aqui para
te ensinar a pescar. Vamos pelo caminho
mais difcil, pois s assim, saberemos nos defender quando for preciso.
Acesse http://www.livrodejoomla.com.br/
insumos/?#a20 para baixar o site de estudo
com instalador, para verificao e anlise do
funcionamento e alteraes abordadas neste
captulo.

Captulo 20 Override de Templates


Introduo
Overrides ou substituies de layout so funcionalidades nativas do CMS, que permitem
alterar a camada de viso de determinada extenso. Joomla nos permite substituir o layout das seguintes extenses e/ou tens:
Mdulo chrome - a decorao em
torno de uma disposio de mdulo
Arquivos de idiomas a substituio
de determinadas tradues de constantes foi abordada no captulo
anterior;
Override de templates a substituio do layout do template do site foi
abordada no captulo de templates
quando fizemos nosso clone;
Override de templates de mdulos
a substituio do template padro de

605/683

mdulo pode ser efetuada em


qualquer mdulo do Joomla;
Parmetro item de menu novos tipos de tens de menu so necessrios
para verificarmos o funcionamento
de determinadas sobreposies;
Override de template de artigo substituio da sada padro de um
artigo; e
Override de templates de componentes substituio do template
padro de componente. Iremos criar
um novo layout para o componente
com_users.
Mdulo Chrome
Observe a imagem abaixo:
"jdoc:include" utilizado para incluso de
mdulos em determinada posio do template, o "style" um atributo opcional.

606/683

O trecho (style=container) diz ao joomla


para procurar uma funo chamada modchrome_container no arquivo padro usado
pelo Joomla ou no utilizado pelo template. O
estilo padro est includo no arquivo modules.php em templates/system/html. Estilos
adicionais podem ser definidos como funes em um arquivo modules.php no
diretrio html do template padro do site.
Este arquivo pode conter n funes de estilos
para os mdulos.
No declaramos classes PHP no arquivo
modules.php e sim funes. Isto gera uma
vantagem sutil quando se trata de acrescentar um novo estilo chrome. Uma vez que
no tem quaisquer nomes de classe, ns no
precisamos de uma conveno de nomenclatura para as classes. Ns s precisamos
encontrar o arquivo PHP e inclu-lo. Abaixo
temos um exemplo de funo utilizada no
module.php

607/683

figura:

A funo passa trs argumentos.


O primeiro argumento, $module, um objeto contendo as seguintes informaes:
id O identificador nico do mdulo
na tabela #__module;
title O ttulo do mdulo digitado no
Gerenciamento de Mdulos no backend do site. Por exemplo: Login
Form;
module O nome do diretrio do
mdulo. Por exemplo: mod_login;
position A posio do mdulo no
template;
content O texto html que ser
mostrado na pgina, dentro da funo do mdulo chrome;

608/683

showtitle Define se o ttulo do mdulo ser exibido ou no, de acordo


com o escolhido no Gerenciamento
de Mdulos no back-end do site;
params Os parmetros do mdulo
no formato JSON;
menuid O identificador nico do
tem de menu responsvel por renderizar o mdulo;
user no utilizado;
name Nome do mdulo. Por exemplo: login; e
style O estilo do mdulo escolhido
com jdoc:include elemento.
O segundo argumento o objeto JRegistry
com os parmetros para este mdulo. Isto
conveniente para verificar o valor de
qualquer parmetro dentro da funo
chrome.
O terceiro argumento um array com os atributos de jdoc:include element. Por exemplo: name, style e etc.

609/683

Note que voc pode entrar com qualquer atributo no jdoc: include tag e estes estaro
disponveis na funo modChrome. Isto
pode ser til para personalizar ainda mais a
aparncia de mdulos. Suponha, por exemplo, que seu mdulo chrome tenha uma
borda em torno dele e voc gostaria de
definir a largura da borda na criao da
posio no template. Uma forma de isso ser
implementado seria adicionar um atributo
chamado border_width no jdoc: include element e depois ler este atributo dentro da
funo chrome para definir a largura (por exemplo, usando uma classe css diferente com
base no valor border_width).
Continuando a anlise do cdigo restante da
funo modChrome_container, percebemos
que a primeira linha do bloco if/endif checa
se a varivel $module no est vazia (mdulo
despublicado, sem contedo) e caso positivo
nada ser mostrado.

610/683

Caso negativo, ou seja, a varivel $module


possui contedo, montada uma div e o contedo do mdulo apresentado no
navegador.
Criando um novo estilo
Para ver o funcionamento do mdulo
chrome e criao de estilos, vamos criar um
novo estilo de mdulo para o nosso modelo
personalizado, andromeda. Aconselho utilizar o navegador firefox + complemento firebug para o processo. Vamos ao passo-apasso:
Crie uma nova funo modChrome
no arquivo modules.php para o template andromeda;
Use o novo estilo na declarao
jdoc:include no arquivo index.php do
template; e
Atribua um mdulo para esta
posio.

611/683

Visando economizar tempo, copiaremos


(ctrl+c) a funo modChrome_table existente no arquivo modules.php que est localizado
em
templates/system/htm/modules.php e colaremos (ctrl+v) no final do arquivo modules.php do template andromeda,
localizado em templates/andromeda/html/
modules.php. Agora, vamos alterar o nome
da funo PHP para modChrome_andromedaFrameTable. Ao final do processo o
arquivo modules.php do template andromeda deve ficar parecido com a imagem
abaixo:

612/683

figura: funo inserida no arquivo modules.php do template andromeda

A funo simples e tem o objetivo de apresentar o resultado das varivies em uma


tabela. importante observar a necessidade
de se renomear a funo copiada do templates/system/html/modules.php, tendo em
vista que haveria um erro de processamento
do PHP, caso no tivssemos procedido
dessa maneira. Vamos incrementrar e instanciar a funo. A primeira customizao
visando melhorar a sada, ser incluir o

613/683

atributo border na tabela. Altere o trecho do


cdigo, de acordo com o demonstrado
abaixo:

figura:

importante declararmos a varivel $border


para evitarmos problemas de processamento. A no declarao acarretaria
mensagens do tipo NOTICE do PHP.
Para visualizarmos o resultado no front-end
do site, precisamos criar uma nova posio
de mdulo no template andromeda e instanciarmos este estilo.
Acesse o back-end do site e no Menu Superior Extenses Gerenciador de Templates,
clique na aba Templates esquerda. Na lista
que ser montada clique no nome
Andromeda Details and Files para editar o
template andromeda e depois em Edit main
page Template para abrir a index.php em

614/683

modo de edio.
Aperte as teclas (ctrl+f) para pesquisar e digite if ($this->countModules('position-7')). A
primeira opo encontrada o trecho de
cdigo que iremos utilizar. Copie todo o
trecho de cdigo de acordo com o demonstrado abaixo para sua IDE preferida, pode
ser o bloco de notas:
figura:

Agora vamos retirar a <div> e alterar o nome


da posio com o estilo que desejamos. O
cdigo deve ficar exatamente como demonstrado abaixo:
figura: index.php do template andromeda aps customizao

615/683

(*) Estou usando o template andromeda,


mas voc pode usar qualquer template. Templates que utilizam frameworks tipo (Gantry,
T3, Gavern e etc...) podem oferecer um grau
de dificuldade maior na edio da index.php.
Neste caso procure o diretrio blocks e altere
o arquivo desejado.
Para testarmos o resultado parcial da alterao, vamos copiar o mdulo Login Form e
publicando sua cpia na posio novaposicao
do template andromeda. Acesse o Menu Superior Extenses Gerenciador de Mdulos, marque o checkbox do mdulo Login
Form e clique no boto Duplicar. Clique no
nome do mdulo copiado para edit-lo e no
parmetro posio digite novaposicao apertando em seguida a tecla enter. A posio
no aparecer nas opes do Select do sistema, tendo em vista no estar no manifesto
.xml do template. Porm, aps acionarmos a
tecla enter, a mesma gravada no banco de
dados.

616/683

figura: mdulo copiado

Para visualizar o resultado no front-end atualize o site. Agora, basta dar asas a imaginao e alterar o que quiser na forma de apresentao dos mdulos.

figura:

Alterando a forma de sada de um Template


de Mdulo

617/683

Para o nosso primeiro exemplo, vamos dizer


que queremos mudar a forma como nosso
mdulo Latest News apresenta os artigos no
navegador.
figura: Mdulo ltimas notcias

Especificamente,
queremos
incluir
a
primeira parte de cada artigo abaixo do ttulo
do artigo. Para fazer isso, vamos criar um
modelo substituto para o layout do mdulo.
Ou seja, faremos um Override no template
do mdulo.
Configurando o loadposition do mdulo para os dados de exemplo
Primeiro, vamos criar um artigo simples com
uma chamada ao mdulo Latest News. No
back-end navegue pelo menu superior

618/683

Contedo -> Gerenciador de artigo -> Novo


e crie um artigo chamado Mdulo Latest
News para edio, na categoria Uncategorized, com o seguinte contedo:
Este mdulo mostra as ltimas notcias de
determinada categoria ou de todas as categorias publicadas no site.
{loadmodule mod_articles_latest}
figura: Instanciando mdulo em artigo

Perceba que se trata de um artigo, mas estamos usando o plugin loadmodule para inserir o mdulo no corpo do artigo. O
comando {loadmodule mod_articles_latest},
diz ao Joomla para inserir o mdulo articles_latest, neste ponto do corpo do artigo.

619/683

Agora, navegue pelo menu superior


Extenses -> Gerenciador de Mdulos e
clique sobre o nome do Latest News para abrir o modo edio. Se o mdulo no estiver
instalado, clique em novo e crie um Mdulo
do tipo Latest News. Na imagem abaixo
alterei o ttulo do mdulo para ltimas
Notcias.
figura: Editando o mdulo

Agora, acesse o front-end do site para visualizar o artigo criado. Se voc o setou como
destaque ele estar na pgina inicial. Caso
contrrio, clique sobre o ttulo do artigo no
mdulo ltimas Notcias. O artigo deve estar
parecido com a figura abaixo:

620/683

figura: Resultado no front-end

A primeira parte da tela (1) a primeira


parte do artigo, antes da tag {loadmodule}. A
parte inferior da tela (2) o mdulo ltimas
Notcias listando os artigos, de acordo com
os parmetros escolhidos no back-end. Perceba que o layout original apresenta o resultado em uma simples lista de ttulos de
artigos, onde os ttulos so links para o contedo dos artigos.
Criando o arquivo de sobreposio do
layout

621/683

Agora, como que vamos comear o processo de personalizao deste layout? A


primeira coisa que precisamos fazer
descobrir onde o layout original est localizado. O arquivo responsvel pelo layout original do mdulo, chama-se default.php e est localizado no diretrio tmpl do mdulo
mod_articles_latest.
Para acess-lo a partir da raiz do site siga por
modules/mod_articles_latest/tmpl.
Agora que sabemos o diretrio do layout
padro, precisamos colocar o nosso arquivo
de substituio. Para tal, copie (ctrl+c) os arquivos do subdiretrio tmpl contido no
diretrio mod_articles_latest, crie um
diretrio mod_articles_latest dento do
diretrio html do template do site e cole
(ctrl+v) os arquivos copiados. Em nosso
caso, estamos usando o template andromeda
que foi copiado a partir do protostar. O caminho completo para a cpia do diretrio do
mdulo : templates/andromeda/html. Aps

622/683

copiar o diretrio voc deve visualizar o


seguinte caminho, com os arquivos default.php e index.html: templates/andromeda/html/mod_articles_latest
Editando o arquivo default.php
Agora, iremos customizar o arquivo default.php que est dentro do dietrio copiado. Ele ser carregado em substituio ao
arquivo default.php padro do mdulo, enquanto estivermos usando o template andromeda no site. A imagem abaixo demonstra o cdigo-fonte do arquivo default.php,
padro do mdulo.

623/683

figura: arquivo default.php padro do mdulo

Perceba que um arquivo simples e com


poucas linhas de cdigo. A linguagem de
marcao de texto HTML alterna com a linguagem de programao PHP. Isto uma caracterstica comum aos scripts (arquivos)
PHP.
A
primeira
linha
do
arquivo
defined(_JEXEC) or die; define que o
mesmo s pode ser executado pelo sistema.
Esta linha fundamental para garantir a segurana do processamento do mdulo;

624/683

Em seguida montada uma lista desordenada atravs da tag HTML <ul> </ul> O
prximo passo usar o comando foreach
para criar um loop e instanciar as variveis
$list, $item e $link; e
Finalmente apresentar o ttulo ($item->title)
com link para o artigo ($item->link), dentro
da lista montada.
Vamos fazer uma pequena alterao no arquivo apenas para quebrar o gelo. Quel tal
inserirmos um ttulo com a tag HTML < h1
>, antes do instanciamento das variveis?
Veja na imagem abaixo, o pedao de cdigo
inserido. Lembre-se que o arquivo customizado foi o default.php do template andromeda. Ou seja, o que est em templates/andromeda/html/
mod_articles_latest/.

625/683

figura: customizao do arquivo de override default.php

Este apenas um exemplo simples, para


quebrar o gelo. Lembre-se que voc poderia
fazer qualquer coisa, ou seja: inserir uma imagem, alterar cores, inserir uma tabela(no
recomendado), enfim, customizar da forma
que voc bem desejar.
Acessando o front-end do site podemos observar o resultado da insero da tag <h1>
no template do mdulo e temos certeza que o
Joomla est utilizando o arquivo de override.

626/683

figura: resultado do override no front-end

Customizao Avanada do Layout


Se olharmos de novo para o arquivo default.php do template andromeda(/templates/amdromed/html/
mod_articles_latest/default.php),
vemos
que ele est extraindo o ttulo e link para o
artigo de uma varivel chamada $item. O
comando foreach percorre uma matriz
(array), por isso sabemos que $lista um array de objetos e que cada objeto na matriz
est disponvel na varivel $item.

627/683

Sabemos que $item tem pelo menos dois


campos, link e ttulo, porque so usados no
layout. No entanto, no sabemos quais so as
outras informaes disponveis. O que fazer?
Vamos
inserir
o
comando
vard_dump($item) no arquivo default.php,
dentro do loop foreach. Desta forma, o PHP
ir mostrar todo o contedo da varivel
$item. Na imagem abaixo temos a alterao
efetuada.

628/683

figura: inserindo comando var_dump no cdigo-fonte

Atualize o front-end do site e visualize o resultado na tela. O comando var_dump printa


na tela, todos os dados existentes na varivel
$item.

629/683

figura: resultado do var_dump no front-end

Usando um depurador PHP, obtemos a


mesma informao, atravs da insero de
uma parada no cdigo no ponto onde adicionamos o comando var_dump. Desta
forma podemos examinar as variveis dentro

630/683

do depurador. Usando a imagem acima por


referncia, percebemos que $item um objeto do tipo stdClass.
O objeto stdClass construdo no PHP,
sendo semelhante a uma matriz. Podemos
acessar cada campo em um objeto stdClass
usando a notao <object variable> ->
<field name>.
O cdigo do layout padro $item-> title, nos
retorna o campo ttulo dentro do objeto
$item. A sada tambm nos diz o tipo de cada
campo (string, inteiro, e assim por diante), o
seu valor, e seu comprimento. Enfim, temos
mais campos relacionados ao artigo
disponvel no layout padro, basta us-los se
necessrio.
O objetivo final do nosso exemplo apresentar alm do ttulo, a primeira parte de
cada artigo e para isso precisamos de um
campo introtext. Este campo armazena todo

631/683

o texto de um artigo at o Leia mais, caso


exista. Se o artigo no possuir Leia mais, ele
armazena todo o texto do artigo. Nossa
primeira idia seria usar a funo substr
PHP, que nos permite encontrar parte de
uma string com base na posio.
A imagem abaixo demonstra a customizao
do arquivo de override default.php com a insero
do
cdigo
da
linha
28
objetivando a apresentao dos 50 primeiros
caracteres de cada artigo, alm do ttulo.

632/683

figura: alterao do arquivo default.php para apresentao de um texto


de introduo

Acessando o front-end do site visualizamos o


resultado final obtido com a customizao do
arquivo de override.

633/683

figura: resultado final do override do template do mdulo


mod_articles_latest

Perceba que o mdulo est apresentando o


texto de introduo seguido de ..., alm do
ttulo do artigo (2) e para retirar o texto
Override de Mdulo (1), basta retirar a tag
<h1> inserida durante a customizao do default.php.
primeira vista, parece ser o que queremos.
Entretanto, se algum dos artigos possurem

634/683

uma imagem no incio, teremos um problema na visualizao. Como resolver?


Usando a funo do PHP, strip_tags que retira todas as tags do HTML e PHP da varivel setada. Abra o arquivo de override, default.php e altere o trecho de cdigo adicionado. Observe abaixo:
figura: cdigo alterado

Estamos quase l, agora o problema est


relacionado ao corte de palavras que so retornadas. A soluo usar o mtodo truncate() que est localizado no arquivo
string.php em libraries/joomla/html/html/.
A customizao final da linha 28 do arquivo
de override default.php deve ficar da
seguinte forma:
figura: cdigo alterado

Novo tipo de tem de menu

635/683

Se voc est acostumado a fazer sites em


html, imagine um item de menu, como o
boto de link do seu site. No Joomla temos
vrios tipos de itens de menu e j foram
estudados anteriormente.
Para criarmos um override de template de
artigo devemos seguir uma sequncia lgica
que se inicia com a criao de um novo tem
de menu. Vamos ao passo-a-passo:
Na raiz do site localize o arquivo responsvel pelo tem de menu padro
de artigo do Joomla, chamado "default.xml" e localizado em componentes/com_content/article/views/
article/tmpl/
Copie (ctrl + c) os arquivos index.html e default.xml;
No diretrio templates/andromeda,
crie o diretrio com_content dentro
do diretrio html e o subdiretrio
article dentro de com_content.

636/683

O caminho completo aps o processo deve


ser: templates/andromeda/html/com_content/article/
Cole (Ctrl + v) os arquivos dentro do
diretrio que voc acabou de criar;
Renomeie o arquivo default.xml para
andromeda.xml;
Altere o arquivo andromeda.xml de
acordo com o cdigo abaixo, em
negrito:
figura: xml alterado

Perceba que precisaremos registrar a


traduo das constantes criadas, no idioma
padro do site. O procedimento idntico ao
utilizado para registrar as constantes criadas
no campo CPF. Acesse o Gerenciador de
Idiomas e faa as sobreposies para as constantes:
com_content_article_view_andromeda_title - Layout

637/683

Personalizado
com_content_article_view_andromeda_option Artigo com layout dos Termos de Servio
No back-end do site, crie um artigo chamado
Termos de Servio;
No menu superior Menus Main Menu
Adicionar Item de Menu (Aba Detalhes
Tipo de tem de Menu) clique no boto Selecionar Artigos e escolha o novo tipo de
tem de menu Layout Personalizado;
figura: novo tipode item de menu

Selecione o artigo Termos de Servio.


Override de Layout para Artigos
Os parmetros relacionados a artigos so
acionados pelo boto Opes que pode ser
visualizado no menu superior Artigos.
Todos os itens de sada (autor, ttulo,

638/683

categoria e etc.) so configurados nesse


boto.
Ns criamos um novo tipo de tem de menu e
associamos nosso artigo Termos de Servio,
ao tem. Agora, vamos ao passo-a-passo para
sobrepormos o template padro de artigos.
Na raiz do site localize o arquivo responsvel
pelo layout padro do Joomla, um arquivo
chamado "default.php" que est localizado
em
componentes/com_content/article/
views/article/tmpl/
figura: template padro de artigos

Este arquivo PHP recebe as variveis passadas pelo boto opes localizado no menu
superior Artigos

639/683

Copie (ctrl + c) o arquivo default.php;


Cole (Ctrl + v) o arquivo dentro do diretrio
criado
anteriormente:
templates/andromeda/html/com_content/article/
Renomeie o arquivo para andromeda.php;
Abra o arquivo em sua IDE preferida e exclua todo o contedo, exceto o trecho de
cdigo abaixo.

figura:

Vamos criar uma classe CSS para nossa div e


inserir um vdeo do youtube no template.
Altere o cdigo iniciado por <div> e terminado em </div>, por:

640/683

figura:

Acesse o front-end e veja o resultado do


Override. Agora, d asas a sua imaginao e
aproveite a lgica em seus projetos.
figura:

Alterando o
com_users

template

do

componente

641/683

Agora iremos alterar a sada do componente


que customizamos, inserindo uma imagem
de fundo e alterando a apresentao do cadastro de usurios. O primeiro passo ser
clonar o template padro do site de forma
explicada no captulo 16.
Devemos habilitar o plugin Perfil do Usurio
de acordo com o captulo 20 e criar um
Termo de Uso.
Aps definir o template Andrmeda para
padro do site e habilitar o plugin Perfil de
Usurio, acesse o front-end para verificar as
mudanas a serem feitas.

642/683

figura:

Perceba que estou usando o template clonado e o plugin est habilitado.


Os dados do perfil ficam aps os dados do registro e dependendo do tamanho do formulrio podem criar um efeito visual ruim
em que o usurio tenha que ficar rolnado a
tela.
O ideal seria utilizarmos Abas sequenciais
parecidas com as que existem no back-end,
tipo: passo1, passo2, passo n...
Vamos comear o processo de sobreposio

643/683

do nosso template de registro do componente com_users.


Override de Arquivos
O primeiro passo ser fazer a sobreposio
(Override) dos arquivos default.php e defaul.xml. Navegue pela raiz do site e copie
(ctrl + c) os dois arquivos que esto em components/com_users/views/registration/tmpl. No diretrio /templates/andromeda/
html/ do site, crie o diretrio com_users e
dentro dele o subdiretrio registration. Cole
( ctrl + v ) os arquivos copiados e um arquivo
index.html em branco. Ao final do processo
teremos a seguinte situao:
/templates/andromeda/html/com_users/registration/default.php e
/templates/andromeda/html/com_users/registration/default.xml.

644/683

figura: Arquivos copiados

Para termos certeza que estamos usando o


template de override iremos alterar o cdigofonte do arquivo default.php, inserindo <h1>
Template sobreposto </h1> no incio do processamento do cdigo.

figura:

Inserindo
Template

uma

imagem

de

fundo

no

645/683

Vamos estudar o arquivo default.php.


Os campos do formulrio de cadastro esto
englobados pelas tags <form> e </form>. O
formulrio possui uma classe de estilos chamada class="form-validate form-horizontal".
Podemos inserir a imagem de fundo de vrias formas:
No arquivo default.php;
Na classe form-validate form-horizontal; e
Criando uma tag body e uma nova
classe para englobar os campos do
form.
Vou optar pela terceira opo.
Criando uma nova classe de css
A ideia mantermos as alteraes centralizadas no default.php. Logo, abra o arquivo default.php na sua IDE preferida e insira o
cdigo abaixo, em negrito na imagem:

646/683

figura:

O que fizemos com esse trecho de cdigo?


Inserimos uma tag div antes do formulrio e
inserimos uma chamada in line ao seguinte
estilo:
O fundo da div possui uma imagem
de fundo chamada img-fundoform.png;
Esta imagem est em templates/andromeda/html/com_users/
registration/;
Ela no deve ser repetida;

647/683

Seu posicionamento ser 500 px da


margem esquerda e 50 px da margem
topo.
Na imagem abaixo temos o resultado final do
override de template de cadastro do componente com_users.
figura: Resultado final no front-end

Agora com voc, d asas a sua imaginao e


utilize o recurso de override sempre que for
necessrio. Lembre-se que este recurso pode
ser o diferencial entre instalar ou no, uma

648/683

extenso de terceiros, desnecessria ao seu


projeto.

Captulo 21 Criando um novo plugin


Introduo
O nosso componente com_users foi customizado e temos um novo layout de cadastro.
Para completarmos o projeto iremos criar
um plugin para validar o cadastro de usurios do nosso site.
A ideia que nosso usurio confirme ter 18
anos ou mais.
Plug-in de validao de idade
S relembrando, plugin um script simples
desenvolvido em PHP e tem a funo de executar determinada tarefa.
Criaremos um checkbox de idade e o plugin
ir verificar se o mesmo foi clicado pelo
usurio. Caso o retorno seja falso, ou seja, se
o usurio no marcar o checkbox, o processo
de registro ser interrompido.

650/683

Quando enviamos dados usando o mtodo


POST, os valores do formulrio so guardados na varivel global do PHP chamada
$_REQUEST. Os valores so guardados em
um array associativo, onde a chave para a
matriz o atributo nome de cada elemento
de entrada. Se um elemento de entrada no
possui um nome para o atributo, ele no
salva. Assim, precisamos adicionar nomes de
atributos para o novo campo do tipo checkbox, do formulrio.
Plugin ValidaIdade
O plugin de validao ser composto dos
arquivos:
validaidade.php arquivo principal
do plugin;
validaidade.xml manifesto para instalao e parametrizao;
pt-BR.plg_user_validaidade.ini

traduo para o portugus;

651/683

pt-BR.plg_user_validaidade.sys.ini
traduo para o portugus (sistema);
en-GB.plg_user_validaidade.ini

traduo para o ingls;


en-GB.plg_user_validaidade.sys.ini
Traduo para o ingls (sistema); e
form.xml formulrio.
Criando o plugin de validao
Existem vrias formas de criar extenses no
Joomla e optaremos pelo mtodo conhecido
por reaproveitamento de cdigo, muito utilizado na Programao Orientada a Objetos.
O mtodo consiste em utilizar cdigos de
outros plug-ins do tipo Usurio e adaptarmos nossa necessidade.
Vamos ao passo-a-passo:
Crie um subdiretrio chamado validaidade,
dentro do diretrio plugins/user;
Copie o arquivo index.html (em branco) de

652/683

qualquer outro plugin e cole dentro do subdiretrio validaidade;


figura: subdiretrio do novo plugin

Usando o cdigo-fonte de qualquer outro


manifesto de plugin do tipo users, crie o arquivo chamado validaidade.xml, ele ser o
manifesto de instalao do nosso plugin e
ficar localizado em plugins/users/validaidade/. O cdigo-fonte do manifesto deve
ficar da seguinte forma:

653/683

Arquivo validaidade.xml
figura: Arquivo validaidade.xml

Usando o cdigo-fonte de qualquer outro


plugin do tipo users, crie o arquivo principal
do nosso plugin, o validaidade.php, cujo
cdigo-fonte est descrito abaixo:

654/683

figura: Arquivo validaidade.php

Usando a nova classe JForm e o novo evento


form adicionados na verso 1.6 do Joomla,
poderemos substituir o formulrio de inscrio dentro do plugin, sem criar um arquivo separado e um item de menu alternativo. A classe JForm ser responsvel pela
validao e deveremos fazer as seguintes
aes:
criar um subdiretrio forms dentro do
diretrio plugin/user/validaidade;

655/683

abrir o manifesto validaidade.xml do plugin


e inserir a linha de cdigo forms que j foi
feito anteriormente; e
criar o arquivo form.xml abaixo, que far a
implementao da classe JForm.
figura:

Discover (Descobrir)
Uma novidade pouca explorada no Joomla! 3
a funo Discover (Descobrir) que auxilia
na criao de extenses. Pode ser acessada
atravs do menu superior Extenses Gerenciador de Extenses Menu a esquerda
[Descobrir].
Ao clicarmos no hiperlink Descobrir, o sistema busca por alguma extenso rf, que

656/683

no tenha sido instalada nos padres do


Joomla e permite sua instalao a partir do
back-end do site.
Navegue pelo menu superior Extenses
Gerenciador de Extenses Menu a esquerda [Descobrir]. Se tudo estiver correto
voc ver algo parecido com a imagem
abaixo.
figura: funo descobrir

Perceba que nosso plugin foi listado e agora,


basta marcar o checkbox e clicar no boto Instalar, localizado esquerda e acima, para
procedermos a instalao do mesmo.
Caso no tenha aparecido para voc, experimente Excluir o Cache e tente de novo.
Criando o pacote de instalao do plugin

657/683

Aps a criao do plugin validaidade, iremos


preparar o pacote de instalao para permitir
que o plugin seja instalado atravs do backend do site. Vamos ao passo-a-passo:
Copie (ctrl+c) todos os arquivos do plugin
validaidade que esto distribudos dentro
dos diretrios plugin/user/validaidade, administrator/language/pt-BR e administrator/language/en-GB;
Crie um diretrio chamado validaidade em
sua mquina e cole (ctrl+c) os arquivos copiados;
Crie um subdiretrio chamado language
dentro do diretrio validaidade;
Crie os arquivos de idiomas para o plugin.
Voc pode aproveitar arquivos de outros
plug-ins nativos do Joomla;
Crie um subdiretrio chamado pt-BR dentro
do diretrio validaidade/language e mova os
arquivos de idiomas que voc criou. Obrigatoriamente
devem
chamar-se:
ptBR.plg_user_validaidade.ini
e
pt-

658/683

BR.plg_user_validaidade.sys.ini;
Crie um subdiretrio chamado en-GB dentro
do diretrio validaidade/language e mova os
arquivos de idiomas que voc criou. Obrigatoriamente
devem
chamar-se:
enGB.plg_user_validaidade.ini
e
emGB.plg_user_validaidade.sys.ini;
Selecione todos os arquivos e diretrios do
diretrio validaidade e compacte criando um
arquivo chamado plg_validaidade.zip; e
figura: instalador do plugin

Acesse o back-end do site e proceda a instalao do plugin validaidade.


figura: plugin instalado

Testando o plugin ValidaIdade

659/683

Aps a instalao navegue pelo menu superior Extenses Gerenciador de Plugins e


clique sobre o nome do Plugin Usurio Valida Idade. Na aba Detalhes Estado, marque
Ativado. Na aba Opes Bsicas Mostrar a
caixa de seleo, marque Exibir.
Acesse o front-end do site e teste nosso plugin tentando efetuar um cadastro sem marcar o checkbox de idade.
figura: Teste final do plugin

Acesse http://www.livrodejoomla.com.br/
insumos/?#a19 para baixar o pacote de instalao do plugin validaidade.
Chegamos ao final da segunda edio do livro, espero ter conseguido o objetivo maior
lanado com este projeto que foi Ajudar o
usurio na criao, configurao e publicao de um site com Joomla! 3.x.
Acesse http://www.livrodejoomla.com.br/

660/683

insumos/?#a20 para baixar o site de estudo


com as alteraes no cdigo-fonte do
com_users, override de templates e plugin
de validao de idade.
O projeto final est publicado em http://www.livrodejoomla.com.br/projeto
Sucesso!!!

Anexo I - Montando um servidor seguro para Joomla!


Introduo
Abaixo listo as boas prticas para montagem
de um servidor web seguro, voltado a aplicaes PHP, particularmente Joomla,
baseado em tecnologia Linux-ApacheMySQL-PHP.
Instalao dos pacotes
aptitude install apache2 apache2-mpm-prefork
apache2-utils
apache2.2-commonbinutils build-essential
ca-certificates
curl
dbconfig-common
defoma
dpkg-dev fontconfig-config gawk javascriptcommon libapache2-mod-php5libapr1 libaprutil1 libc6-dev libcurl3 libdbd-mysql-perl
libdbi-perl libexpat1

662/683

libfontconfig1 libfreetype6 libgd2-xpm libgmp3c2 libgomp1 libhtml-templateperl libiomultiplex-perl libjpeg62 libjs-jquery libmpfr1ldbl libmysqlclient15off
libnet-cidr-perl libnet-daemon-perl libnetserver-perl libnet-snmp-perl libplrpc-perl
libpng12-0
libpq5
libssh2-1
libstdc++6-4.3-dev libt1-5
libtalloc1 libterm-readkey-perl libtimedateperl libwbclient0 libxpm4 munin-node
mysql-server
mysql-common
openssl
openssl-blacklist php5 php5common php5-gd php5-mysql php5-suhosin
psmisc ssl-cert ttf-dejavu ttf-dejavu-core ttfdejavu-extra wwwconfig-common libwwwperl htop sudo
Hardening e Tunning do Apache
Edite os seguintes parmetros do arquivo
|/etc/apache2/conf.d/security|
Server Tokens
De

663/683

ServerTokens Full
Para
ServerTokens Prod
ServerSignature
De
ServerSignature On
Para
ServerSignature Off
TraceEnable
De
TraceEnable On
Para
TraceEnable Off
(*) Nos arquivos de configurao em |/etc/
apache2/sites-available/| edite a diretiva
*Document* deixando da seguinte forma:

664/683

figura: Edio config apache

Habilite o *server-status* para adquirir estatsticas do Apache2


Crie o arquivo *server-status* em |/etc/
apache2/conf.d/| com o seguinte contedo:
SetHandler server-status
Deny from all
Allow from localhost
Adicione a seguinte linha no final do arquivo
|/etc/apache2/apache2.conf|
ExtendedStatus On
Habilite o mdulo *info*
a2enmod info

665/683

Habilite o SSL
Para
habilitar
o
SSL
acesse
tp://blog.alexos.com.br/?p=371

ht-

Tunning do Apache
As configuraes de tunning do Apache2 esto totalmente ligadas a quantidade de recursos (CPU, memria e banda) disponveis:
Por exemplo para um servidor QuadCore
com 8 GB e um link de 5Mb recomendado
a seguinte configurao:
StartServers 5
MinSpareServers 5
MaxSpareServers 10
ServerLimit 1000
MaxClients 1000
MaxRequestsPerChild 0
Descrio de cada diretiva

666/683

* StartServers (Recomendado deixar o valor


padro)
Configura o nmero de processos filhos criados
na
inicializao
http://httpd.apache.org/docs/2.0/mod/
mpm_common.html#startservers
* MinSpareServers (Recomendado deixar o
valor padro)
Nmero minimo de processos que no manipulam
requisies
http://httpd.apache.org/docs/2.0/mod/prefork.html#minspareservers
* MaxSpareServers (Recomendado deixar o
valor padro)
Nmero mximo de processos que no manipulam
requisies
http://httpd.apache.org/docs/2.0/mod/prefork.html#maxspareservers
* ServerLimit (Deve ser igual ou superior ao

667/683

MaxClients)
Valor mximo da diretiva MaxClients - http://httpd.apache.org/docs/2.0/mod/
mpm_common.html#serverlimit
* MaxClients (Varia de acordo com os recursos disponveis)
Nmero mximo de conexes simultneas http://httpd.apache.org/docs/2.0/mod/
mpm_common.html#maxclients
* MaxRequestsPerChild (0 siginifica ilmitado)
Limite de requesies que um processo filho
poder manipular - http://httpd.apache.org/
docs/2.0/mod/
mpm_common.html#maxrequestsperchild
(*) Dica Importante: Para testes de benchmark do Apache2 recomendado o uso do
AB
(Apache
Benchmark
-

668/683

http://httpd.apache.org/docs/2.0/programs/ab.html)
Hardening e Tuninng do MySQL
Execute o seguinte comando e siga os passos
recomendados:
/usr/bin/mysql_secure_installation Enter
current password for root (enter for none):
Informe a senha do root do mysql ou pressione ENTER se a senha ainda no foi configurada
Change the root password? [Y/n]
Pressione ENTER para criar uma nova senha
Remove anonymous users? [Y/n]
Pressione ENTER
Disallow root login remotely? [Y/n]
Pressione ENTER
Remove test database and access to it? [Y/

669/683

n]
Pressione ENTER
Reload privilege tables now? [Y/n]
Pressione ENTER
MySQL Tunning
Para o tunning recomendado o uso do
(MySQL Performance Tunning Primer Script
www.day32.com/MySQL/tuningprimer.sh) (*) Dica Importante: O uso desta
ferrramenta recomendado aps 48 horas
de uso do banco permitindo que o script detecte os valores corretos para o tunning do
banco. Este script validar os parmetros do
arquivo *my.cnf* e criar um novo arquivo
com as alteraes recomendadas.
Hardening do PHP
Para ampliar a segurana do PHP recomendado
o
uso
do(Suhosin
-

670/683

http://www.hardenedphp.net/suhosin.127.html ). O Debian o implementa por


padro.
Alm do suhosin necessrio desabilitar os
seguintes parmetros do arquivo |/etc/
php5/apache2/php.ini|:
allow_url_fopen = Off (*)
display_errors = Off
magic_quotes_gpc = Off (**)
(*) obrigatria a sua habilitao para a atualizao automtica do Joomla, porm potencialmente perigosa.
(**) obrigatria a sua habiltao para o
funcionamento do Joomla! Alpha
Segurana e Manuteno do S.O.
Desabilite o exim4
invoke-rc.d exim4 stop
update-rc.d exim4 remove

671/683

Hardening do SSH
Modifique as seguintes linhas do arquivo
|/etc/ssh/sshd_config|:
Port 22 para, por exemplo Port 3000
PermitRootLogin yes para PermitRootLogin
no
Limite o uso do sudo somente para o grupo
admin
Crie o grupo admin - addgroup admin
Adicione seu usurio nesse grupo adduser
seuuser admin
Configure o sudo adicionando a seguinte
linha: %admin ALL=(ALL) ALL
Desabilite o usurio root - usermod -L root
Para manter o sistema operacional e os aplicativos atualizados recomendo o uso do
(Cron-apt - http://blog.alexos.com.br/cronapt-otimizando-a-atualizacao-dosservidores-debian/ ).

672/683

Monitoramento de performance
Para monitorar a performance do servidor e
dos servios recomendo o uso do (Munin
http://munin-monitoring.org ), em http://blog.alexos.com.br/monitorandovarios-servidores-de-forma-simples-com-omunin/ voc encontra como instalar e configurar o Munin.
Agora vamos apresentar a configurao do
Munin para monitorar o Apache.
Com o`` server-status`` funcionando habilite os plugins do Apache:
cd /etc/munin/plugins

ln
-s
/usr/share/munin/plugins/
apache_processes apache_processes

ln
-s
/usr/share/munin/plugins/
apache_accesses apache_accesses
Feito isso necessrio editar o arquivo |/etc/
munin/plugin-conf.d/munin-node| e informar o usurio com permisso de acesso as

673/683

informaes do apache. No caso do Debian


este usurio o *wwwdata*.
vim /etc/munin/plugin-conf.d/munin-node
[apache2]
user www-data
E para finalizar implemente uma camada a
mais de segurana. Recomendo fortemente o
uso do (Ossec Hids - http://www.ossec.net/
) e de um pequeno script de firewall.
No
link
http://blog.alexos.com.br/
configurando-os-agentes-do-ossec-hidsautomaticamente-no-linux/ aprenderemos a
instalar e configurar o Ossec Hids.
(*) Durante a instalao do Ossec opte pela
instalao *local* ao invs do *server*, assim
a instalao ser standalone.
Script de Firewall
Crie um arquivo |/etc/init.d/firewall.sh| com
o seguinte contedo:

674/683

#!/bin/bash
# Server firewall
# Alexandro Silva
# April 27th '2010
PATH=/bin:/usr/bin:/sbin:/usr/sbin
TCPOK="123 80 443"
UDPOK="53"
iptables -F INPUT
iptables -F OUTPUT
iptables -F FORWARD
iptables -P INPUT ACCEPT
iptables -P OUTPUT ACCEPT
iptables -P FORWARD DROP
#Drop incoming malformed NULL packets
iptables -A INPUT -p tcp --tcp-flags ALL
NONE -j DROP
#Drop incoming malformed XMAS packets
iptables -A INPUT -p tcp --tcp-flags ALL
ALL -j DROP
#Syn flood protection
iptables -A INPUT -p tcp --syn -m limit -limit 1/s --limit-burst 3 -j RETURN

675/683

#Drop incoming ping request


iptables -A INPUT -p icmp --icmp-type
echo-request -j DROP
iptables -A INPUT -j ACCEPT -i lo
iptables -A INPUT -j LOG -i ! lo -s
127.0.0.1/255.0.0.0
iptables -A INPUT -j DROP -i ! lo -s
127.0.0.1/255.0.0.0
iptables -A OUTPUT -j ACCEPT -o lo
# Permit SSH in the 3000 port
iptables -A INPUT -s 0.0.0.0 -p tcp --dport
3000 -j ACCEPT
# Permit access in some TCP ports
for PORTA in $TCPOK
do
iptables -A INPUT -p tcp --dport $PORTA j ACCEPT
done
# Permit access in some UDP ports
for PORTA in $UDPOK
do

676/683

iptables -A INPUT -p udp --dport $PORTA


-j ACCEPT
done
# Drop other entering connections checking the state
iptables -A INPUT -m state --state !
ESTABLISHED,RELATED -j DROP
iptables -A FORWARD -m state --state
ESTABLISHED,RELATED -j ACCEPT
Faa o download do script no http://blog.alexos.com.br/ e adcione na inicializao do sistema
update-rc.d firewall.sh defaultsTestando a
segurana do servidor
Aps a concluso de todos estes passos use
as seguintes ferramentas para scanear o servidor e validar todo o trabalho
* W3af - http://w3af.sourceforge.net/ *
Nikto http://cirt.net/nikto2 *Netsparker www.mavitunasecurity.com/netsparker/

Insumos do Livro
Guia de Consulta
Rpida Joomla! 3.x
- 2 Edio
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.

Pacote de instalao do Joomla! 3


Extenses para o projeto proposto
Artigos de exemplo projeto
Uso avanado do Editor de Texto
TinyMCE
Plugin AllVideos
Guia de referncia CSS
Firebug
Infogrfico de Template
Infogrfico de Publicao
Documento de Viso
Insumos Idiomas

678/683

12. Insumos - Vdeo-tutorial criao do


logotipo
13. Insumos - Pgina de erro AACD
14. Insumos Navegador
15. Insumos Artigos
16. Google Developers
17. Central de Webmasters da Google
18. Manual PHP (Array)
19. Manual PHP (String)
20. API Joomla - Classe Jstring
21. Manual PHP (Filesystem)
22. Plugin validaidade
23. Valida CPF
24. Site de estudo
1. Pacote de instalao do Joomla! 3
2. Extenses para o projeto proposto
3. Artigos de exemplo projeto
4. Tudo sobre o TinyMCE
5. Download do Plugin AllVideos
6. Download do Guia CSS W3c
7. Instalar Firebug
8. Baixar Infogrfico de Templates

679/683

9. Baixar Inforgfico de Publicao


10. Baixar Modelo de Documento de
Viso
11. Insumos para o projeto - Idiomas
12. Insumos para o projeto - Vdeo-tutorial criao do logotipo
13. Insumos do projeto - Download da
Pgina de erro AACD
14. Insumos do projeto Navegador e
Complemento
15. Insumos do projeto Artigos
16. Google Developers
17. Central de Webmasters da Google
18. Manual PHP (ARRAY)
19. Manual PHP (STRINGS)
20. Manual PHP (Filesystem)
21. API Joomla - Classe Jstring
22. Dowload Plugin ValidaIdade
23. Dowload Regra validao de CPF
24. Download Site estudo (2 Edio)

Referncias
Livros
Nielsen Jakob. Projetando Websites. Brasil,
2000.
Silva, Maurcio Samy. Construindo sites com
CSS e (X)HTML. Brasil, 2008.
Kalbach James. Design de Navegao Web.
Brasil, 2009.
North, Barrie M. Joomla! 1.6: A Users
Guide. USA, 2011.
Jarvis Jeff. O que a Google faria? Brasil,
2010.
Krug Steve. No me faa pensar. Brasil,
2006.
Rebitte Leonardo, Marcus Vinicius. Dominado Tableless. Brasil, 2006.
Vaz, Conrado Adolpho, Google Marketing.
Brasil 2008.
Dexter Mark and Landry Louis, Joomla! Programming. USA 2012.

681/683

Websites e Blogs
http://www.joomlabrasilia.org
http://php.net/manual/pt_BR/index.php
http://blog.alexos.com.br/
http://docs.joomla.org/Release_and_support_cycle
http://www.youtube.com/cout45
http://www.apachefriends.org/pt_br/
xampp.html
http://support.google.com/webmasters/
http://docs.joomla.org/International_Enhancements_for_Version_1.6#Unicode_URLs
http://w3c.br/divulgacao/guiasreferencia/
css2/#mod-texto
JED
http://joomlacode.org/gf/project/jtranslation3_x/frs/

682/683

http://pixlr.com/editor/
http://msdn.microsoft.com/pt-br/library/
ms142509.aspx
http://en.wikipedia.org/wiki/P3P
http://www.w3.org/
http://br.mozdev.org/firefox/download/
https://addons.mozilla.org/pt-BR/firefox/
addon/firebug/
http://pt.wikipedia.org/wiki/Brainstorming
http://pt.wikipedia.org/wiki/MVC
http://community.joomla.org/translations/
joomla-3-translations.html
http://www.smartaddons.com/joomla/templates/template-showcase/item/345-sjjoomla3-free-template-for-joomla-30
http://pt.wikipedia.org/wiki/
Navega%C3%A7%C3%A3o_estrutural
http://pt.wikipedia.org/wiki/
Google_Analytics

@Created by PDF to ePub

Vous aimerez peut-être aussi