Viso Geral

Joomla! CMS Viso Geral!

Por Fabio Gameleira

Joomla! Por Fabio Gameleira

1/20

Viso Geral

Historico de revises
Data 23/06/2006 21/03/2007 Verso 1.0 1.1 Descrio Contedo inicial Reviso e correo do url do meu site Responsvel Fabio gameleira fabiogameleira@gmail.com Fabio gameleira

Joomla! Por Fabio Gameleira

2/20

Viso Geral

ndice
1 Introduo....................................................................................................................................................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 instalao do Joomla?......................................................................................................5 2 Estrutura de pastas.......................................................................................................................................6 3 Conceitos......................................................................................................................................................7 3.1 reas do Joomla....................................................................................................................................7 3.1.1 rea de usurios (Frontend)...........................................................................................................7 3.1.2 rea de administradores (Backend)...............................................................................................8 3.2 Nvel de usurio - 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 contedo...........................................................................................................................13 4.1 Sees.................................................................................................................................................13 4.2 Categorias...........................................................................................................................................13 4.3 Item de contedo.................................................................................................................................13 4.4 Contedo esttico................................................................................................................................14 4.5 Menu...................................................................................................................................................15 4.6 Componentes.......................................................................................................................................15 4.7 Mdulos..............................................................................................................................................17 4.8 Mambots.............................................................................................................................................18 5 Um pouco mais adentro do cdigo............................................................................................................19 5.1 Referncia de Funes........................................................................................................................19 5.2 Um exemplo bsico de arquivo index.php .........................................................................................20

Joomla! Por Fabio Gameleira

3/20

Viso Geral

1 Introduo
Criei este manual para servir de orientao inicial sobre os conceitos bsicos, porm gerais do joomla e dar uma luz inicial a quem pretende conhecer e utilizar o Joomla para administrao de Contedo de Web sites. Minha experincia no Joomla ainda no muito grande, porm, o pouco que sei, apanhei bastante, procurando informaes sobre o Joomla na Internet, um pedacinho aqui outro ali e entendendo muita coisa na tentativa e erro, pois ainda no existe um manual completo do Joomla, em portugus, que possa servir como referncia para aprendizado do mesmo. Este documento no tem o propsito de ser um manual completo e sim uma introduo aos conceitos do joomla visando facilitar o seu entendimento. Espero que este documento te ajude a compreender um pouco mais rpido os conceitos bsicos do Joomla.

1.1O que Joomla CMS?

O Joomla um Sistema de Administrao de contedos (CMS Content Manager System) que permite a publicao on-line de informaes 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 so multiplataformas, o Joomla pode ser instalado em qualquer servidor web que suporte a instalao destes, como por exemplo o Servidor web Apache no Linux e o servidor web da Microsoft, o IIS.

Joomla! Por Fabio Gameleira

4/20

Viso 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 endereo http://localhost/<meusite>. Siga as instrues 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 instalao do Joomla no provedor.

1.4Onde obter a instalao do Joomla?

Existem diversos sites que permitem baixar a ltima verso do Joomla. No Brasil, recomendo o obter a cpia no site http://www.joomlabrasil.org, que o site da comunidade Joomla no Brasil.

Joomla! Por Fabio Gameleira

5/20

Viso Geral

2 Estrutura de pastas
Aps a instalao, 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 administrao e o template do seu site. A demais pastas voc entender mais a seguir, pois se tratam de mdulos, componentes e outros recursos para exibio de contedo do site. Obs.: Neste caso o nome da pasta que criei para o meu site se chama allb.

Joomla! Por Fabio Gameleira

6/20

Viso Geral

3 Conceitos
3.1reas do Joomla
Quando instalamos o Joomla em um servidor web, automaticamente so instaladas duas reas: rea de usurios (Frontend) e rea de administrao (Backend), que correspondem respectivamente ao site principal e um site de administrao do site principal.

3.1.1rea de usurios (Frontend)

Esta rea o prprio o site apresentado na web quando digitamos o endereo no navegador. Este, como qualquer site web, est acessvel para todos os usurios. Pode-se criar um template (Design) prprio para apresentao das informaes, utilizar um template gratuito disponvel pela comunidade Joomla, ou mesmo adequar um site para ter seu contedo mantido com os recursos do Joomla. O Frontend um site normal na web, com a diferena que podemos alterar partes de seu contedo diretamente no site.

Exemplos de Frontend na web:

http://demo.joomla.org/ Template jt_millennium_train: http://demo1.joomlatemplates.com/index.php?jos_change_template=jt_millennium_train

Joomla! Por Fabio Gameleira

7/20

Viso Geral

3.1.2rea de administradores (Backend)

Este um site que permite a administrao do site principal em relao ao seu contedo. nesta rea onde informamos as partes que iro aparecer no site principal (Mdulos, componentes, etc.), como por exemplo, menu de opes, Notcias, reas de registros, links, download de arquivos, etc. Para acessar a rea de adminsitrao, devemos fazer o login na mesma, digitando no navegador o endereo do site, incluindo no final a palavra administrator. Ex.: http://<seusite/administrator Basicamente a rea de administrao abre exibindo o Painel de Controle e um menu superior. Os itens a serem exibidos no menu e no painel de controle dependero de como est definido o seu nvel de usurio para rea de administrao.

Joomla! Por Fabio Gameleira

8/20

Viso Geral

3.2Nvel de usurio - Papel

Cada usurio que acessa o site principal ou de administrao possui um papel. Dependendo deste papel, o usurio poder fazer mais ou menos aes/atividades, tanto no site quanto na rea de administrao. Papis no Site principal (Frontend) Anonymous Registered Autor Editor Publisher. Obs.: Os usurios do frontend no possuem acesso ao backend. Papeis na rea de administrao (BackEnd) Manager Administrator Super Administrator. Obs.: Todos os usurio do BackEnd possuem acesso total tambm ao frontend.

3.3Templates
Um template Joomla uma srie de arquivos que com o Joomla CMS controlam a apresentao do contedo. Um template no um web site e tambm no deve ser considerado um design completo do web site. O template define a disposio das informaes 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 contedo armazenado no banco de dados Joomla. Utilizando um template seguindo os padres 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

Viso Geral A estrutura do seu template ser criada na pgina 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 formatao 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 padro template_css as informaes de formatao originais do Joomla. Para ver um arquivo template_css.css com vrios estilos padres 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 informaes. Como, normalmente, no escrevemos contedo no template, apenas indicamos reas de contedo e posicionamento, a mudana, por exemplo, de um menu do lado esquerdo para o direito do site fica bastante simples, bastando alterar pela rea de administrao, a posio aonde este ser exibido. Veja a seguir uma estrutura de template em formato de mapa:

Joomla! Por Fabio Gameleira

10/20

Viso Geral

Na prtica o que temos que fazer representar este desenho utilizando o arquivo index.php, seja atravs de tabelas (<TABLES>) ou atravs de CSS (Cascade Style Sheet). Nas reas LEFT, USER 1, USER 2, RIGHT, etc, sero carregados os mdulos e em MAIN CONTENT AREA sero carregados os componentes e itens de contedo. Por padro o Joomla j cria uma lista destas reas para serem utilizadas, porm, essas podem ser customizadas, bastando para isto acessar no menu na rea de administrao Site > Template Manager > Module Positions.

Joomla! Por Fabio Gameleira

11/20

Viso Geral

3.3.2 Arquivos contidos na pasta do template.

templateDetails.xml Este arquivo diz ao joomla que outros arquivos so necessrios quando estiver carregando uma pgina web que utilize este template. Tambm exibe o autor, copyright e quais arquivos participam do template (incluindo qualquer imagem utilizada). Um ltimo uso deste arquivo para instalao do template quando instalando-o atravs da rea de administrao. index.php Este o arquivo mais importante. Este estrutura o layout do site e diz ao joomla CMS onde colocar os componentes e mdulos. Este arquivo , basicamente, uma combinao de PHP com (X)HTML. template_thumbnail.png uma pequena imagem do template (normalmente 140 pixels de largura por 90 pixels de altura). Aps a instalao do template, esta pequena imagem pode ser vista na rea de administrao ao passar o mouse sobre o nome do template. Este muito til quando temos vrios templates diferentes para um mesmo site. css/template_css.css Este o arquivo de configurao de estilos padro do joomla. images Qualquer imagem utilizada pelo template. Esta pasta existe aqui apenas por questo de organizao, pois algumas pessoas inserem as imagens diretamente na pasta images principal do site. Para adicionar um novo template voc pode ir pela rea de administrao e instalar o template, fazendo o upload do arquivo zip. Tambm possvel 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 disponveis para Joomla em http://www.joomlashack.com/joomla-templates/free-joomla-templates/ Muitos templates profissionais pagos tambm podem ser encontrados na web, ou pode-se adequar um template existente para exibio de seu contedo atravs do joomla.

Joomla! Por Fabio Gameleira

12/20

Viso Geral

4 Trabalhando no contedo
Os templates servem para estrutura e dar forma ao seu website. Alm deste o Joomla possui objetos que so tratados e carregados no template que iro dispor do contedo armazenado dentro do banco de dados do Joomla.

4.1Sees
Uma seo uma coleo de categorias que se relacionam entre si de alguma maneira. A seo parte da hierarquia Seo/Categoria/Contedo. A criao de sees pode ser feita no mdulo de administrao em Contents > Section Manager.

4.2Categorias
Uma categoria coleo de itens de contedo que se relacionam entre si. A criao de categorias pode ser feita no mdulo de administrao em Contents > Category Manager.

4.3Item de contedo
Um item de contedo um pedao de contedo dentro da hierarquia do Joomla Um item de contedo pode estar associado a uma combinao de Seo/Categoria particular ou ser um item de contedo esttico. Normalmente os itens de contedo so mostrados no corpo principal da pgina (MainBody). Por exemplo, podemos criar vrias notcias a serem apresentadas e cada notcia poder um item de contedo individual, possuindo cabealho, um texto de introduo e texto principal, exibido atravs do link Leia mais.... A criao de itens de contedo pode ser feita no mdulo de administrao em Content > All Contents Itens ou Home > Contents Itens Manager (No painel de controle) No site http://www.igoia.info, as informaes que aparecem no centro so itens de contedos exibidos na frontpage (Bem vindo ao IGoia!, CMS - Sistema de Gerenciamento de Contedo, Webdesigner tem que dominar CSS).
Joomla! Por Fabio Gameleira

13/20

Viso Geral

4.4Contedo esttico
Um item de contedo esttico tambm um item de contedo, s que normalmente utilizamos para exibir como se fosse uma pgina esttica, porm, este no pertence hierarquia de Seo/Categoria/Contedo. A principal diferena que enquanto utilizamos itens de contedo organizados na hierarquia seo/categoria/contedo, podemos exibir uma lista de itens independentes entre si e cada item poder ter uma imagem, um texto introdutrio e um link tipo Leia mais... para exibir o contedo da chamada completa. J no item de contedo esttico, voc ter uma nica rea de texto para ser exibida por completo, praticamente ocupando a rea principal de contedo (MainBody) do site. A criao de contedos estticos pode ser feita no mdulo de administrao 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 Segurana, ser exibida uma pgina criada com um item de contedo esttico.

Joomla! Por Fabio Gameleira

14/20

Viso Geral

4.5Menu
Um menu estrutura a navegabilidade do seu site. Atravs destes que so carregadas diversas funcionalidades, tais como contedos, Componentes, links, etc. Basicamente o Joomla instalado como os menus: MainMenu, OtherMenu, TopMenu e UserMenu. Um menu implementado como mdulo no Joomla e para que o mesmo seja exibido e utilizado o mdulo correspondente dever estar publicado na rea de administrao em Modules > Sites Modules > Modules Manager. Ao selecionarmos um novo item de menu, a pgina abaixo exibida, perguntado que tipo de contedo este ir exibir.

4.6Componentes
Os componentes so elementos de contedo que funcionam como pequenas aplicaes no Joomla. Normalmente so mostrados no centro da pgina, na rea de contedo principal do template (MainBody), porm isto vai depender de como est organizado seu template. Inicialmente o Joomla instala vrios componentes como padro, tais como:
Joomla! Por Fabio Gameleira

15/20

Viso Geral Contact, FlexContent, Login, FrontPage, Banners, Contact (Contacto), Web Links, Etc.

Alguns destes componentes fazem parte da prpria arquitetura do joomla, tipo o componente Frontpage e no so manipulveis atravs do menu. Um dos principais componentes o frontpage, que estrutura as informaes, juntamente com os estilos definidos para tal no template_css.css, a serem exibidos na primeira pgina. Para exibir as informaes na primeira pgina (Mainbody), criam-se itens de contedo em uma seo/categoria e em cada idem dever ser defindo que o mesmo ser apresentado no frontpage. Alm do componente frontpage, que no padro do joomla chamado pelo primeiro item do Main menu, qualquer link inserido como primeiro item do menu principal ser considerado a pgina de abertura do seu site, desta forma, pode-se apresentar outras estruturas na pgina inicial, como um contedo esttico 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 formulrios fantsticos. Saiba mais em http://www.facileforms.biz/

Joomla! Por Fabio Gameleira

16/20

Viso Geral Para usar um componente, muitas vezes temos que trabalh-lo primeiro, fazendo isto acessando a rea de administrao 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 administrao 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.7Mdulos
Os mdulos estendem a capacidade do Joomla com novas funcionalidades e permitem mostrar seus contedos em qualquer posio que o template permita. Estes so mais fceis de instalar pela rea de administrao. Como padro o Joomla instala alguns mdulos 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 exibio destes mdulos se dar posicionalmente, conforme definido na estrutura do template criado (left, legals, newsflash, pathway, right, toolbar, top,etc). Ao utilizar um mdulo voc indicar aonde o mesmo dever ser apresentado.

Joomla! Por Fabio Gameleira

17/20

Viso Geral Existem diversos novos mdulos que podem ser obtidos gratuitamente disponveis pela comunidade Joomla alm de ser permitido o prprio usurio criar um novo mdulo (Customer Module). Para acessar os mdulos, entre na rea de administrao e acesse Modules > Sites Modules.

4.8Mambots
So pequenas funes orientada a tarefas que intercepta um contedo antes que este seja mostrado e manipulado de alguma Como exemplo de mambots sito os editores WYSIWYG, permitem a edio dos contedos como se estivssemos em um processador de texto.

Finalizando, componentes, mdulos e mambots so as extenses que complementam as funcionalidades do Joomla e voc pode encontrar muito mais junto comunidade Joomla. S para voc ter uma idia, acesse: http://extensions.joomla.org/

Joomla! Por Fabio Gameleira

18/20

Viso Geral

5 Um pouco mais adentro do cdigo

5.1Referncia de Funes
As funes a seguir esto disponveis 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 . No incluir prefixo "com_" 2. mosCountModules a. Syntax: mosCountModules( $position_name ) b. Objetivo: Conta a quantidade ed mdulos que sero exibidos na pgina corrente na posio position_name". 3. mosLoadModules a. Syntax: mosLoadModules( $position_name [, $style] ) b. Objetivo: Exibe todos os mdulos que esto associados a posio "position_name" para pgina 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 sada do componente como determinado pelo valor de option na URL.

Joomla! Por Fabio Gameleira

19/20

Viso Geral

5.2Um exemplo bsico de arquivo index.php

Neste exemplo o arquivo est utilizando CSS para posicionamento do template, porm pode-se utilizar tabelas para este propsito 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