Visão Geral
Joomla! CMS
Visão Geral!
Por Fabio Gameleira
Joomla! Por Fabio Gameleira
1/20
Visão Geral
Historico de revisões
Data
23/06/2006
Versão
1.0
21/03/2007
1.1
Joomla! Por Fabio Gameleira
Descrição
Conteúdo inicial
Revisão e correção do url
do meu site
Responsável
Fabio gameleira
[email protected]
Fabio gameleira
2/20
Visão Geral
Índice
1 Introdução....................................................................................................................................................4
1.1 O que é Joomla CMS?..........................................................................................................................4
1.2 Em que foi desenvolvido?.....................................................................................................................4
1.3 Onde instalar o joomla?........................................................................................................................4
1.3.1 Instalar no seu micro ou servidor...................................................................................................5
1.3.2 Instalar em um provedor Internet...................................................................................................5
1.4 Onde obter a instalação do Joomla?......................................................................................................5
2 Estrutura de pastas.......................................................................................................................................6
3 Conceitos......................................................................................................................................................7
3.1 Áreas do Joomla....................................................................................................................................7
3.1.1 Área de usuários (Frontend)...........................................................................................................7
3.1.2 Área de administradores (Backend)...............................................................................................8
3.2 Nível de usuário - Papel........................................................................................................................9
3.3 Templates..............................................................................................................................................9
3.3.1 Estrutura do template...................................................................................................................10
3.3.2 Arquivos contidos na pasta do template....................................................................................12
4 Trabalhando no conteúdo...........................................................................................................................13
4.1 Seções.................................................................................................................................................13
4.2 Categorias...........................................................................................................................................13
4.3 Item de conteúdo.................................................................................................................................13
4.4 Conteúdo estático................................................................................................................................14
4.5 Menu...................................................................................................................................................15
4.6 Componentes.......................................................................................................................................15
4.7 Módulos..............................................................................................................................................17
4.8 Mambots.............................................................................................................................................18
5 Um pouco mais adentro do código............................................................................................................19
5.1 Referência de Funções........................................................................................................................19
5.2 Um exemplo básico de arquivo index.php .........................................................................................20
Joomla! Por Fabio Gameleira
3/20
Visão Geral
1 Introdução
Criei este manual para servir de orientação inicial sobre os conceitos básicos, porém
gerais do joomla e dar uma luz inicial a quem pretende conhecer e utilizar o Joomla para
administração de Conteúdo de Web sites.
Minha experiência no Joomla ainda não é muito grande, porém, o pouco que sei, apanhei
bastante, procurando informações sobre o Joomla na Internet, um pedacinho aqui outro
ali e entendendo muita coisa na tentativa e erro, pois ainda não existe um manual
completo do Joomla, em português, que possa servir como referência para aprendizado
do mesmo.
Este documento não tem o propósito de ser um manual completo e sim uma introdução
aos conceitos do joomla visando facilitar o seu entendimento.
Espero que este documento te ajude a compreender um pouco mais rápido os conceitos
básicos do Joomla.
1.1O que é Joomla CMS?
O Joomla é um Sistema de Administração de conteúdos (CMS – Content Manager
System) que permite a publicação on-line de informações em sites na Internet ou
intranet.
1.2Em que foi desenvolvido?
Foi desenvolvido utilizando a linguagem PHP e utiliza o banco de dados MySQL,
ambos software livres, assim como o Joomla.
1.3Onde instalar o joomla?
Como o PHP e o MySQL são multiplataformas, o Joomla pode ser instalado em
qualquer servidor web que suporte a instalação destes, como por exemplo o Servidor
web Apache no Linux e o servidor web da Microsoft, o IIS.
Joomla! Por Fabio Gameleira
4/20
Visão Geral
1.3.1Instalar no seu micro ou servidor.
Você deve ter um servidor web configurado, instalar o PHP, o MySQL e criar um
site “<meusite>“ no seu servidor web.
Descompactar o arquivo do Joomla dentro da pasta correspondente ao seu site.
Acessar o navegador e digitar o endereço http://localhost/<meusite>.
Siga as instruções apresentadas que ao final o Joomla estará instalado.
1.3.2Instalar em um provedor Internet
Muitos provedores de site na Internet possuem o FANTASTICO, que é um script
pronto que facilita a instalação do Joomla no provedor.
1.4Onde obter a instalação do Joomla?
Existem diversos sites que permitem baixar a última versão do Joomla.
No Brasil, recomendo o obter a cópia no site http://www.joomlabrasil.org, que é o site
da comunidade Joomla no Brasil.
Joomla! Por Fabio Gameleira
5/20
Visão Geral
2 Estrutura de pastas
Após a instalação, será criada uma estrutura de pastas no seu site conforme a seguir.
Repare as pastas administrator e templates. Nestas pastas, ficam armazenados,
basicamente, o site de administração e o template do seu site. A demais pastas você
entenderá mais a seguir, pois se tratam de módulos, componentes e outros recursos para
exibição de conteúdo do site.
Obs.: Neste caso o nome da pasta que criei para o meu site se chama “allb”.
Joomla! Por Fabio Gameleira
6/20
Visão Geral
3 Conceitos
3.1Áreas do Joomla
Quando instalamos o Joomla em um servidor web, automaticamente são instaladas
duas áreas: Área de usuários (Frontend) e Área de administração (Backend), que
correspondem respectivamente ao site principal e um site de administração do site
principal.
3.1.1Área de usuários (Frontend)
Esta área o próprio o site apresentado na web quando digitamos o endereço no
navegador.
Este, como qualquer site web, está acessível para todos os usuários.
Pode-se criar um template (Design) próprio para apresentação das informações,
utilizar um template gratuito disponível pela comunidade Joomla, ou mesmo
adequar um site para ter seu conteúdo mantido com os recursos do Joomla.
O Frontend é um site normal na web, com a diferença que podemos alterar partes
de seu conteúdo diretamente no site.
Exemplos de Frontend na web:
http://demo.joomla.org/
Template jt_millennium_train: http://demo1.joomla-templates.com/index.php?
jos_change_template=jt_millennium_train
Joomla! Por Fabio Gameleira
7/20
Visão Geral
3.1.2Área de administradores (Backend)
Este é um site que permite a administração do site principal em relação ao seu
conteúdo.
É nesta área onde informamos as partes que irão aparecer no site principal
(Módulos, componentes, etc.), como por exemplo, menu de opções, Notícias,
áreas de registros, links, download de arquivos, etc.
Para acessar a área de adminsitração, devemos fazer o login na mesma, digitando
no navegador o endereço do site, incluindo no final a palavra administrator.
Ex.: http://<seusite/administrator
Basicamente a área de administração abre exibindo o Painel de Controle e um
menu superior.
Os itens a serem exibidos no menu e no painel de controle dependerão de como
está definido o seu nível de usuário para área de administração.
Joomla! Por Fabio Gameleira
8/20
Visão Geral
3.2Nível de usuário - Papel
Cada usuário que acessa o site principal ou de administração possui um papel.
Dependendo deste papel, o usuário poderá fazer mais ou menos ações/atividades,
tanto no site quanto na área de administração.
Papéis no Site principal (Frontend)
Anonymous
Registered
Autor
Editor
Publisher.
Obs.: Os usuários do frontend não possuem acesso ao backend.
Papeis na Área de administração (BackEnd)
Manager
Administrator
Super Administrator.
Obs.: Todos os usuário do BackEnd possuem acesso total também ao frontend.
3.3Templates
Um template Joomla é uma série de arquivos que com o Joomla CMS controlam a
apresentação do conteúdo. Um template não é um web site e também não deve ser
considerado um design completo do web site.
O template define a disposição das informações no site, podendo existir de um a
diversos templates para um mesmo site.
Para produzir o efeito de web site completo, o template trabalha em conjunto com o
conteúdo armazenado no banco de dados Joomla.
Utilizando um template seguindo os padrões do joomla, você poderá migrar de um
template para outro apenas com poucos cheques, mudando completamente a cara do
seu site.
Joomla! Por Fabio Gameleira
9/20
Visão Geral
A estrutura do seu template será criada na página index.php, localizado na pasta
templates/<nome do template> que utilizará os arquivos de estilos template_css.css,
localizado na pasta templates/<nome do template>/css e imagens localizadas na
pasta templates/<nome do template>/images.
Veja o exemplo na figura para o template denominado rhuk_solarflare_ii.
No arquivo template_css.css poderá ser alterado praticamente todo tipo de
formatação do seu site, cores, tipos e tamanhos, box, etc. Isto dependerá mais de
como o arquivo index.php foi montado.
Pode-se criar quantos arquivos de estilos (css) desejar. Procure manter no arquivo
padrão template_css as informações de formatação originais do Joomla.
Para ver um arquivo template_css.css com vários estilos padrões do Joomla, acesse
http://www.joomlart.com/tutorials/templates_tutorial/understanding_mambo_css_in_5_
minutes/1.html
ou
http://livesite.compassdesigns.net/templates/livesite/css/blankcss.css
3.3.1Estrutura do template
Basicamente a estrutura do template criado no arquivo index.php, deverá estar
divido em blocos onde posicionalmente exibirá as informações.
Como, normalmente, não escrevemos conteúdo no template, apenas indicamos
áreas de conteúdo e posicionamento, a mudança, por exemplo, de um menu do
lado esquerdo para o direito do site fica bastante simples, bastando alterar pela
área de administração, a posição aonde este será exibido.
Veja a seguir uma estrutura de template em formato de mapa:
Joomla! Por Fabio Gameleira
10/20
Visão Geral
Na prática o que temos que fazer é representar este desenho utilizando o arquivo
index.php, seja através de tabelas (<TABLES>) ou através de CSS (Cascade Style
Sheet).
Nas áreas LEFT, USER 1, USER 2, RIGHT, etc, serão carregados os módulos e em
MAIN CONTENT AREA serão carregados os componentes e itens de conteúdo.
Por padrão o Joomla já cria uma lista destas áreas para serem utilizadas, porém,
essas podem ser customizadas, bastando para isto acessar no menu na área de
administração Site > Template Manager > Module Positions.
Joomla! Por Fabio Gameleira
11/20
Visão Geral
3.3.2 Arquivos contidos na pasta do template.
templateDetails.xml
Este arquivo diz ao joomla que outros arquivos são necessários quando estiver
carregando uma página web que utilize este template. Também exibe o autor,
copyright e quais arquivos participam do template (incluindo qualquer imagem
utilizada).
Um último uso deste arquivo é para instalação do template quando instalando-o
através da área de administração.
index.php
Este é o arquivo mais importante. Este estrutura o layout do site e diz ao joomla
CMS onde colocar os componentes e módulos. Este arquivo é, basicamente, uma
combinação de PHP com (X)HTML.
template_thumbnail.png
É uma pequena imagem do template (normalmente 140 pixels de largura por 90
pixels de altura). Após a instalação do template, esta pequena imagem pode ser
vista na área de administração ao passar o mouse sobre o nome do template.
Este é muito útil quando temos vários templates diferentes para um mesmo site.
css/template_css.css
Este é o arquivo de configuração de estilos padrão do joomla.
images
Qualquer imagem utilizada pelo template. Esta pasta existe aqui apenas por
questão de organização, pois algumas pessoas inserem as imagens diretamente
na pasta images principal do site.
Para adicionar um novo template você pode ir pela área de administração e
instalar o template, fazendo o upload do arquivo zip. Também é possível adicionar
novos templates manualmente, copiando-o para pasta /templates do seu site.
Existem centenas de templates gratuitos para uso com o Joomla, bastar pesquisar
na Internet.
Veja alguns templates profissionais gratuitos disponíveis para Joomla em
http://www.joomlashack.com/joomla-templates/free-joomla-templates/
Muitos templates profissionais pagos também podem ser encontrados na web, ou
pode-se adequar um template existente para exibição de seu conteúdo através do
joomla.
Joomla! Por Fabio Gameleira
12/20
Visão Geral
4 Trabalhando no conteúdo
Os templates servem para estrutura e dar forma ao seu website. Além deste o Joomla
possui objetos que são tratados e carregados no template que irão dispor do conteúdo
armazenado dentro do banco de dados do Joomla.
4.1Seções
Uma seção é uma coleção de categorias que se relacionam entre si de alguma
maneira. A seção é parte da hierarquia Seção/Categoria/Conteúdo.
A criação de seções pode ser feita no módulo de administração em Contents >
Section Manager.
4.2Categorias
Uma categoria é coleção de itens de conteúdo que se relacionam entre si.
A criação de categorias pode ser feita no módulo de administração em Contents >
Category Manager.
4.3Item de conteúdo
Um item de conteúdo é um pedaço de conteúdo dentro da hierarquia do Joomla
Um item de conteúdo pode estar associado a uma combinação de Seção/Categoria
particular ou ser um item de conteúdo estático.
Normalmente os itens de conteúdo são mostrados no corpo principal da página
(MainBody).
Por exemplo, podemos criar várias notícias a serem apresentadas e cada notícia
poder um item de conteúdo individual, possuindo cabeçalho, um texto de introdução e
texto principal, exibido através do link “Leia mais...”.
A criação de itens de conteúdo pode ser feita no módulo de administração em
Content > All Contents Itens ou Home > Contents Itens Manager (No painel de
controle)
No site http://www.igoia.info, as informações que aparecem no centro são itens de
conteúdos exibidos na frontpage (Bem vindo ao IGoia!, CMS - Sistema de
Gerenciamento de Conteúdo, Webdesigner tem que dominar CSS).
Joomla! Por Fabio Gameleira
13/20
Visão Geral
4.4Conteúdo estático
Um item de conteúdo estático também é um item de conteúdo, só que normalmente
utilizamos para exibir como se fosse uma página estática, porém, este não pertence à
hierarquia de Seção/Categoria/Conteúdo.
A principal diferença é que enquanto utilizamos itens de conteúdo organizados na
hierarquia seção/categoria/conteúdo, podemos exibir uma lista de itens
independentes entre si e cada item poderá ter uma imagem, um texto introdutório e
um link tipo “Leia mais...” para exibir o conteúdo da chamada completa.
Já no item de conteúdo estático, você terá uma única área de texto para ser exibida
por completo, praticamente ocupando a área principal de conteúdo (MainBody) do
site.
A criação de conteúdos estáticos pode ser feita no módulo de administração em
Content > Static Content Manager ou Home > Static Content Manager (No painel de
controle).
No site http://www.igoia.info, ao clicar no item do menu Segurança, será exibida uma
página criada com um item de conteúdo estático.
Joomla! Por Fabio Gameleira
14/20
Visão Geral
4.5Menu
Um menu estrutura a navegabilidade do seu site. Através destes que são carregadas
diversas funcionalidades, tais como conteúdos, Componentes, links, etc.
Basicamente o Joomla é instalado como os menus: MainMenu, OtherMenu, TopMenu
e UserMenu.
Um menu é implementado como módulo no Joomla e para que o mesmo seja exibido
e utilizado o módulo correspondente deverá estar publicado na área de administração
em Modules > Sites Modules > Modules Manager.
Ao selecionarmos um novo item de menu, a página abaixo é exibida, perguntado que
tipo de conteúdo este irá exibir.
4.6Componentes
Os componentes são elementos de conteúdo que funcionam como pequenas
aplicações no Joomla.
Normalmente são mostrados no centro da página, na área de conteúdo principal do
template (MainBody), porém isto vai depender de como está organizado seu
template.
Inicialmente o Joomla instala vários componentes como padrão, tais como:
Joomla! Por Fabio Gameleira
15/20
Visão Geral
Contact, FlexContent, Login, FrontPage, Banners, Contact (Contacto), Web Links,
Etc.
Alguns destes componentes fazem parte da própria arquitetura do joomla, tipo o
componente Frontpage e não são manipuláveis através do menu.
Um dos principais componentes é o frontpage, que estrutura as informações,
juntamente com os estilos definidos para tal no template_css.css, a serem exibidos
na primeira página.
Para exibir as informações na primeira página (Mainbody), criam-se itens de conteúdo
em uma seção/categoria e em cada idem deverá ser defindo que o mesmo será
apresentado no frontpage.
Além do componente frontpage, que no padrão do joomla é chamado pelo primeiro
item do “Main menu”, qualquer link inserido como primeiro item do menu principal
será considerado a página de abertura do seu site, desta forma, pode-se apresentar
outras estruturas na página inicial, como um conteúdo estático ou qualquer outro tipo
de componente.
A comunidade Joomla produz e atualiza constantemente centenas de novos
componentes.
Um componente muito interessante e gratuito é o FACIL FORM, que permite estender
a funcionalidade do Joomla criando formulários fantásticos. Saiba mais em
http://www.facileforms.biz/
Joomla! Por Fabio Gameleira
16/20
Visão Geral
Para usar um componente, muitas vezes temos que trabalhá-lo primeiro, fazendo isto
acessando a área de administração em Componente > Selecionando o componente e
formatando-o.
Depois criamos um item de menu, por exemplo, em MainMenu, que fará a chamada
ao componente. Para isto, acesse a área de administração Menu > MainMenu > no
Menu Manager clique em NEW, Selecione Componente no quadro Componentes,
clique em Nesta que será exibida a tela New Menu Item: Componente. Nesta tela,
você poderá dar um nome ao componente formato pro você e indicar o tipo do
componente a ser utilizado.
4.7Módulos
Os módulos estendem a capacidade do Joomla com novas funcionalidades e
permitem mostrar seus conteúdos em qualquer posição que o template permita.
Estes são mais fáceis de instalar pela área de administração.
Como padrão o Joomla instala alguns módulos tais como:
Main Menu (Menu Principal)
Top Menu (Menu Superior)
Template Chooser (Selector de templates)
Polls (Enquetes)
Hit Counter (Contador de Visitas),
Banner;
Breadcrumbs Module;
Feed Display;
Footer;
Latest News;
Login Form;
Menu Module;
Most Read Content;
Newsflash;
etc.
A exibição destes módulos se dará posicionalmente, conforme definido na estrutura
do template criado (left, legals, newsflash, pathway, right, toolbar, top,etc). Ao utilizar
um módulo você indicará aonde o mesmo deverá ser apresentado.
Joomla! Por Fabio Gameleira
17/20
Visão Geral
Existem diversos novos módulos que podem ser obtidos gratuitamente disponíveis
pela comunidade Joomla além de ser permitido o próprio usuário criar um novo
módulo (Customer Module).
Para acessar os módulos, entre na área de administração e acesse Modules > Sites
Modules.
4.8Mambots
São pequenas funções orientada a tarefas que intercepta um conteúdo antes que
este seja mostrado e manipulado de alguma
Como exemplo de mambots sito os editores WYSIWYG, permitem a edição dos
conteúdos como se estivéssemos em um processador de texto.
Finalizando, componentes, módulos e mambots são as extensões que complementam as
funcionalidades do Joomla e você pode encontrar muito mais junto à comunidade Joomla.
Só para você ter uma idéia, acesse: http://extensions.joomla.org/
Joomla! Por Fabio Gameleira
18/20
Visão Geral
5 Um pouco mais adentro do código
5.1Referência de Funções
As funções a seguir estão disponíveis para os desenvolvedores de template e
carregam o componente, template, etc onde os mesmos estiverem referenciados no
template, index.php.
1. mosLoadComponent
a. Syntax: mosLoadComponent( $name )
b. Objetivo: Carrega um componente . Não incluir prefixo "com_"
2. mosCountModules
a. Syntax: mosCountModules( $position_name )
b. Objetivo: Conta a quantidade ed módulos que serão exibidos na página corrente na
posição “position_name".
3. mosLoadModules
a. Syntax: mosLoadModules( $position_name [, $style] )
b. Objetivo: Exibe todos os módulos que estão associados a posição "position_name"
para página corrente. O argumento “style" é opcional e podem ser:
i. 0 = (default display) Modules are displayed in a column.
ii. 1 = Modules are displayed horizontally. Each module is output in the cell of
a wrapper table.
iii. -1 = Modules are displayed as raw output and without titles.
iv. -2 = Modules are displayed in X-Joomla format.
v. -3 = Modules are displayed in a format that allows, for example, stretchable
rounded corners.
4. mosShowHead
a. Syntax: <?php mosShowHead(); ?>
b. Objetivo: Assembles various head tags including the title tag and several meta tags.
5. mosMainBody
a. Syntax: <?php mosMainBody(); ?>
b. Objetivo: Inclui a saída do componente como determinado pelo valor de option na
URL.
Joomla! Por Fabio Gameleira
19/20
Visão Geral
5.2Um exemplo básico de arquivo index.php
Neste exemplo o arquivo está utilizando CSS para posicionamento do template,
porém pode-se utilizar tabelas para este propósito sem nenhum problema.
<?php defined( '_VALID_MOS' ) or die( 'Direct Access to this location is not allowed.' ); ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="<?php echo _LANGUAGE; ?>" xml:lang="<?php echo
_LANGUAGE; ?>"
<head>
<meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" />
<?php
if ($my->id) { initEditor(); } ?>
<?php mosShowHead(); ?>
<script type="text/javascript"> </script>
<!--http://www.bluerobot.com/web/css/fouc.asp-->
<link xhref="templates/<?php echo $cur_template; ?>/css/template_css.css" rel="stylesheet" type="text/css"
media="screen" />
</head>
<body>
<div id="wrap">
<div id="header">
<?php echo $mosConfig_sitename; ?> <?php mospathway() ?>
</div>
<div id="sidebar-left">
<?php mosLoadModules('left');?>
</div>
<div id="content">
<?php mosLoadModules('top');?> <?php mosMainBody(); ?>
</div>
<div id="sidebar-right">
<?php mosLoadModules('right');?>
</div>
<div id="footer">
<?php include_once( $mosConfig_absolute_path .'/includes/footer.php');?>
</div>
</div>
<!--end of wrap-->
</body>
</html>
** Fim ***
Joomla! Por Fabio Gameleira
20/20