Joomla! 1.

5
Construindo um sistema online no mnimo tempo possvel.

Captulo 1

O que CMS ? Quando optar por um CMS? O que o Joomla! ? Quais suas vantagens? Quais suas desvantagens? Joomla vs. Drupal Referncia de pginas em Joomla! A Estrutura do Joomla! Direitos de acesso Contedos Extenses Suportes do Joomla!

O que CMS?
CMS ou Content Management System, um programa desenvolvido para facilitar a gesto de um contedo (dados)

Quais as reais necessidades do cliente? Qual a complexidade do projeto? Qual o prazo e oramento do projeto? Quais as particularidades do projeto?

Quando optar por um CMS?

O que o Joomla! ?
WCMS (Web Content Management System)

Quais suas vantagens?

free um dos mais utilizados do mundo Equipe de desenvolvimento de mais de 45.000 programadores registrados Open Source Fcil instalao e manuteno No precisa contratar programadores ou designers Vem com diversas funcionalidades prontas

Pesa mais no seu servidor, do que se voc programasse o sistema O servidor deve estar apto a receber o Joomla! mais difcil alterar algo pronto pro Joomla! ou programar algo pra ele Provavelmente no atender suas necessidades se seu sistema tiver muitos detalhes incomuns

Quais suas desvantagens?

Joomla! vs. Drupal

O Drupal voltado para integrao de sistemas heterogneos, d ao desenvolvedor mais liberdade, porm mais complexo para aprender O Joomla! tambm d timo suporte a integrao, mas com interface mais fcil e gil.

Referncia de pginas em Joomla! www.cnt.com.br

www.porsche.com.br www.danone.com/ www.joomla.org www.adagaffneyshaff.com www.janettenorton.info www.urth.tv www.unric.org www.academiadopalestrante.com.br www.galeriamalivillasboas.com.br/site/ www.oscarfilho.com.br/standup/ www.rapkolik.net/

Estrutura do Joomla!
1. Front-End: o seu site da forma que seus visitantes e usurios registrados vem. 2. Back-End: a rea de administrao, onde voc define como ser a estrutura vsivel de seu site, assim como os recursos do Joomla! que sero utilizados na implementao de seu site. Eg.: Configurao, manuteno, limpeza, criao de esttisticas, reas restritas aos usurios registrados e criao de novos contedos. o Back-End fica numa URL diferente do site.

Direitos de acesso

H vrios grupos de acesso pr-definidos no Joomla! Cada um com um grau de direitos e responsabilidades diferentes. Por padro, voc comea como SuperAdministrador.

Direitos de acesso
Grupos de Usurios com acesso Front-End do Joomla! Grupo Registrado Autor Direitos de Acesso Pode Logar-se e ver o que o visitante comum no pode. Ele faz tudo que o registrado faz e pode escrever informaes alm de alterar sua informao. Geralmente h um link no menu de usurio para tal Faz tudo que um autor faz e ainda pode escrever e mudar qualquer informao do front-end Faz tudo que um editor faz e ainda decide o tempo de vida de alguma informao do site. Pode publicar e despublicar o que quiser

Editor Publicador

Direitos de acesso
Grupos de Usurios com acesso ao Back-End do Joomla! Grupo Gerente Direitos de Acesso Pode criar contedo e ver vrias informaes sobre o sistema. Eis o que ele no pode fazer: Administrar Usurios Instalar mdulos ou componentes Modificar um usurio para super administrador ou modificar um trabalho de um super administrador na opo Site | Configurao Mandar emails em massa para todos os usurios Modificar ou instalar templates ou arquivos de linguagens O administrador no pode fazer: Modificar um usurio para super administrador ou modificar um trabalho de um super administrador na opo Site | Configurao Mandar emails em massa para todos os usurios Modificar ou instalar templates ou arquivos de linguagens Pode executar TODAS as funes do Joomla! Apenas ele pode criar um super administrador ou modificar um usurio para Super Administrador.

Administrador

Super Administrador

Usurios especiais e Informaes de Contato

Usurios especiais - Por padro, todos com direitos acima de autor, so considerados por padro usurios especiais. Voc pode limitar certos contedos para ser visualizados apenas por esse grupo. Informaes de Contato Essa seo mostra qual formulrio de contato est vinculado a quem. No Joomla! possvel voc ter vrios formulrios de contato.

Contedos
So os dados que iro aparecer no seu site:

Textos Imagens Vdeos Etc.

Extenses
Componentes Templates Mdulos Plug-ins

Componentes:
O Joomla! foi feito para se adaptar e expandir de acordo com suas necessidades.So extenses que acrescentem funcionalidades ao Joomla! e geralmente tenha sua prpria rea na administrao. Eg.: uma loja online, gerenciamento de usurios, frum, sistema de newsletter, galeria de imagens so os mais comuns.

Templates:
a parte visual do site, alm de cores, tamanho de fontes, background, espaamento, onde ser dividido o posicionamento do contedo, menu, enfim, tudo que realmente ligado ao visual e composto de pelo menos um arquivo HTML ou PHP, XML e CSS.

Mdulos:
um campo no front-end que mostra onde os dados de um componente. os mdulos so mostrados em espaos pr-definidos do template. Mdulos especiais pertinentes aos componentes, so usados para integrar o contedo da forma desejada em um template. Eg.: Um mdulo mostra a quantidade de usurios online, enquanto outro mdulo mostra as 5 notcias mais recentes na pgina inicial do seu site.

Plug-Ins:
Responsveis por juntar contedo, sistema e outros plug-ins programados por voc e por terceiros. Ah! J ia me esquecendo de dizer! Qualquer um que programe em PHP pode criar suas prprias extenses pra Joomla! Um outro conceito : Plugin uma seo de cdigo que executado quando um evento prdefinido acontece dentro Joomla. Editores so Plugins, e so executados quando o Joomla chama o evento onGetEditorArea. O uso de plugin permite que o desenvolvedor possa mudar o modo como os seus cdigos reagem a eventos, dependendo, claro de quais Plugins esto instalados.

Suportes do Joomla!
Joomla! Suporta XML-RPC (Remote Procedural Call) que permite que vrios programas comuniquem-se entre si. Eg.: Integre com Joomla! uma imagem do FlickR ou um post do wbloggar. O Joomla! tambm tem uma interface de abstrao que suporta diversos tipos de bases de dados, no momento sua compatibilidade com MySQL 4.x

Sumrio
Nesta primeira parte, aprendemos sobre o que o Joomla! e suas funcionalidades, tanto no Front End (o site em si) como no Back End (rea administrativa do site). O prximo captulo voc aprender como instalar e personalizar o Joomla! de acordo com suas necessidades. partir do prximo slide, voc ter acesso adaptao que eu fiz do livro Learn Joomla! 1.5 Fast ! A beginners visual step-by-step guide to set up useful Joomla! websites in a few hours! Autor: Saurabh R. Bhide. Um jovem desenvolvedor Joomla! e autor indiano, este livro completamente voltado para iniciantes e foi traduzido e adaptado por mim. Faa o download a verso original do livro aqui: http://help.joomla.org/files/VisualGuide15.pdf

Aprenda Joomla! 1.5 Rpido

Um guia passo-a-passo visual para configurar websites teis utilizando Joomla! Em poucas horas

Sobre o autor
Esta apresentao uma adaptao do livro Learn Joomla! 1.5 Fast ! A beginners visual step-by-step guide to set up useful Joomla! websites in a few hours! Criado por: Saurabh R. Bhide Website: www.lagoona.in
O material original est sob a Atribuio da licena Creative Commons, ndia. Para mais detalhes, acesse http://creativecommons.org/licenses/by/2.5/in/

Sobre a adaptao
Este material foi adaptado para que voc aprenda Joomla! em 4h, no meu mini-curso presencial. Mas, esta adaptao est em sua maior parte fiel ao livro . Mantive a idia geral do livro e o que acrescentei foram algumas etapas ou observaes que julguei necessria para o melhor aprendizado dos iniciantes em Joomla! 1.5. Retirei algumas redundncias e tornei a linguagem mais facilitada e adaptada para a realidade brasileira. Na verdade, achei o livro um pouco incompleto na parte em que ele ensina apenas a criar

Prefcio
Obrigada por decidir ler este livro. Eu escrevi este livro para voc aprender Joomla! 1.5 o mais rpido possvel. Este livro foi feito para ser lido capa-a-capa, e tudo que voc tem a fazer ler uma pgina, fazer o que ela diz, e seguir adiante. Depois de completar todas as tarefas neste livro, voc ser um usurio fluente em Joomla!, apto a fazer websites com contedo tpico.

Index
o

Instalando Joomla! Criando seu primeiro site em Joomla! : Babunos Criando seu segundo site em Joomla! : Faculdade de Engenharia Modificando o Template Enviando o website para um servidor de hospedagem na web

Instalando Joomla!
Joomla um aplicativo web escrito em PHP, e por isso precisa de um servidor web para rodar. Para tornar um website em J! (Joomla!) disponvel na web, voc precisa hosped-lo em um servidor web. Mas para aprender J!, voc pode converter seu computador em um servidor web e instal-lo nele. Por isso, instalar J! no seu computador, requer que voc faa duas coisas antes.Te mostrarei como faz-las. Mas se voc j tem um

Instalando Joomla!
1) Instalar servidor web com 2) Criar Base de Dados 3) Instalar o

Instalando um servidor web usando o XAMPP

Este software gratuito instala um servidor web Apache, PHP e MySQL no seu computador e configura os trs para trabalharem juntos. Tudo que voc tem a fazer baix-lo e instalar! All you have to do is download it and install! Acesse www.apachefriends.org/en/xampp.html. H verses diferentes para diversos sistemas operacionais. Escolha o seu e faa o download.

Click to edit Master text styles Second level Third level Fourth level Fifth level

Para Criar uma Base de dados em Joomla! E conta para instalar Joomla!, voc pode usar uma aplicao web chamada PhpMyAdmin. Ela vem junto com XAMPP, ento voc pode utiliz-la.
1. Crie uma base de dados 2. Adicione um novo usurio

Click to edit Master text stylesClick to edit Master text styles Second level Second level Third level Third level Fourth level Fourth level Fifth level Fifth level
V para PhpMyAdmin e na pgina inicial, voc ver um campo para criar uma nova base de dados. Digite um nome para esta Base de Dados (BD) e clique create. Eu nomeei a minha como database_for_joomla. Voc pode colocar qualquer nome, mas voc ter que lembrar dele, pois usaremos na instalao do joomla! V para PhpMyAdmin e na pgina inicial, clique em Privileges. Ento clique em Adicionar novo usurio, e preencha o formulrio para criar um usurio. Preencha os campos como descrito na imagem acima e garanta todos os privilgios para este usurio, marcando o boto Check all. Criei um usurio chamado joomla_user com password joomla

Instalando Joomla! 1.5

Agora que voc tem um servidor web pronto com PHP e MySQL juntamente com uma conta que voc criou, vamos instalar o Joomla!. Download a verso mais recente em www.joomla.org/download.html . Salve o arquivo .zip no diretrio raiz do seu servidor que deve estar em C:\xampp\htdocs\ ou na pasta que voc escolheu ao instalar o XAMPP. Crie uma pasta joomlabeta neste diretrio e extraia o arquivo nele. Agora acesse esta pasta no seu navegador usando o caminho localhost/joomlabeta. OBS: O XAMPP deve estar inicializado, juntamente com os

Primeira e segunda telas

A primeira tela voc escolhe a linguagem de instalao do Joomla!, na segunda, mostra as configuraes boas pro Joomla! OBS: Se a opo configuration.php writable estiver marcada no no final da instalao, deveremos copiar um cdigo e criar o arquivo configuration.php na pasta joomlabeta

Terceira e quarta telas

A terceira tela referente a licena do Joomla!, clique prximo. A quarta tela especificando as
configuraes do BD, incluindo o nome da BD, nome de usurio e senha. Use as seguintes configuraes: Use the following settings Database Type : mysql Host Name : localhost Nome de usurio : joomla_user (se voc utilizou um nome diferente no MySQL, especifique aqui) senha : joomla (ou a que voc especificou para aquele usurio)

Recomendaes
recomendado que voc utilize esta base de dados exclusivamente para esta instalao do Joomla! Voc pode criar mais BDs para outras aplicaes.

Quinta e sexta telas

A quinta tela para especificar configuraes FTP para Joomla! Mas como estamos instalando-o localmente, diga no para FTO e clique Prxima A sexta tela para especificar o nome do Site e senha para o administrador. Preencha o formulrio com o nome do site, seu e-mail e senha para o administrador.

Enquanto nesta tela, clique em Instalar exemplo de contedo para que seu site tenha algum contedo de exemplo que voc pode editar ou deletar. Depois de clicar neste boto, voc ver uma mensagem Exemplo de contedo instalado com sucesso. Clique em Prximo. Voc instalou o Joomla! agora, delete o diretrio installation. Deletar este diretrio uma medida de segurana para prevenir que ningum reinstalar o Joomla! utilizando este diretrio.

Instalando Exemplo de Contedos

Eu recomendo a voc instalar os exemplos de Contedos apenas neste primeiro site, para que voc tenha uma viso geral do Joomla! . A instalao destes exemplos, gera cdigo e configuraes desnecessrias, acarretando em mais peso ao seu website. Aps o trmino deste material, voc estar apto a configurar seu site em J! Apenas com os recursos que julgue necessrios. Quando voc estiver seguro para proceder desta forma, no clique em instalar exemplo de contedos e clique em prximo. Aparecer um alerta avisando que nenhum contedo foi instalado e pergunta se voc deseja

Criando a o arquivo configuration.php

Caso seu configuration.php writable estava em no ento, na ltima tela apareceu um cdigo php dentro de uma caixa. Copie todo este cdigo e agora v para a pasta joomlabeta e crie um arquivo vazio, utilizando o esto direito se for usurio Neste arquivo boto as configuraes que voc linux, se for usurio windows, crie um gerou na criao do seu site em Joomla! . documento de texto. Em ambos os casos, Configuration.php e configuration.php-dist so renomeie para configuration.php e arquivos diferentes, no os confunda! Noabra o arquivo. Cole o cdigo que voc retirou na substitua o contedo do configuration.php-dist pelo cdigo que Joomla! e cole no arquivo. instalao do voc copiou para configuration.php. O arquivo configuration.phpSalve.
dist utilizado apenas quando o instalador web

Explorando o Front-End
Click to edit Master text styles Second level Third level Fourth level Fifth level

Introduo
Agora que voc instalou o Joomla! Voc pode acessar o site escrevendo o endereo localhost/joomlabeta no seu navegador. Este o site padro em Joomla, com o contedo exemplo padro. Voc ver como modificar este site de acordo com suas necessidades adiante. Por hora, navegue no site, clique em botes diferentes e teste-os. Vote na enquete e veja o resultado. Procure por algo usando o campo de pesquisa. Crie PDFs de artigos usando o pequeno cone PDF no lado superior direito de qualquer artigo. Note as formas differentes em que o contedo acessado e apresentado. Clicando no link de Joomla! License no menu esquerdo mostrar uma pgina com a licensa em Joomla! Esta pgina como uma pgina esttica no website. Clicando em The Newsno menu principal mostrar introdues de artigos

Bsicos do Joomla!
Front-End
www.sitename.com

Base de Dados
(BD)

J! um Sistema de gerenciamento de contedo que significa que um sistema criado para gerenciar diferentes tipos de contedos Todo o contedo est guardado em uma base de dados. A rea administrativa Administrao (back-end) do J! permite www.sitename.com/administrator que voc edite os contedos, delete ou crie novos.

Gerenciando um site em J!
Gerenciar um site em Joomla! principalmente sobre logar o painel administrativo e adicionar ou editar contedo. Ento, quando voc vir um site criado em J! o front-end que mostra algum contedo da BD. Todos os dados, direto dos links no menu, informao sobre usurios guardada na BD. A interface administrativa te permite editar esta base de dados, te dando portando, controle total sobre o site.

Seu primeiro site em Joomla! : Babunos

Agora que instalou J! No seu computador, vamos criar seu primeiro site em J! . Se voc procedeu de forma correta at agora, seu site dever estar acessvel atravs do endereo no seu navegador http://localhost/joomlabeta e voc ter acesso rea administrativa atravs de http://localhost/joomlabeta/administrator . Escolha qualquer assunto para seu primeiro site. Eu escolhi o assunto babunos. Caso voc no saiba, babunos so animais similares aos macacos. Ento, vamos criar um site sobre babunos.

Organograma do site
1

Conhecendo o Back-End
Ok, chega de teoria e vamos comear a criar nosso site. Para tal, vamos fazer um quicktour pelo Back End do Joomla!

Conhecendo o Back-End
Como vocs puderam observar, no topo temos o menu de opes, sua direita, 3 imagens. Um preview do nosso site, o nmero de pessoas conectadas no momento e se h alguma nova mensagem enviada para voc. Abaixo do menu do topo, h as ferramentas que mostram, dependendo da rea que voc esteja, as opes possveis a ser feitas, tais como: editar, salvar, mandar pra lixeira, deletar, publicar entre outros. Ao longo do uso, usaremos essas ferramentas naturalmente, elas so bem intuitivas.

System Info
Localizado em Help|System info, dividido em 5 sub-areas. Falaremos dela de acordo com nossas necessidades. System Info Configuraes do PHP Configurao do Arquivo Permisso de diretrios Informao do PHP

Menu do Site (Site Menu)

So as configuraes aplicadas todas as pginas individuais e de seu servidor. Todas elas esto resumidas no menu do site. Fica na barra de menu do topo do back-end. Painel de Controle Gerenciamento de Usurio Gerenciador de mdia Configurao Logout

Painel de Controle:
Voc utiliza para mudar entre as vrias reas da administrao selecionando um item de menu ou clicando nos cones mostrados.

Gerenciamento de Usurios

Aqui voc cria ou configura os usurios do seu site. Dependendo dos seus direitos de acesso, eles podem criar, editar ou ver algum contedo preparado para usurios registrados. At agora, voc o nico usurio, o admin e voc tem acesso tudo do Joomla! e pode tambm bloquear, mudar o tipo do usurio, deletar entre outras coisas. Vamos

Media Manager (gerenciador de Mdia)

Funciona como um FTP para voc enviar arquivos ao site. Por padro voc pode enviar jpg,gif e png. til se voc no puder acessar ao FTP devido s permisses de administrao. Este gerenciador bem intuitivo. Voc pode deletar diretrios na opo Visualizar Detalhes (Detail view).

Configurao Global
Administra o valor das variveis no arquivo Configuration.php. Voc pode dar uma navegada nessa rea para olhar suas opes. As opes nessa rea so muito claras, mas muito cuidado com as alteraes que far.

Passo #1: Escreva o nome do muito Este site simples. V na rea administrativa

(back-end) do site This is really easy. Go to the administrative back-end of em Global Configurations, agora, utilize o the site acessando Clique http://localhost/joomlabeta/administrator/ ou o campo Site Name para especificar o nome do seu nome dosite, que Baboons no meu caso. Agoraver a no seu salvar no lugar do joomlabeta. site no topo, lado direito. Voc clique boto Logue utilizandoThe configuration Detals have been mensagem seu username como admin updated. Voc de administradornavegador e a senha tambm ver o ttulo do que agora conter o nome do seu site. Parabns, voc fez a voc colocou na tela 6 deseu site! primeira modificao do instalao do Joomla. Voc entrar na rea administrativa do Joomla!.

Tornando o Joomla! em portugus

Voc deve ter percebido que apesar da instalao ter sido em portugus, todo o site est em ingls, tanto no front-end quanto no back-end. Vou ensinar a vocs como ajustar isso, embora os exemplos de imagem deste material continuar sendo utilizados em ingls, colocarei para vocs os nomes tanto em ingls quanto em portugus. Acesse: http://www.joomla.com.br/downloads/cat_view/8 Faa o download dos arquivos Joomla! 1.5 - Backend pt-BR e Joomla! 1.5 Frontend pt-BR

Tornando Portugus sua lngua padro

Clique em Extensions -> Language Manager Na aba site, aparecer o idioma portugus, selecione portugus no radio button e clique em default no topo do lado direito (a estrela) V na aba administrator e faa a mesma Alguns itens no estaro traduzidos, eu creio coisa, se a feitas nas verses anterioresque,mudar quando administrao no porque como as tradues foram essa (1.5.10) produzi este material, algumas variveis devem ter faa um imediatamente para portugus,mudado de nome nos arquivos e ento, os arquivos de traduo no conseguem localizar logout eologue novamenteMas creio que mais do que as antigas e texto permanece em ingls. na rea 95% permanecero traduzidos e administrativa do que a utilizao doos caminhos nas duas site.escreverei Joomla! em nada ser prejudicada com isso, desde eu
lnguas. Se voc entende algo de programao, voc pode vasculhar por si os arquivos do Joomla! e traduzir da forma que achar melhor. (s recomendo esta forma para usurios avanados)

Passo #2: Crie as pginas

Nosso site ter 4 pginas: 1. Inicial 2. Como os babunos se parecem 3. Vida muito fcil de criar pginas. Na rea social dos babunos 4. Tipos administrativa, clique em Add New de Babunos Article, (Adicionar Artigo). Voc tambm pode ir atravs de Content -> Article Manager (Contedo -> Adicionar Artigo), no menu, no lado direito, clique em New (Novo)

Passo #2: Crie as pginas

Preencha o ttulo para a pgina, o contedo na seleo de pgina, selecione seo e categoria como qualquer ou sem categoria (Uncategorized), e clique o boto salvar no topo, lado direito. Aps salvar a pgina, voc ser levado ao Gerenciador de Artigos (Article Manager) onde voc pode editar, deletar ou criar novos artigos. Clique no boto Novo (New) no topo, direita, para criar uma nova pgina. Desta forma, faa todas as 4 pginas.

Observao
Note que o J! permite que voc escreva artigos/pginas utilizando um editor de interface wysiwyg What You See Is What You Get (Voc v aquilo que voc tem), como mostrado na figura acima. Isto significa que voc pode fazer o texto aparecer da maneira que quiser. Utilize este wysiwyg da maneira que usaria qualquer software de processamento de texto. Mas para inserir imagens, use o boto Image na parte inferior, esquerda da caixa de edio de texto.

Passo #3: Crie Links de Menu H diferentes menus em um site J!, e voc

pode adicionar links para as pginas recm criadas em qualquer um destes menus.

Para este site, usaremos o main menu. Na interface administrativa, v para Menus -> Top Menu utilizando o menu.

Aqui voc ver uma lista de todos os links que j so presentes no menu principal.

Selecionando o tipo de menu

Ser mostrado uma lista de tipos de itens de menu.
1.

Clique em artigos, porque ns queremos que este link se vncule um artigo. Clique em Layout de Artigo Padro (Standard Article Layout) quando a lista de artigos expandir. Significa que o artigo por completo ser mostrado quando o link for clicado.

2.

Editar Link
Tipo do item de menu Cada Link tem sua particularidade, Ns entraremos em detalhe medida que formos criando os nossos. Cada tipo pertence um componente do Joomla! Click to edit Master text styles Second level Third level Fourth level Fifth level

Vinculando ao artigo
Na rea superior, direita desta pgina, voc ver uma caixa nomeada Parmetros de Item de Menu (Menu item Uma janela popup aparecer com uma lista de todas as pginas. Voc deve parameters). Nesta Caixa, dar um clique-duplo na selecionar clique no boto pgina em que quer criar o vnculo com este item prximo ao campo de menu. selecionar artigo para Fazendo isto, voc seleciona o artigo/pgina que ser mostradoser especificar qual artigo quando um usurio clicar neste link Agora, o campo selecionar artigolink for mostrado quando o mostrar o que estamos criando. selecionou. nome da pgina que voc clicado
Agora clique no boto salvar, voc ser levado ao Gerenciamento de Menu para o Main menu, e o link que voc acabou de criar estar nesta lista.

Visualizando nossos links no Front-End

Em uma instalao padro do Joomla!, h um link home no menu principal por padro, mas ns no o manteremos. Agora, crie os links para as outras pginas, repetindo o procedimento anterior. Se voc visualizar seu front-end localhost/joomlabeta ou clique no link pr-visualizao no canto superior direito, voc ver a existncia de dois links Home. O segundo aquele que voc

Limpando a Baguna
Est tudo funcionando perfeitamente, mas, precisamos:
1.

Toda esta baguna no site dever ser limpa, de forma que aparea apenas coisas relacionadas aos nosso babunos no site. Quando o site for visitado atravs de localhost/joomlabeta, a pgina Home que criamos ser mostrada. Todos os outros links para o menu devero ser removidos.

2.

3.

A prxima pgina mostra uma baguna tpica

Seu site deve estar assim agora: Click to edit Master text styles
Second level Third level Fourth level Fifth level

Varrendo para debaixo do tapete

Click to edit Master text styles Second level Third level Fourth level Fifth level Para esconder estes mdulos desnecessrios, v para o back-end localhost/joomlabeta/admini strator e logue. V para Extenses -> Administrador de Mdulos (Module Manager). aqui onde voc administrar todos os mdulos. Voc ver uma lista de todos os mdulos instalados no seu site. Haver em torno de 25 items na lista.

Limpando os items de menuAgora vamos limpar o Main Menu e extras

esconder todos os outros links alm dos que apontam para nossas 4 pginas e fazer a nossa Home ser a pgina padro ao invs da que est atualmente.

Na rea administrativa, v para Menu todos os links Menu. requeridos, faa igual Para limpar o menu e remover-> Main que no so Ser voc fez aos mdulos. Selecione todos os links que deseja esconder e clique em mostrada uma lista de todos os links despublicar (unpublish) atualmente vistos no seu site. Para fazer a sua pgina Home padro, a selecione marcando o checkbox e clique em Padro

Dica
Modificando a Logo do site: O logo do Joomla! que voc v no topo das pginas parte de um template. Voc ver isto com mais detalhes depois. Por hora, se voc tem uma imagem para substituir, salve-a em C:\xampp\htdocs\joomlabeta\templates\rhuk_ milkyway\images ou onde quer que fique o diretrio raiz do seu site com o nome mw_joomla_logo.png para substituir a imagem atual.

Este o seu primeiro site em Joomla!

Click to edit Master text styles Second level Third level Fourth level Fifth level

Nvel Intermedirio
Espero que voc tenha gostado da sua primeira experincia em Joomla!. Agora vamos entrar em um nvel intermedirio de aprendizado.

C r

S S H M C e i a a o d n t r t a t c u o y n r h t l s o b i l a a c contedo em Joomla! O k tipos de contedo: Com s

Como um contedo salvo

so as pginas de informaes a ser mostradas no site. H dois categoria ou sem categoria.

Contedo sem categoria Estas geralmente referem-se pginas estticas, voc pode criar e editar quantas delas voc quiser no Back-end. Estas pginas no pertencem a nenhuma categoria, por isso, so chamadas assim. Contedo com categorias Tambm referem-se paginas, mas estas pertencem a uma estrutura, que constituda de sees e categorias. Uma seo (section) contm diferentes categorias (categories) que por sua vez, contm pginas de contedo tambm chamadas itens de contedo. A figura ao lado mostra um exemplo de um site contendo informaes sobre carros diferentes. Cars uma seo, que contm duas categorias Hatchbacks e Sedans Estas categorias tm uma pgina de cada carro naquela categoria.

Criando seu segundo site em Joomla!

Faremos um site legal de uma faculdade utilizando Joomla! Faa uma nova instalao do Joomla!, mas desta vez, no instale o exemplo de contedo. Pense em uma faculdade imaginria. Eu nomearei a minha de Faculdade Bhide de Engenharia ;) Antes de fazer qualquer site, voc deve decidir a estrutura de seu site. Ns teremos a seguinte estrutura para nosso site da faculdade. Eu recomendo fortemente que voc desenhe esta estrutura no papel

B hi d e C ol e g e of E n gi n e er n g

D C T A H e h b o p n e o m a t u e r a P t t c r m t i U e n s n U c t s i s p a l

Estrutura do site
s

C E M i l e v e c i c h l t a r n E i n c g a i l n e E e n r g i n g e e r i n g

P F r a r a o c o c j i u j u e l e l c i t c t t y t y s i s e

Estapas para a criao

Agora que temos a estrutura em mente, ns a criaremos em 7 passos, alguns deles voc j fez no primeiro site
1.

Configurar o nome do site Criar as pginas sem categorias (Home, About us, etc...) Criar a Seo (Departments) Criar uma categoria para cada departamento Adicionar pginas/itens de contedo nestas categorias

2.

3.

4.

5.

Passo #1: Configurar o nome do site

Como voc fez para o site dos Babunos, logue-se na rea administrativa do seu novo site localhost/nome_do_seu_site/administrator, logue utilizando a senha que voc cadastrou nessa nova instalao e d um nome ao site como voc deu ao dos babunos (global configuration)

Passo #2: Criar as pginas sem categorias

Olhe na estrutura do site e crie as pginas sem categorias, assim como criamos as 4 pginas do site dos babunos. As pginas so: Home About Us The Principal Novamente, como da primeira vez, estes artigos ainda no esto visveis no frontend. necessrio criar os links para estes contedos. Voc pode cri-los agora, como

Passo #3: Criar a Seo (Departments)

Criar uma seo muito fcil. Na rea administrativa, v para Content -> Section Manager Voc pode retornar para a rea principal do back-end utilizando o menu Site -> Control Panel. Uma vez que voc est em Section Manager, clique no boto New, lado direito, no topo, para criar uma nova seo. Escreva o nome para a seo com Departments e abaixo escreva uma

Dica:
Sugiro que voc olhe a estrutura que desenhamos e marque as reas que j esto prontas. Vamos continuar e criar as categorias.

Passo #3: Criar uma categoria para cada Crie categorias atravs do Category departamentocontrol panel ou Manager pelo
atravs do menu Content -> Escreva o nome Category Manager. da categoria
(Departamento) como ttulo. E selecione a section como departments, Agora, criaremos uma categoria para como esta categoria um departamento. Olhe a figura ao faculdade. cada departamento da lado se voc est confuso. Para faz-lo, Escreva uma descrio pequena do clique no boto New departamento na caixa detalhes Ento clique no boto save. Voc ser levado de volta para o category manager. Repita o processo para todos os departamentos.

Passo #5: Adicionar pginas/itens de contedo nestas categorias

Agora que criamos uma categoria para cada departamento, cada departamento precisa de duas ou trs pginas mostrando informaes sobre o mesmo. Por exemplo, o departamento de engenharia mecnica (mechanical

Criando pginas com categoria

So criadas da mesma forma que as sem categoria, sendo que ao invs de selecionar a opo qualquer (uncategorized), voc dever escolher a seo e categoria da pgina. Tenha certeza de que escolheu as opes corretas.

Uma vez que voc criou todas as diferentes pginas para cada departamento, hora de adicionar links para todos os contedos no menu. 1: Adicione links para os contedos sem categoria como fizemos no site dos babunos.

Step #6: Adicionar links para todas as coisas acima no menu

2: Add Links to the Department pages

Estes links so especiais. Criaremos um link no menu para cada departamento. Quando clicarmos, aparecer uma lista contendo todos os contedos pertecentes a categoria daquele departamento. 1. No back-end, v para Menu -> Main Menu 2. Clique no boto new 3. Clique emArticles na lista Internal Links 4. A lista expandir. Clique em Category List Layout na sub-lista Category

1.

Na caixa direita Menu Item Parameters , selecione a categoria

Step #7: Organizando a pgina

Agora, coloque o link Home como o padro deste site assim como j foi feito no site dos babunos. Despublique (unpublish) o link Home padro. Note que quando clicamos em mechanical engineering no site, muitas coisas alm das pginas aparecem.

Nosso segundo site padro est pronto!

Faa as seguintes configuraes: Na caixa parameters basic
Table Headings : HIDE Filter : HIDE

Na caixa parameters advanced

Display Select : HIDE

Na caixa parameters component

Author Name : HIDE Hits : HIDE

Estas configuraes faro a pgina

Para editar qualquer pgina...

A beleza dos CMS (Sistemas de Gerenciamento de Contedos) que uma vez escrito, pode ser modificado a qualquer hora usando a interface administrativa tanto no back-end, quanto no front-end. Agora que temos um site para nassa faculdade de engenharia, voc pode mudar os contedos facilmente indo para o Article Manager No back-end, v para Content -> Article Manager Na lista de pginas que aparecer, clique no artigo que deseja modificar.

Utilizando outro template

Um template Joomla! providencia um design ao Joomla! para mostrar o contedo. Se voc um web designer, voc pode criar e/ou personalizar um template para J!. No a inteno deste material, utilizaremos apenas templates disponveis gratuitamente. H muitos sites que oferecem templates gratuitos ou pagos para Joomla! . V para joomla.org e procure por free templates voc ver diversos para usar. Vamos utilizar um da empresa rockettheme. O nome do template Novus. Est disponvel em:

Tornando o Novus template padro

Agora tornaremos este template como o padro. V para Extenses -> Template Manager. Aqui voc poder selecionar o template padro para o seu site. Selecione o template rt_novus utilizando o radio button como na imagem abaixo e clique no boto Default no lado direito ao topo. Agora, voc poder modificar este template de acordo com sua vontade/tcnica. V para
C:\xampp\htdocs\digite_a_pasta_doseu_site\templates\rt_novus_j15\images

Verso do livro finalizada

Voc pode usar este mtodo para instalar qualquer template para Joomla! 1.5. Para personalizar, v para a pasta onde o template foi instalado e faa alteraes para imagens, arquivos CSS, etc. Se voc souber faz-lo,

Sobre a adaptao
Este material que voc acaba de ler foi adaptado e traduzido para portugus. A verso est completamente diferente da original, cortei algumas partes e acrescentei muitas outras, para que pudesse ser executado no meu mini-curso de 4h. No Palavra deste (do Autor) comeo Finais material h um link que voc poder utilizar para fazer o download da Obrigada por ler este livro. Espero que voc tenha verso original em formato pdf, em ingls

gostado. Adiante, voc aprender a incrementar muito mais seus sites em Joomla!

Incrementando o site
partir de agora, voc aprender como incrementar ainda mais seus sistemas em Joomla! Adicionei algumas coisas que acho importante voc aprender sobre J! Voc ir criar enquetes, adicionar mdulos, uma lista de links (Links teis) e criar uma galeria de imagens e um formulrio de contato.

Adicionando Mdulos no nosso site

Vamos adicionar agora os mdulos necessrios para finalizar a pgina inicial do nosso sistema online: Clique em Extenses -> Administrar Mdulo Clique em Pesquisa e em seguida no boto prximo Preencha os parmetros que achar necessrio

Adicionando Enquetes

Clique em Componentes -> Enquete Clique em Novo Preencha os campos necessrios Ateno Esse campo segundos entre votos define o tempo necessrio para votar novamente na pesquisa Salve

Adicionando Mdulos (enquete)

Clique em Extenses -> Administrar Mdulo Clique em Votao e em seguida no boto prximo Preencha os parmetros Selecione a Enquete desejada Salve

Dica:
Para tornar uma rea vsivel apenas para usurios cadastrados, quando criar um link/artigo h uma box relacionada ao nvel de acesso (acess level), o padro public. Public: Todos podem acessar (padro) Registered: Apenas usurios cadastrados Special: Usurios com permisses acima do nvel de autor. OBS: Se voc criou contedos para nvel registered ou acima, adicione no seu front-end um mdulo Login, para que os usurios possam se cadastrar, ou pelo menos logar-se

Links teis

Esse componente bem simples, voc apenas adiciona links e diz a forma de comportamento ao clicar nele (ir para outra janela, abrir na mesma janela) Antes de criar os links, devemos criar uma categoria para eles. Clique em Componentes->Weblinks->Categorias, crie uma categoria Clique em Componentes->Weblinks->Links e crie um novo link, preencha os campos e salve. Crie vrios links

Adicionando Links teis no seu menu

V em Menus -> Main Menu Novo -> Weblinks -> Layouts Lista de Categorias (Essa opo mostra todos os links de uma certa categoria)

Link de Localizao

V em Menu->Main Menu Crie um novo menu e em Tipo de item de Menu, selecione wrapper Digite a url desejada, configure os parmetros Salve

Criando um formulrio de Contato

V em Componentes -> Contatos -> Categoria e crie uma nova categoria chamada Contatos V em Componentes -> Contatos -> contatos -> novo Tire um tempinho para ler os campos abaixo, eles mostram as informaes do seu contato apenas

OBS: Este componente contato nativo do Joomla bem simples, h apenas alguns campos pr-definidos para o visitante preencher. Mas h vrios componentes que permitem a personalizao de campos em um formulrio de contato

Adicionando o Link Contato

Crie um novo item de menu, do tipo Contatos Selecione Layout de Contato Padro D um nome, selecione o contato nos parmetros Salve

Galeria de Imagens

Bem, estamos no finalzinho deste mini-curso de... Er... Esqueci o nome... Vou l no primeiro slide filar e j volto! *Indo no Primeiro slide* Ah! Criando um sistema online no mnimo de tempo possvel!

Galeria de Imagens

Instale o componente Ozio.zip V em Menu -> Main Menu -> Novo -> Ozio Gallery Clique em pr-visualizar Nada aconteceu?!? Como assim? Claro, ainda no passamos de onde ele puxar as fotos! Clique em Componentes -> Ozio Gallery Clique em settings (um texto minsculo, perdido por a!) Pra visualizarmos rapidamente, selecione a opo Use images from FlickR na aba general, salve e visualize novamente Legal, no? Se vocs notaram, h vrias galerias possveis na Ozio Gallery, usem um tempo para brincar com esse componente!

Referncias
Graf, Hagen - Building Websites with Joomla 1.5, PACK PUBLISHING www.joomla.org www.joomla.com.br

http://www.siteground.com/tutorials/joomla15/joomla_create_websit Learn Joomla! 1.5 Fast ! A beginners visual step-by-step guide to set up useful Joomla! websites in a few hours!, Saurabh R. Bhide www.google.com.br (o orculo da vida!)

The End
um prazer contribuir para a vida de cada um que conseguiu chegar no final deste material, oferecendo conhecimento, algo to importante.

Caso voc encontre algum erro neste meu material, favor entra em contato.

No prximo slide, meus contatos

Sobre mim

Jennifer Payne
nennypayne@gmail.com Entrem no grupo de joomla em que eu fao parte da administrao brasjoomla@googlegroups.com

Este grupo composto por pessoas dinmicas e gentis que sempre se esforam para ajudar. Caso voc tenha dvidas ou quer se aprofundar em Joomla!, faa parte! Faremos o possvel para ajudar.

Esse mini-curso s foi possvel graas ao incentivo e colaborao da Especializa treinamentos.