Apostila de Joomla - Nova

APOSTILA PARA INICIANTES EM JOOMLA 1.
5
POR JENNIFER PAYNE
ESTRITAMENTE PROBIDA A VENDA DESTE MATERIAL. VOC PODE CONSEGU-LO GRATUITAMENTE EM WWW.JENNIFERPAYNE.COM.BR
Agradeo a Jose Berardo, dono da Especializa Treinamentos pelo incentivo para montar este material e o curso de joomla em recife. Agradeo tambm ao saurabh bhide por ter me permitido traduzir e misturar meu material ao dele. Por fim, agradeo a todos que ajudam a comunidade Joomla a se solidificar e que queira me ajudar divulgando meu material, me indicando ou contratando para trabalhos.
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu.
CAPTULO 01 GERENCIAMENTO DE CONTEDO ........................................................................................... 6 QUAIS AS NECESSIDADES DOS CLIENTES? ......................................................................................................... 6 Primeira Tela ..................................................................................................................................................................17 Segunda Tela ..................................................................................................................................................................17 Terceira e quarta telas .....................................................................................................................................................18 Quinta Tela .....................................................................................................................................................................20 Sexta tela ........................................................................................................................................................................20 Contedos.......................................................................................................................................................................23 Site .................................................................................................................................................................................25 GLOBAL CONFIGURATION ...............................................................................................................................................28 Site .................................................................................................................................................................................28 SITE SETTINGS ................................................................................................................................................................28 System ............................................................................................................................................................................29 USER SETTINGS...............................................................................................................................................................30 MEDIA SETTINGS ............................................................................................................................................................30 SESSION SETTINGS ..........................................................................................................................................................30 Server .............................................................................................................................................................................30 REVISANDO O CAPTULO... ..............................................................................................................................................31 CAPTULO 02 COMPONENTES, MDULOS E PLUG-INS ................................................................................32 Funcionalidades do Joomla .............................................................................................................................................33 TABELA COMPARATIVA ENTRE COMPONENTES, MDULOS E PLUGINS ..............................................................................33 Estruturando o site ..........................................................................................................................................................33 INSTALANDO EXTENSES................................................................................................................................................36 ENTENDENDO COMPONENTES .........................................................................................................................................39 PASSO #1: ESCREVA O NOME DO SITE ................................................................................................................52 1. 2. 3. 4. INICIAL .....................................................................................................................................................................55 COMO OS BABUNOS SE PARECEM ..........................................................................................................................55 VIDA SOCIAL DOS BABUNOS ...................................................................................................................................55 TIPOS DE BABUNOS................................................................................................................................................55
PASSO #3: CRIE LINKS DE MENU ..........................................................................................................................56 VISUALIZANDO NOSSOS LINKS NO FRONT-END................................................................................................................61
www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
1. TODA ESTA BAGUNA NO SITE DEVER SER LIMPA, DE FORMA QUE APAREA APENAS COISAS RELACIONADAS AOS NOSSO BABUNOS NO SITE. ............................................................................................................................................61 2. QUANDO O SITE FOR VISITADO ATRAVS DE LOCALHOST/JOOMLABETA, A PGINA HOME QUE CRIAMOS SER MOSTRADA. ....................................................................................................................................................................62 3. TODOS OS OUTROS LINKS PARA O MENU DEVERO SER REMOVIDOS. ....................................................................62 VARRENDO PARA DEBAIXO DO TAPETE ..........................................................................................................................63 1. CONFIGURAR O NOME DO SITE................................................................................................................................67 2. CRIAR AS PGINAS SEM CATEGORIAS (HOME, ABOUT US, ETC...) ..........................................................................67 3. CRIAR A SEO (DEPARTMENTS) ...........................................................................................................................67 4. CRIAR UMA CATEGORIA PARA CADA DEPARTAMENTO .............................................................................................67 5. ADICIONAR PGINAS/ITENS DE CONTEDO NESTAS CATEGORIAS ..........................................................................67 6. ADICIONAR LINKS PARA TODAS AS COISAS ACIMA NO MENU ...................................................................................67 7. ORGANIZANDO A PGINA.........................................................................................................................................67 PASSO #3: CRIAR UMA CATEGORIA PARA CADA DEPARTAMENTO ...........................................................69 PASSO #5: ADICIONAR PGINAS/ITENS DE CONTEDO NESTAS CATEGORIAS .......................................70 1. FACULTY: UMA PGINA SOBRE O CORPO DOCENTE DO DEPARTAMENTO ...............................................................71 2. FACILITIES: MOSTRA TODOS OS LABORATRIOS E MAQUINRIOS ..........................................................................71 3. PROJECTS: MOSTRA TODOS OS PROJETOS LEGAIS FEITOS POR ESTUDANTES NO DEPARTAMENTO......................71 STEP #6: ADICIONAR LINKS PARA TODAS AS COISAS ACIMA NO MENU ...................................................72 STEP #7: ORGANIZANDO A PGINA .....................................................................................................................74 CLIQUE EM COMPONENTES -> ENQUETE .................................................................................................................79 CLIQUE EM NOVO .....................................................................................................................................................79 PREENCHA OS CAMPOS NECESSRIOS ....................................................................................................................79 ATENO ESSE CAMPO SEGUNDOS ENTRE VOTOS DEFINE O TEMPO NECESSRIO PARA VOTAR NOVAMENTE NA PESQUISA .......................................................................................................................................................................79 SALVE .......................................................................................................................................................................79 CLIQUE EM EXTENSES -> ADMINISTRAR MDULO .................................................................................................79 CLIQUE EM VOTAO E EM SEGUIDA NO BOTO PRXIMO ....................................................................................79 PREENCHA OS PARMETROS ...................................................................................................................................79 SELECIONE A ENQUETE DESEJADA ..........................................................................................................................79 SALVE .......................................................................................................................................................................79 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) ................................................................................79 ANTES DE CRIAR OS LINKS, DEVEMOS CRIAR UMA CATEGORIA PARA ELES. .............................................................79 CLIQUE EM COMPONENTES->W EBLINKS->CATEGORIAS, CRIE UMA CATEGORIA.....................................................80 CLIQUE EM COMPONENTES->W EBLINKS->LINKS E CRIE UM NOVO LINK, PREENCHA OS CAMPOS E SALVE. ............80
CRIE VRIOS LINKS ...................................................................................................................................................80 V EM MENUS -> MAIN MENU ..................................................................................................................................80 NOVO -> W EBLINKS -> LAYOUTS LISTA DE CATEGORIAS (ESSA OPO MOSTRA TODOS OS LINKS DE UMA CERTA CATEGORIA) ...................................................................................................................................................................80 V EM MENU->MAIN MENU ......................................................................................................................................80 CRIE UM NOVO MENU E EM TIPO DE ITEM DE MENU, SELECIONE WRAPPER.............................................................80 DIGITE A URL DESEJADA, (PROCURE O LOCAL NO GOOGLE MAPS) CONFIGURE OS PARMETROS ..........................80 SALVE .......................................................................................................................................................................80 CRIE UM NOVO ITEM DE MENU, DO TIPO CONTATOS ..............................................................................................80 SELECIONE LAYOUT DE CONTATO PADRO ..........................................................................................................80 D UM NOME, SELECIONE O CONTATO NOS PARMETROS .......................................................................................80 SALVE .......................................................................................................................................................................80 CAPTULO 04 SEO, SEF E SEGURANA .............................................................................................................81 04.02 - QUE SEO (SEARCH ENGINE OPTMIZATION) ......................................................................................84 04.03 DICAS DE SEO ................................................................................................................................................85 04.04 OTIMIZANDO META DADOS .........................................................................................................................87 NA REA ADMINISTRATIVA DO SITE, CLIQUE EM SITE -> GLOBAL CONFIGURATION. NA ABA SITE, H UM GRUPO DE CAMPOS EM METADATA SETTINGS. .............................................................................................................................87 GLOBAL SITE META DESCRIPTION UMA PEQUENA DESCRIO SOBRE O CONTEDO DO SEU SITE, DE MANEIRA GERAL, ESSA DESCRIO DEVE SER DE FCIL INTERPRETAO POR HUMANOS. ..........................................................87 GLOBAL SITE META KEYWORDS COLOQUE PALAVRAS CHAVES E FRASES RELEVANTES PARA SEU SITE, SEPARADOS POR VRGULA E GRUPOS DE FRASES ENTRE ASPAS SIMPLES. ...................................................................87 SHOW TITLE META TAG MOSTRA A META TAG TTULO AO VER ARTIGOS. .............................................................87 SHOW AUTHOR META TAG MOSTRA A META TAG AUTOR AO MOSTRAR ARTIGOS.................................................87 04.05 IMPLEMENTANDO SEO EM JOOMLA .........................................................................................................88 CAPTULO 05 - LAYOUTS E TEMPLATES ............................................................................................................99 INSTALE O TEMPLATE COM COLUNAS E O TEMPLATE SEM COLUNAS ......................................................................124 V AT EXTENSIONS -> TEMPLATE MANAGER (EXTENSES -> ADMINISTRAR LAYOUT) .......................................124 TORNE O TEMPLATE QUE SER UTILIZADO PELA MAIORIA DOS MENUS COMO PADRO ..........................................124 EM SEGUIDA, SELECIONE NO RADIO BUTTON O TEMPLATE SEM AS COLUNAS E CLIQUE NO BOTO EDITAR DO LADO SUPERIOR DIREITO ....................................................................................................................................................... 124 DO LADO ESQUERDO, SELECIONE O RADIO BUTTON SELECT FROM LIST E UTILIZANDO O SHIFT OU CTRL SELECIONE QUAIS LINKS DO MENU ESTE TEMPLATE SER VINCULADO ........................................................................ 124 www.jenniferpayne.com.br 4
http://jennifer-payne.blogspot.com @JennyPayneDZN
SALVE .....................................................................................................................................................................125 SEU TEMPLATE SEM COLUNAS AGORA TEM UM SINAL VERDE NA LINHA ASSIGNED QUE MOSTRA QUE ELE NO PADRO, PORM UTILIZADO POR ALGUNS MENUS DO SITE. ...................................................................................... 125 CAPTULO 06 ............................................................................................................................................................127 ENVIANDO SEU SITE PARA UM SERVIDOR .......................................................................................................................127 FAZENDO BACKUP NO JOOMLA!AGORA QUE SEU SITE J TEM SEU NOVO VISUAL, CONTEDOS ESCRITOS E EXTENSES INSTALADAS, J SEF E EST TUDO FUNCIONANDO PERFEITAMENTE, EST NA HORA DE COLOCAR SEU PROJETO NO AR! ..................................................................................................................................................................................... 127 AGORA QUE SEU SITE J TEM SEU NOVO VISUAL, CONTEDOS ESCRITOS E EXTENSES INSTALADAS, J SEF E EST TUDO FUNCIONANDO PERFEITAMENTE, EST NA HORA DE COLOCAR SEU PROJETO NO AR! ...................................................... 128 ENVIANDO SEU SITE PARA UM SERVIDOR .......................................................................................................................128 Conhecendo FTP ..........................................................................................................................................................130
Captulo 01 Gerenciamento de Contedo

Esta primeira parte uma das poucas partes tericas desta apostila, que vai ajudar a entender o porque de utilizar o Joomla e quando, alm de informaes vitais sobre este CMS. No Sabe o que CMS? Ta na hora de comear a leitura!
O que CMS? CMS ou Content Management System, um programa desenvolvido para uma fcil gesto de contedo, ou seja, para a criao, edio e manipulao de contedo (dados). Identificando a necessidade do uso de um CMS A primeira coisa a ser feita, agora que voc sabe o que um CMS e suas variaes identificar quando voc dever usar um CMS. Primeiramente, como os CMS so feitos para atender s necessidades comuns dos gestores de contedo, ele construdo pensando nas necessidades da maioria. Se voc pensa em adotar algum CMS para seu projeto, importante saber se seu projeto tem alguma particularidade mais complexa ou se um projeto que se utiliza apenas de necessidades gerais. Aps essa identificao, necessrio pesquisar qual CMS se adaptaria melhor ao seu projeto e porqu.
Quais as necessidades dos clientes?

H alguns pontos que voc deve levar em considerao antes de definir se voc utilizar um CMS ou no. Quais so as reais necessidades dos clientes? o Ele vai precisar de interatividade no site dele? o Por que ele precisar dessas interatividades? o Que nvel de interatividade? o Quem vai fazer as manutenes do site dele? Qual a complexidade do projeto? o As funcionalidades do meu CMS atendem s expectativas? o Ter que desenvolver funcionalidades prprias? o Adaptar alguma funcionalidade o Ser necessrio o desenvolvimento de um layout ou pode ser utilizado um pronto? Qual o prazo e oramento do projeto? o Qual a data de entrega? o Qual o oramento mximo que aquele projeto tem? o Quais as variveis de custos?
O Joomla uma ferramenta bastante completa e poderosa, pode ser utilizada na maior parte dos casos e economiza em torno de 70% dos custos e tempo (considerando os custos de criar um layout e desenvolver um sistema inteiro do zero)
O que o Joomla! ? O Joomla! um WCMS (Web Content Management System), sua manipulao de contedo focado para web e intranets. Para fins didticos, s vezes trato o Joomla! por Joomla ou ainda J!, que so formas comuns de se encontrar na internet. O Joomla! o WCMS mais popular do mundo e foi criado em 1 de setembro de 2005 quando a equipe de um dos mais populares CMS do mundo o Mambo, entrou em discordncia e resolveram se separar. Uma parte desta equipe fundou o Joomla! que recebeu o fundamento do Mambo e partir disso comearam a desenvolver um projeto slido e que hoje em dia, estima-se que h mais de 5.000.000 de instalaes em servidores pblicos. Mais de 45.000 desenvolvedores registrados trabalhando em mais de 1.100 novos projetos pra extender o Joomla!. H mais de 50.000 usurios no frum do www.joomla.org. O Joomla! ganhou dois prmios em 2005 de melhor projeto Open Source e outro para um de seus membros mais ativos pelo seu apoio aos projetos Open Source, hoje em dia o Joomla! considerado um dos 50 mais importantes projetos Open-Source do mundo. O Joomla! j utiliza a tabela de caracteres UTF-8. A Estrutura do Joomla! O Joomla funciona da seguinte forma: A pessoa responsvel pelo site, altera as configuraes do Joomla, digita textos e etc. Essas informaes so passadas para o mySQL que as salva e quando um usurio acessa o site, o mySQL retorna essas informaes para o php que processa e devolve para o usurio como foi planejado pelo responsvel pelo site. 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. Referncia de pginas em Joomla! www.joomla.org www.porsche.com.br
http://dsic.planalto.gov.br/ www.cnt.com.br http://portal.mec.gov.br/ http://www.fortaleza.ce.gov.br/ http://www.tiangua.ce.gov.br http://www.mitsubishi-motors.com.ve/cms/index.php http://www.leyendasdetoledo.com/ www.danone.com http://www.asassaomiguel.com

partir de agora, veremos o mximo possvel de prtica, deixando a teoria para onde for estritamente necessrio. Vamos ver o que necessrio para instalar o Joomla e como faz-lo.
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 e 5.x. Ambiente LAMP (Linux, Apache, Mysql, PHP) O Joomla! foi desenvolvido principalmente para a plataforma Linux, que usa uma estrutura completamente Open-Source e freeware, mas comum v-lo na plataforma Windows, atravs da instalao de programas que simulem o ambiente Apache, juntamente com o banco de Dados MySql e PHP. A sua instalao tanto em ambiente windows como em ambiente Linux pode ser executada da seguinte forma: Instalando o XAMPP http://www.apachefriends.org/en/xampp.html Para instalar, existem duas formas:
1. Voc faz o download da verso compactada do XAMPP e simplesmente o descompacta na pasta de sua escolha 2. Voc faz o download do instalador e procede da seguinte forma Aps escolher a linguagem, clique next Escolha o local onde o xampp ser instalado (aconselho fortemente a salvar em C: ou o equivalente disto na sua mquina)
Determine como a instalao dever proceder (faa como abaixo)
Agora que voc j instalou o XAMPP corretamente, d dois cliques no arquivo: xampp-control.exe
10
11
Digite localhost/phpmyadmin no seu navegador Crie o banco de dados

12
2. Adicione um novo usurio
13
V para PhpMyAdmin e na pgina inicial, clique em Privilgios. 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 Marcar tudo. Criei um usurio chamado joomla_user com password J!12345
Instalando o Joomla! 1.5 Faa o download em http://www.joomla.org/download.html
14
15
Descompacte o arquivo na pasta XAMPP/htdocs/sua_pasta
16
Primeira Tela
A primeira tela voc escolhe a linguagem de instalao do 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 (geralmente acontece com usurios Linux)
Segunda Tela
Mostra as preferncias para uma melhor instalao do Joomla, principalmente para usurios Linux, s vezes acontece da opo configuration.php editvel marcar no, quando isso acontece, significa que o Joomla no foi capaz de criar um arquivo php necessrio, devido permisses do seu computador. Ensino como cri-lo mais adiante.
17
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.
18
Use as seguintes configuraes: Database Type : mysql Host Name : localhost Nome de usurio : joomla_user (se voc utilizou um nome diferente no MySQL, especifique aqui) senha : J!12345 (ou a que voc especificou para aquele usurio) Database Name : aula_joomla (ou a que voc criou, se voc utilizou um nome diferente). Nesta tela, voc providenciou os detalhes da BD MySQL para o Joomla! utilizar para guardar todos os contedos e outras informaes Recomendaes recomendado que voc utilize esta base de dados exclusivamente para esta instalao do Joomla! Voc pode criar mais BDs para outras aplicaes. A quinta tela para especificar configuraes FTP para Joomla! Mas como estamos instalando-o localmente, diga no para FTP 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.
19
Quinta Tela
Esta camada de ftp deve ser habilitada quando seu servidor estiver configurado com safe_mode on, que no recomendado pela equipe de segurana do joomla. ento d preferncia servidores apache com o safe_mode off e deixe a tela como est.
Sexta tela
Nome do site: Ttulo do site (tag title) Seu e-mail: e-mail de administrao (e-mail do webmaster do site) Senha do admin: Senha do usurio padro do joomla, admin, atravs dele possvel fazer todas as configuraes do seu site, inclusive adicionar novos usurios, por questo de segurana voc ser instrudo a deletar este usurio no captulo 03. Preste muita ateno ao digitar esta senha. Instalar exemplo de contedo: vem com diversas funcionalidades e contedo padro instalado. Eu aconselho a voc no utilizar esta funcionalidade para este primeiro projeto, mas que crie uma nova
20
instalao para explorar como o Joomla funciona, caso deseje fazer isso, volte ao passo de instalao do Joomla e crie um novo projeto (com outro banco de dados e todo o resto) e nesta 6 etapa, instale o exemplo de contedo, quando isso acontecer uma mensagem de instalao aparecer no lugar do boto. Clique em Prximo e voc acaba de instalar o Joomla! agora, delete o diretrio installation. Deletar este diretrio uma medida de segurana para prevenir que ningum reinstalar o Joomla! utilizando este diretrio.
Criando 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 boto direito se for usurio linux, se for usurio windows, crie um documento de texto. Em ambos os casos, renomeie para configuration.php e abra o arquivo. Cole o cdigo que voc retirou na instalao do Joomla! e cole no arquivo. Salve. Neste arquivo esto as configuraes que voc gerou na criao do seu site em Joomla! . Configuration.php e configuration.php-dist so arquivos diferentes, no os confunda! No substitua o contedo do configuration.php-dist pelo cdigo que voc copiou para configuration.php. O arquivo configuration.php-dist utilizado apenas quando o instalador web falha, nele voc coloca manualmente a mesma coisa que gerado automaticamente pelo instalador web do Joomla!, s que voc dever configurar manualmente. A Estrutura do Joomla! O Joomla funciona da seguinte forma: A pessoa responsvel pelo site, altera as configuraes do Joomla, digita textos e etc. Essas informaes so passadas para o mySQL que as salva e quando um usurio acessa o site, o mySQL retorna essas informaes para o php que processa e devolve para o usurio como foi planejado pelo responsvel pelo site. 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, reas restritas aos usurios registrados e criao de novos contedos, instalao de novas funcionalidades. o Back-End fica numa URL diferente do site. Direitos de acesso Usurios registrados, autores, editores, super-administradores e visitantes sem registro vero o site de forma diferente, assim como as responsabilidades variam de acordo com o nvel de acesso de cada um.
21
Grupos de Usurios com acesso Front-End do Joomla!
Grupo Registrado Autor
Editor
Publicador
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
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
22
Administrador
Super Administrador
Grupo
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. Direitos de Acesso
Contedos
Os contedos so dados que sero exibidos para os usurios e sua forma mais simples texto. Pode ser uma msica, vdeo, imagem, links, enfim, entre uma infinidade de possibilidades, os textos podem ser organizados em categorias. Com a disseminao de blogs e sites de notcias, a forma mais popular o Newsfeed. A integrao e administrao de contedos como um Newsfeed tm sido cada vez mais importantes.
Extenses
Componentes, Mdulos, templates e plug-ins so referncias de extenses de Joomla! Tudo ao alcance de poucos cliques. 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. Mdulo: 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: Em sua maior parte, responsvel pela camada de comunicao entre o usurio e o Joomla, um exemplo bsico de plugin o tinyMCE, editor de textos do tipo wysiwyg (what you see is what you get) ou voc tem aquilo que v. Quando voc digita algum texto atravs do tinyMCE ele processa essas informaes em formato HTML por debaixo dos panos e salva no BD, quando o usurio vai ver este texto no front-end, ele ver exatamente da forma que foi escrito no tinyMCE. Existem diversas extenses pr-instaladas no Joomla, a cobriremos no prximo captulo. partir de agora, voc criar o seu primeiro projeto em Joomla e nele voc ver os detalhes dos passos mais importantes na criao de um projeto. H uma apresentao em formato de tutorial meu no site abaixo.
23
http://www.slideshare.net/JenniferPayne/aprenda-joomla-15-fcil Este material me inspirou a criar este livro e que uma mistura dos meus estudos em Joomla com os estudos do jovem indiano Saurabh R. Bhide em seu site www.lagoona.in voc encontra a sua obra original para download gratuito, em formato pdf, em ingls. Gerenciando um site em Joomla Quando voc instala o Joomla na sua mquina, voc pode gerar um site atravs dela e voc pode modific-lo atravs do seu domnio/nome_do_site, se voc instalou o xampp, no seu navegador, voc deve digitar http://localhost/pasta_que_criou_em_htdocs_do_xampp , se voc utiliza outras ferramentas para simular o LAMP, voc deve acessa-lo de acordo com o que instrudo nesta ferramenta/pasta, como por exemplo: http://127.0.0.1/livro . Para administrar seu novo projeto, tudo que voc tem a fazer digitar no seu navegador http://localhost/seu_site/administrator. Uma rea de login aparecer e voc deve digitar no campo login: admin e senha: (a que voc deu na sexta tela da instalao do Joomla)
OBS: Tire um tempo para imaginar qual o tipo de projeto que voc quer fazer, a idia que o site criado por voc utilizando este livro, esteja pronto para ir para internet, veremos como faz-lo no ltimo captulo.
Ok, chega de teoria e vamos comear a criar nosso site. Para tal, vamos fazer um quick-tour pelo Back End do Joomla!
24
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 aprendizado, usaremos essas ferramentas naturalmente, elas so bem intuitivas. Abaixo da barra de ferramentas, os contedos, menus, enfim, os dados da rea de administrao em que voc est, ser mostrada.
Site
Control Panel (Painel de Controle)
A pgina inicial do seu back-end (rea administrativa).
User Manager (Gerenciamento de Usurios)

25
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 agora olhar rapidamente na edio do usurio. Um Super Administrador, ou seja, voc por default, pode fazer o que quiser com a conta de outro usurio. A nica parte que realmente nos interessa aprender sobre os grupos de usurios e seus direitos. Clique em site User Manager
Observe que existe no lado direito um conjunto de botes que mostram as possibildades a ser feitas dependendo da rea que voc est, estes botes so auto-explicativos, vamos criar um novo usurio clicando em New (Novo)
Name: Nome do Usurio Username: Nome de login (sem espao ou caracteres especiais) E-mail: e-mail do usurio New Password: senha
26
Verify Password: confirmao da senha Group: Nvel de acesso do usurio de acordo como foi mostrado anteriormente Block user: Permite bloquear usurio Receive System E-mail: O usurio vai receber e-mail do sistema? Back End Language: Linguagem do backend (voc pode passar o seu Joomla para portugus) Front End Language: : Linguagem do frontend (voc pode passar o seu Joomla para portugus) Media Manager (gerenciador de Mdia) Voc pode enviar arquivos para o site, como imagens jpg, gif, png, swf e outros. bastante til caso voc no possa utilizar um programa FTP, como tudo no Joomla, bem intuitivo. Na rea Detail View (Visualizar Detalhes)
No lado esquerdo, voc tem a rea folders, que mostra a strutura de diretrios da pasta images. No lado direito, voc pode digitar um nome de uma nova pasta e clicar em Create Folder (criar pasta) para cri-la, no utilize espaos ou caracteres especiais. Logo acima, o boto delete, voc pode selecionar, atravs de checkboxes vrias imagens e exclu-las no boto delete. Na rea Upload File, escolha o arquivo e clique em Start Upload. Note que o padro do Joomla tamanho mximo de 10mb por arquivo, voc ver como aumentar esse limite atravs das configuraes globais, ficando limitado ao tamanho padro do php (32mb por padro), que voc pode aumentar, mas para enviar arquivos to grandes, utilize um programa FTP, conforme ensinado no captulo 06
27
Agora, tire um tempinho para criar uma pasta e enviar arquivos para elas utilizando o Media Manager.
Global Configuration
As configuraes gerais do seu site ficam aqui. Ex: Tempo de cache, quais tipos de arquivos esto liberados para ser tratados pelo Media Manager e outras variveis.
Site
Site Settings
Site offline e Offline Message Caso esteja marcado em yes, o site entrar em modo de manuteno e a mensagem que ser mostrada ao usurio ser o que est escrito em Offline Message. Marque em yes, digite uma mensagem qualquer e salve. No lado superior do seu backend h um link chamado preview, clique nele e veja que a mensagem aparece e seu site no est mais no ar. Acesse novamente o backend atravs dos campos de login que aparecem antes da mensagem de site em manuteno e volte para Global Configuration, marque site offline, no e clique em apply. Esta opo muito til caso voc tenha que fazer alguma alterao de emergncia no site e no quer que os usurios tenham acesso s informaes contidas nele atualmente. Como voc pode logar no backend ainda, voc pode continuar trabalhando normalmente no seu site.
28
Site Name O ttulo do site, o ttulo padro entre a tag <title></title> de um HTML comum, quando outro ttulo no for definido para o site. Para quem desconhece esta tag, sabe quando voc entra em um site e l em cima do navegador e no boto do site na barra de tarefas fica um nomezinho, geralmente Site de fulano de tal ou untitled-1 quando o webmaster gera o site utilizando alguma ferramenta e esquece de alterar... isso. Este ttulo de fundamental importncia e voc o conhecer melhor no captulo 02. Voc configurou o site name que est vendo agora, na ltima etapa da instalao do Joomla, lembra? Modifique-o vontade. Metadata Settings e SEO Settings
So informaes passadas para robs de busca e descrio do seu site que no aparecem para o usurio normalmente, voc ver mais informaes sobre elas no captulo 03.
System
Nesta rea, as configuraes importantes a conhecer, so:

29
User Settings
Allow User Registration No mdulo login, que veremos adiante, por padro, h um local para que o prprio visitante se cadastre no seu site, caso voc deseje desabilitado clique no, caso mantenha em yes, voc pode escolher o grupo de acesso padro ao qual ele pertence, em New User Registration Typeassim que se cadastre, o recomendado deixar em registered, mas voc poderia deixar em author, caso desejasse fazer do seu site uma espcie de Wikipdia, com contedo participativo. Lembrando que neste caso, o usurio enviaria o texto, mas ainda precisaria de um publicador para moderar e aprovar o texto. Legal, no? New User Account Activation Ao registrar-se um e-mail enviado ao usurio com o link para ativao. sempre bom manter ativado para evitar que o usurio passe um e-mail invlido. Front-End User Parameters Permite que o usurio configure configuraes como: Editor de texto, linguagem do site e outras coisas.
Media Settings
Legal Extensions Extenses permitidas de ser manipuladas pelo Media Manager. O resto dos parmetros bem auto-explicativo e geralmente no modificado.
Session Settings
Session Lifetime Durao em que o administrador pode permanecer logado em inatividade. Eu sempre aumento este valor para trabalhar com o site sem ter que ficar relogando quando paro para fazer outras coisas, mas lembre-se de voltar para 15 minutos antes de colocar no ar. Dica: Sempre que modificar alguma configurao no Joomla, clicar em Aplly salva a configurao e permanece na mesma pgina, enquanto Save, salva e te leva para outra pgina, ento, na medida que for alterando, clique em Apply e quando fizer a ltima modificao naquela rea, clique em save.
Server
Esta rea para usurios um pouco mais avanados, pois lida com as configuraes do seu site no servidor. Voc pode l-las com ateno, mas s modifique caso voc realmente precise e saiba o que est fazendo. Falando Nisso... Agora que voc j sabe as configuraes em ingls, que tal traduzir o Joomla para portugus? Mas o seguinte, aps realizar estas modificaes, eu recomendo que voc s utilize em portugus para fins de estudo, descobrir as funes no explicadas neste livro, caso voc no tenha noo de ingls. Como a maioria das extenses para Joomla so em ingls, o ideal que voc se habitue a utilizar o backend em ingls. Voc poder instalar o idioma portugus no prximo captulo.
30
Revisando o captulo...
At agora, voc viu quando utilizar o Joomla, como instal-lo, como criar novos usurios e como enviar imagens atravs do Media Manager, alm das configuraes principais da rea administrativa dele.
31
Captulo 02 Componentes, Mdulos e Plug-ins

Neste Captulo voc vai aprender sobre extenses, as principais diferenas entre elas, vai comear a gerar contedo para seu projeto e instalar algumas extenses alm de liberar as extenses padro do joomla, de acordo com as necessidades do seu projeto. Funcionalidades do Joomla Tabela comparativa entre componentes, mdulos e plug-ins Estruturando o site Planejando quais extenses utilizar em nosso site. Instalando novas Extenses Implementando as extenses padro do Joomla Entendendo Componentes Quais os componentes padro do Joomla O que eles fazem Componentes de terceiros
32
Funcionalidades do Joomla
Estas funcionalidades so as chamadas extenses do Joomla e como voc viu no captulo anterior, h 04 tipos de extenses: Componentes, Templates, Mdulos e Plugins. Fora o template, que nada mais do que o layout, a carinha do site, as outras extenses so as realmente agregadoras de funcionalidades e requer um pouco de ateno sua sobre suas diferenas. Abaixo, uma tabela comparativa entre elas.
Tabela comparativa entre componentes, mdulos e plugins

Componentes Mdulos Plugins
Geralmente necessita de rea administrativa, e s pode ter um por vez na rea principal do seu site. Ex: Artigos, formulrio de contato, frum, ecommerce
So cdigos mais simples onde podem (ou no) ser passados parmetros de configurao no backend. Podem existir vrios na mesma pgina e muitas vezes so usadas como apoio para os componentes. Ex: Enquete, ltimas notcias, HTML personalizado
O canal de comunicao entre o usurio e o Joomla, voc pode adicionar funcionalidades exclusivas disparadas por evento, no backend e muitas vezes dentro de artigos e contedos. Pode ou no ter parmetros associados a eles. Ex. TinyMCE, Plugin GoogleMaps
Estruturando o site
A instalao de novas extenses vm da necessidade de possu-las e para tal, necessrio saber aonde e quais utilizar. Para entender esta necessidade, recomendo fortemente que voc pegue um lpis, papel, borracha e comece a preparar a estrutura do seu site. Como exemplo para o livro, vou imaginar um portflio online para meus trabalhos. Primeira Etapa, descrever o bsico do site Nesta etapa, voc ir dividir as informaes que so necessrias ao seu site em links no menu. 1. Sobre Mim Texto resumo sobre minha vida profissional (minha pgina inicial) 2. Sites e Portflios Texto resumo sobre este tipo de trabalho
33
3.
4. 5. 6.
a. Sites Detalhamento sobre este tipo de servio e abaixo, miniatura de alguns destes trabalhos, ao clicar a imagem fica maior b. Portflios - Detalhamento sobre este tipo de servio e abaixo, miniatura de alguns destes trabalhos, ao clicar a imagem fica maior Projetos Grficos Texto resumo sobre este tipo de trabalho a. Impressos Detalhamento sobre este tipo de servio e abaixo, miniatura de alguns destes trabalhos, ao clicar a imagem fica maior b. Identidades Visuais - Detalhamento sobre este tipo de servio e abaixo, miniatura de alguns destes trabalhos, ao clicar a imagem fica maior Modelagem 3D - Detalhamento sobre este tipo de servio e abaixo, miniatura de alguns destes trabalhos, ao clicar a imagem fica maior Currculo Meu currculo, com algumas informaes e link para Download dele. Contato Formulrio de contato, mostrando algumas informaes minhas.
Apenas com essa descrio bsica, descobri que alm de textos, terei uma galeria de imagens em quase todos os links do meu site. Segunda Etapa, adicionando funcionalidades ao site Alm do que voc viu anteriormente, eu dou aulas, participo ativamente de alguns grupos de Joomla e mantenho um blog. No seria interessante se os meus usurios fossem capaz de ler as atualizaes do meu blog no meu prprio site? Agora que escrevi um livro, no seria legal se voc pudesse acompanhar algumas das novidades sobre ele, como erratas, por exemplo? E se voc pudesse escolher entre uma gama de assuntos o meu prximo livro ou qual novo artigo publicaria no meu blog? Isto tudo possvel com o Joomla e so formentados atravs das Extenses. Ento, eu vou adicionar um link chamado Blog, que ser alimentado com as atualizaes do meu blog e tambm um chamado Novidades, onde eu escrevo coisas relacionadas minha vida profissional que considero relevante. Para facilitar o entendimento visual, vou criar o que chamado de wireframe, que nada mais do que um rascunho visual da estrutura do meu site, eu, Jennifer, sempre fao esta segunda etapa em um papel primeiro. Primeira Pgina Geralmente a primeira pgina do seu site diferente das demais, porque nela voc mostra certos trechos do contedo do site, para que o visitante saiba o que o aguarda no site no momento que ele entra. Voc sabia que a deciso tomada pelo usurio de navegar no seu site decidida entre 0 e 30s? pois , por isso, decidi mostrar a minha primeira pgina da seguinte forma:
34
Pginas Internas Se o usurio clicou em algum dos links do seu menu porque ele descobriu que algo no seu site o interessa, neste intervalo de 30s! Sinta-se honrado! Nas pginas internas hora de dar a ele o que voc prometeu na pgina principal! Como meu o menu do meu site muito parecido internamente eu criei apenas uma pgina interna, voc deve descrever quantas sejam necessrias.
35
As pginas que no tiverem galerias, sero apenas o contedo, simples e objetivo. Pronto! Agora que voc definiu a estrutura do seu site, eu digo site, porque menor de digitar, mas quando eu digo site, me referindo ao projeto criado pelo Joomla, me refiro a sistemas online. O Joomla, mesmo sem extenses, capaz de criar reas administrativas e muitas coisas que fazem que este conceito de site, sabe aquele? Simples, somente com contedos estticos, sem graa, um fale conosco safado, apenas com o endereo telefone e e-mail ir para o lixo! Nos dias de hoje, nenhum cliente seu quer menos do que uma rea de notcias, formulrio de contato e galeria de imagens, no verdade? Embora ele s est disponvel a pagar o preo de um site bsico. O Joomla mais do que perfeito para estes casos!
Instalando Extenses
Instalar extenses um processo muito simples e para comear, vamos instalar agora uma extenso que te interessa bastante, que como transformar o Joomla em portugus. Gostou, n? Vamos l!
36
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/82-traducoes.html Faa o download dos arquivos Joomla! 1.5 - Backend pt-BR e Joomla! 1.5 - Frontend pt-BR Volte para a rea administrativa e clique em Extensions -> Install/Uninstall
No campo Upload Package File clique no boto para procurar o arquivo que voc baixou. Selecione o arquivo, e clique em Upload File & Install Uma mensagem avisando que foi instalado com sucesso aparecer, repita o processo, instalando a traduo do front-end tambm 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 coisa, se a administrao no mudar imediatamente para portugus, faa um logout e logue novamente na rea administrativa do site.
Alguns itens no estaro traduzidos, eu creio que, porque como as tradues foram feitas nas verses anteriores essa (1.5.10) quando produzi este material, algumas variveis devem ter mudado de nome nos arquivos e ento, os arquivos de traduo no conseguem localizar as antigas e o texto permanece em ingls. Mas creio que mais do que 95% permanecero traduzidos e a
37
utilizao do Joomla! em nada ser prejudicada com isso, desde que eu escreverei os caminhos nas duas lnguas.
s vezes voc corre o risco de se perder na rea administrativa do Joomla, quando isto acontecer, logo abaixo o menu, um ttulo aparece dizendo em que rea do site voc est, no nosso caso, Extension Manager. Note que voc est na aba Install, atravs desta rea que voc pode instalar as extenses no Joomla. Nas abas ao lado, h a lista das extenses instaladas, separadas por categoria de extenses, d uma navegada por elas, voc vai notar que algumas delas esto desativadas, em cor cinza, bem, est extenses so fundamentais para o funcionamento do Joomla e por isso no podem ser desinstaladas, o resto, voc pode desinstalar, selecionando a extenso e clicando em uninstall no lado direito da tela. H 3 formas de instalar componentes, eu utilizo duas delas... uma a que voc utilizou acima utilizando o Package File, outra forma bem legal utilizando a opo install from URL, voc vai colocar o link de download do arquivo e o Joomla instala para voc. Possveis Problemas s vezes ocorre de voc tentar instalar uma extenso e o Joomla dar uma mensagem de erro em vermelho, geralmente so dois erros
38
1. XML not found O Joomla procura em um nvel de zip e a extenso est compactada dentro do zip. A soluo que voc descompacte o arquivo e tente instalar novamente para o zip correto 2. Failed to move file Voc no tem permisses para alterar os arquivos. D estas permisses (pode acontecer no seu servidor web, neste caso, utilize um programa FTP para faz-lo ou pea ao suporte do seu servidor), caso voc esteja trabalhando no Linux, por segurana dele, isto VAI acontecer, neste caso, clique com o boto direito, Propriedades -> Permisses e aplique as configuraes de leituraescrita de arquivos na pasta raiz do seu site.
Entendendo Componentes
uma aplicao no Joomla que mostrado na parte principal (de contedo) do site. Pode ser uma rea de download, galeria, frum, no importa. O que voc deve entender, que s pode haver um componente por vez na rea principal do seu site, embora, muitos componentes so parte mostrados em mdulos, para poder utilizar sua funcionalidade completa. Quais os componentes padro do Joomla Banners (publicidade) Contacts (contatos) Newsfeeds Polls (enquetes, votao) Search (pesquisa) Weblinks Massmail (e-mail em massa)
O que eles fazem
Banners Adicionar banners publicitrios rotativos no seu site, voc cria os clientes, categorias e banners, define quantos cliques limite aquele banner possui, adiciona cdigo personalizado para ele, e tamanho, link de redirecionamento, entre outras coisas. (Utilizado em conjunto com mdulo). Criando seus banners
39
Para adicionar novos banners v at a pasta onde est seu site e abra o diretrio images/banners, coloque as imagens que sero seus banners l dentro. Logue na rea administrativa do seu site e clique em Components (componentes) Banners Categorias. Clique em New (Novo). Como todas as categorias criadas no Joomla, voc deve dar um ttulo, um alias (apelido opcional - se deixar em branco o joomla cria um alias pra voc - que ser usado para tornar as urls amigveis, ver no captulo 03) descrio e demais campos tambm so opcionais. Agora clique em Banners Clients (Clientes) New (novo). Preencha na ordem dos campos o nome do cliente, nome do contato, email do contato e opcionalmente informaes extras sobre o cliente como telefone, o acordo feito, etc. Ex: Soft.Zone, Jennifer Payne, Jennifer@softzonebr.com Finalmente, clique em Banners banners. Vou descrever as caractersticas mais utilizadas: Nome D um nome para o banner. Categoria Categoria onde o banner se enquadra. Cliente Cliente responsvel pelo banner Exibies Contratadas Voc pode tanto colocar um nmero mximo de cliques que o banner pode receber como marcar a caixinha de ilimitado, caso queria que no tenha limite de cliques para exibir. Url de destino define para que pgina o banner leva Seletor de imagem do banner Escolha a imagem que representa o banner Largura, Altura Tamanho da imagem (deixe em branco para pegar o tamanho padro da imagem) OBS: Banners um dos componentes padro que tem como complemento um mdulo. Voc cria categorias, clientes e os prprios banners e escolhe quais categorias sero exibidas e onde atravs do mdulo banners. Contacts Voc pode criar categorias de contatos para seu site (Ex: Vendas,SAC, diretoria) e vincular contatos a essas categorias. Voc pode dispor de diversas informaes sobre estes contatos (Ex: Telefone, endereo, pas) e depois, criar links de menu no seu site que mostra um nico contato ou uma categoria deles. Os parmetros que iro aparecer sobre este contato so de sua escolha, porm o formulrio de e-mail que as pessoas iro preencher padro. Ele exibe os seguintes campos de preenchimento do visitante: Nome, e-mail, assunto, mensagem e se o usurio quer enviar um cpia de e-mail para si (muito til) Crie uma categoria em Contatos Categorias. Crie um contato em Contatos Contatos. Este componente tem os campos bem auto explicativos. O que as pessoas confundem que estes campos (Ex: telefone, endereo, cdigo postal) no so os campos que voc deseja ter num formulrio de contato. Estes so os campos com os dados pessoais de algum, por exemplo, um funcionrio da empresa. muito comum criar apenas um contato, cham-lo de Fale Conosco e colocar nos campos os dados da empresa dona do site. Voc escolhe quais campos exibir no lado direito e ainda se o formato descritivo do campo aparecer com cones, textos ou nenhum dos dois. Podemos escolher ainda se o contato est vinculado a algum usurio do site (ele envia os dados do formulrio para o e-mail deste usurio), caso no, o formulrio ser enviado ao e-mail digitado no
40
campo e-mail. Quando estivermos explorando os menus, poderemos criar um link para o formulrio de contato. Newsfeeds Voc pode exibir notcias em seu site, criados por terceiros, que compatilham estas notcias utilizando feeds. (Utilizado em conjunto com mdulo) Polls Crie uma enquete bsica, onde o usurio vota em algo e pode visualizar os resultados prvios desta votao, voc pode regular quantos segundos so necessrios antes daquele IP poder votar novamente (ajuda a prevenir spam), no entanto, este componente muito bsico e ser excludo na verso 1.6 do Joomla. (Utilizado em conjunto com mdulo) Search Permite aos usurios fazer pesquisas de artigos do seu site (Utilizado em Conjunto com mdulo) Web Links Todas as pginas em Joomla pode(m) conter links para outras pginas, no entanto, esta funcionalidade permite que voc organize os links por categorias, ter descrio dos links, saber quantos cliques foram dados em cada um deles e voc ainda pode criar um item de menu onde os usurios do site podem enviar links para seu site! ATENO: Apenas usurios com acesso acima de autor (author) podem publicar links, ento, cuidado a quem voc concede este direito. E apesar de que se envie o link, apenas os nveis acima de publicador podem permitir que o contedo v ao ar. Massmail E-mail em massa permite que voc mande e-mails aos usurios registrados. Suas funcionalidades so limitadas, comparados com os criados por terceiros e til apenas para mandar e-mails rpidos para certos grupos de usurios (Ex: Administrator) Componentes criados por terceiros Estes componentes padres do Joomla so muito bons, mas pode no ser suficiente para suas necessidades. Por isso, o Joomla apresenta esta caracterstica onde voc pode criar coisas para o Joomla de acordo com suas necessidades ou utilizar funcionalidades criadas por outras pessoas. Estas funcionalidades so chamadas de extenses. Existem mais de 2.000 extenses criadas para Joomla e cada uma tem suas particularidades. Entre os milhares existentes, existem os mais populares como: Jcal Pro calendrios JoomFish adicionar vrias linguagens ao site, como ingls, espanhol) voc escreve o mesmo texto em vrias linguagens e lista qual artigo aparece em certa linguagem VirtueMart e-commerce
41
Community Builder Uma espcie de orkut para Joomla. sh404SEF Ajuda o Joomla a criar URLs amigveis. Utilizaremos ele para aumentar o SEO (Search Engine Optmization) JoomlaXplorer Gerenciador de FTP para Joomla. Eu, particularmente prefiro utilizar o Filezilla na minha mquina, para todos os meus sites. Xmap Ajuda a criar mapas de site para o seu sistema em Joomla Docman Ajuda a gerar e gerenciar reas de download no seu site. ChronoForms Crie formulrios personalizados utilizando esta extenso. AllVideos Exibe vdeos hospedados em outras pginas (Ex: Youtube) de maneira fcil. Ozio Image Gallery Galeria em Flash com vrios tipos de apresentao (3d, carousel e outros) Expos Flash Gallery Galeria em Flash tambm muito bonita
42
Mdulos Mdulos podem ser pensados da seguinte forma: Extensor de funcionalidades para certos componentes; Como mini-aplicativos no seu site, mais leves do que os componentes, no tm rea administrativa, porm podem ser configurados atravs de parmetros Voc pode ter diversos mdulos no seu site, enquanto voc s pode ter um componente por vez
Voc pode pensar nos mdulos como widgets* no seu site. Configuraes de mdulos Todos os mdulos tem opes comuns para como o contedo ser apresentado No lado esquerdo h os detalhes dos mdulos: Ttulo Publicado/despublicado Posies (voc pode escolher uma entre as disponveis no template) A ordem entre os mdulos disponveis naquela posio Nvel de acesso
Sobre o nvel de acesso, utilizando essa ferramenta corretamente, possvel criar sites completamente diferentes para cada grupo de acesso, modificando a forma como os mdulos so dispostos. Na parte de baixo esquerda, voc pode escolher em quais items de menu do site aquele mdulo ser exibido, as opes so: Todos, nenhum e na ltima opo, voc pode utilizar as teclas SHIFT e/ou CTRL para selecionar mltiplos links no menu onde aquele mdulo ser exibido. Note que o mdulo est vinculado ao link do menu e no a pgina qual ele se refere. Ex: Se eu modificar um link chamado onde estamos, do tipo wrapper para o tipo layout de artigo padro, o mdulo ainda sim ser mostrado ao ser clicado. Eu recomendo fortemente que voc desenhe a estrutura do seu site em um papel e nela, mostre qual(is) mdulo(s) sero mostrado(s) em qual(is) parte(s).
*widgets segundo o wikipedia: Um widget um componente de uma interface grfica do utilizador (GUI), o que inclui janelas, botes, menus, cones, barras de rolagem, etc..
43
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. Outro emprego do termo so os widgets da rea de trabalho, pequenos aplicativos que flutuam pela rea de trabalho e fornecem funcionalidade especficas ao utilizador (previso do tempo, cotao de moedas, relgio, ...)
Mdulos padro Os mdulos padro so divididos em alguns tipos como: Mdulos de contedo, mdulos relacionados componentes, e mdulos miscelneos (que no se enquadra nas outras categorias de mdulos) Mdulos de contedo Archived Content (Contedo Arquivado) Mostra uma lista de meses de links para todos os contedos arquivados do site. Latest News (ltimas Notcias) Mostra uma lista de links dos ltimos artigos adicionados. Infelizmente ele mostra somente contedo de uma certa categoria ou seo especfica Newsflash (Notcias em Destaque) Mostra notcias randmicas de uma seo ou categoria, voc pode mostrar uma introduo ao texto ou somente seu ttulo. Most Read Content (Populares) Mostra uma lista de links dos contedos mais clicados no seu site. Pode mostrar contedos de uma seo ou categorias especficas. H muitas extenses desenvolvidas por terceiros que tratam de contedo melhor que o padro do Joomla, mas no hpa como garantir a confiabilidade ou funcionamento. Related Items (Artigos Relacionados) Mostra uma lista de links relacionado quele que est sendo visualizado. O Joomla decide a relao atravs do uso de palavras-chave, (metatag keywords) que voc ver no captulo que trata SEO, SEF e segurana mais a frente. Sections (Sees) Mostra uma lista de links para todas as sees do seu site. No h um equivalente para categorias. Random Image (Imagem Randmica) Mostra imagens randomicamente.
Dica:
Voc pode utilizar este mdulo como o topo de sua pgina para mostrar imagens diferentes de topo cada vez que o usurio entrar Custom HTML (HTML Personalizado) Voc pode inserir um contedo HTML personalizado, como um flash atravs da tag <object>, um javascript, um texto ou imagens qualquer
Mdulos Relacionados componentes
44
Alguns componentes do Joomla tm suas funcionalidades completas quando utilizados em conjunto com certos mdulos. Syndicate (sindicato) Complementar ao componente sindicato. um RSS feed no componente FrontPage. Significa que no importa onde o mdulo sindicato est, s mostrar feed publicado pelo FrontPage Obs: FrontPage no est necessariamente na pgina inicial do site. O Joomla define o primeiro link como a home, o link marcado como default (padro), voc pode mover o componente FrontPage para outras reas do site. til para blogs que voc no quer mostrar na pgina inicial. Poll (Enquete) Utilizado com o componente votao, mostra uma enqute e suas perguntas
Mdulos Miscelneos Login Mostra um formulrio para usurios se registrarem ou logarem. Menu Mostra os menus do site. Whos Online (Quem est online) Mostra o nmero de usurios registrados e online no site naquele momento. Statistics (Estatsticas) Mostra informaes sobre os visitants e/ou informaes tcnicas do servidor. Feed Display (Mostrar Feeds) Mostra um feed, como o componente Newsfeed que pode mostrar um feed no contedo. Wrapper (iframe) Carrega uma pgina externa dentro de um mdulo, como o do componente. til para carregar diferentes contedos de dentro de areas pequenas do site.
Mdulos de Terceiros Abaixo, uma lista de mdulos interessantes para Joomla 1.5 JPG Flash Rotator 2 (Imagens Aleatrias)http://www.joomlashack.com Jumihttp://www.vedeme.cz AdSense Modulehttp://www.joomlaspan.com Plugins Plugins So geralmente uma janela de comunicao entre o Joomla e o usurio. Um bom exemplo de um deles o editor de texto tinyMCE. Ex: Um autor digita e formata o texto adicionando imagens,
45
swf, links e o tinyMCE vai gerando um cdigo HTML por trs. Quando o usurio salva, o tinyMCE salva estes arquivos no Banco de Dados e quando o visitante do site vai visualizar aquele artigo, o BD devolve o texto de acordo com o que foi projetado pelo autor, atravs do tinyMCE. O que voc vai perceber que voc no gerencia os plugins com a mesma freqncia que componentes e mdulos. Plugins Padro Autenticao (Authentication) Joomla tem vrios plugins que permitem integrao da autenticao de login com outros sistemas como Gmail, OpenID e LDAP. Content-Code Highlighter Este plugin ir destacar cdigo no contedo (quando voc usa a tag <cpre>)de acordo com os padres GeSHi Content-Email Cloaking (Camuflagem de e-mail no contedo) Este plugin converte qualquer endereon de e-mail em JavaScript. Desta forma, e-mails no seu contedo no so detectveis por programas para gerar spam. Content-Load Modules (Carregar Mdulos no contedo) bem interessante, quando voc precisa carregar um mdulo em uma rea especfica do site. Voc pode carregar um mdulo dentro do contedo de um artigo escrevendo [loadpositions user2] onde voc quiser que o mesmo aparea. Botes: Image, Pagebreak(Quebra de pgina) and Readmore (leia mais) Este plugin controla estes botes no editor de artigo. Editors H 3 opes de editores no Joomla Padro: No Editor, TinyMCE e Xstandard Lite. Search (Pesquisa) Controla a indexao e pesquisa de contedo. System Legacy (Sistema - Legado) Permite que voc utilize extenses desenvolvidas para Joomla 1.0.x desde que as mesmas tenham atualizado seu cdigo para rodar no modo joomla 1.5 legacy. SystemCache Controla o cache do sistema. XML-RPC permite a comunicao entre o Joomla e outros sistemas controlados utilizando a tecnologia XML-RPC e permite administrar o Joomla remotamente.
Plugins de Terceiros Assim como para componentes e mdulos, h diversos plugins para o seu site em Joomla. Dica: H mais de 4.430 extenses desenvolvidas para Joomla at o momento, delas, h em mdia 2.000 extenses para Joomla 1.5 Native e Joomla 1.5 Legacy que so gratuitas. Vale muito a pena voc dar uma olhada neste endereo http://extensions.joomla.org/ e dar uma conferida nas extenses oferecidas para voc!
Incluindo Mdulos e Plugins em artigos

46
bem comum a necessidade de inserir um mdulo ou plugin dentro de artigos, pode ser um banner, HTML personalizado, enquete ou outros tipos de mdulos e plugins. Incluindo mdulos Crie ou edite um artigo qualquer e na rea onde voc quer que o mdulo seja carregado, digite {loadposition posicao_onde_o_modulo_esta}, o Joomla carregar todos os mdulos que esto programados para aparecer naquela certa rea. O problema disso que se h outros mdulos possveis, ele carregar neste lugar. A soluo simples, no mdulo que voc deseja carregar no artigo, no lugar da posio, apague a posio atual e digite uma que voc saiba a que se refere, de preferncia nica. Note que o fato de voc ter criado esta nova posio, no significa que ela est inserida em seu template (voc ver esse assunto com mais detalhes no Captulo 04). Pronto! Aps renomear para algum nome sem espao ou caracteres especiais, no meu caso criei uma posio jennifer no mdulo, no artigo eu colocaria assim: {loadposition jennifer}. Incluindo Plugins As palavras entre chaves {} nos artigos significam para o Joomla que so parmetros a ser interpretados. No caso do {loadposition}, significa carregar os mdulos da posio dada naquele local especfico do artigo. No caso de Plugins, quando o plugin do tipo Content, voc pode inserir este plugin dentro dos artigos, mas os parmetros variam de acordo com o plugin. No final deste livro, voc trabalhar com o plugin Plugin Google Maps, ele foi feito para a verso do Joomla 1.0.x mas pode ser utilizado na verso 1.5 ele utiliza o seguinte parmetro {mosmap} para ser carregado, o que ele faz carregar um dado mapa do Google seguindo os parmetros totais dados por voc. Cada plugin tem uma forma nica de ser carregado. Incluindo SWF no Joomla H duas formas de inserir um SWF no Joomla, uma delas (a mais simples) colocar a tag <object> como seria feito num HTML normalmente no mdulo custom HTML (HTML personalizado) e adicionar as seguintes tags: <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40, 0" width="900" height="130">
47
<param name="width" value="900" /> <param name="height" value="130" /> <param name="loop" value="true" /> <param name="play" value="true" /> <param name="src" value="http://www.seusiteaqui.com.br/banner.swf" /> <param name="scale" value="showall" /> <param name="wmode" value="transparent" /> <param name="menu" value="false" /> <embed type="application/x-shockwave-flash" width="900" height="130" loop="true" play="true" src="http://www.seusiteaqui.com.br/banner.swf" scale="showall" wmode="transparent" menu="false"> </embed> </object> Note que h alguns parmetros que devem modificados por voc. width e height definem altura e largura do swf, loop define se seu arquivo ficar se repetindo em loops, play define se seu arquivo comea ao ser carregado ou ser executado ao clicar em algum boto para iniciar, por exemplo, wmode, se o fundo do swf ser transparente ou no ( isso mesmo! seu swf pode ter fundo transparente! Caso voc no tenha criado um objeto com cor-de-fundo no fundo, claro!) o src=define onde est o arquivo swf que voc est colocando. Escolha o mdulo onde seu swf vai aparecer, e pronto! Outra forma inserir o cdigo diretamente no arquivo, o que acontece que por padro o Joomla probe os usurios de inserir HTML dentro de artigos para proteo do site, h como permitir essas inseres, logue como super administrador. V em Content Article Manager (Contedo Administrador de Artigo) em Parameters (parmetros), role a rolagem para baixo e onde tem filtering options, filtering groups, selecione todos os os grupos, menos o super administrador utilizando o SHIFT ou o CTRL e marque a opo Blacklist (Default). Salve e pronto. Ainda assim alguns cdigo no podero ser inseridos, h diversos plugins que permitem a insero de html e php dentro de artigos no Joomla.
48
Criando seu primeiro site em Joomla! Este passo-a-passo que voc ver a seguir uma mistura dos meus estudos em Joomla com os estudos do jovem indiano Saurabh R. Bhide em seu site www.lagoona.in voc encontra a sua obra original para download, em formato pdf, em ingls. H uma apresentao em PowerPoint criada por mim na internet que mostra essas etapas na criao de sites simples em Joomla e est disponvel gratuitamente em: http://www.slideshare.net/JenniferPayne/aprenda-joomla-15-fcil Agora voc aprender a:
Instalar o 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
Gerenciando um site em Joomla 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.
49
Wikipdia tem muitas informaes sobre babunos: acesse http://en.wikipedia.org/wiki/Baboons para maiores detalhes. Eu as utilizei para a criao deste site que ser muito simples e consiste de 4 pginas. Veja como faremos nosso site em 4 passos fceis:
Escreva o nome do site Crie as pginas Faa links de menu para estas pginas Remova o desnecessrio no site
Ok, chega de teoria e vamos comear a criar nosso site. Para tal, vamos fazer um quick-tour pelo Back End do Joomla!
50
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. Abaixo da barra de ferramentas, os contedos, menus, enfim, os dados da rea de administrao em que voc est, ser mostrada. 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 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
51
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 agora olhar rapidamente na edio do usurio. Um Super Administrador, ou seja, voc por default, pode fazer o que quiser com a conta de outro usurio. A nica parte que realmente nos interessa aprender sobre os grupos de usurios e seus direitos. 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 site

Este muito simples. V na rea administrativa (back-end) do site acessando http://localhost/joomlabeta/administrator/ ou o nome do seu site no lugar do joomlabeta. Logue utilizando seu username como admin e a senha de administrador que voc colocou na tela 6 de instalao do Joomla. Voc entrar na rea administrativa do Joomla!.
Clique em Global Configurations, agora, utilize o campo Site Name para especificar o nome do seu site, que Baboons no meu caso. Agora clique no boto salvar no topo, lado direito. Voc ver a mensagem The configuration Detals have been updated. Voc tambm ver o ttulo do navegador agora conter o nome do seu site. Parabns, voc fez a primeira modificao do seu site!
52
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/82-traducoes.html Faa o download dos arquivos Joomla! 1.5 - Backend pt-BR e Joomla! 1.5 - Frontend pt-BR Volte para a rea administrativa e clique em Extensions -> Install/Uninstall No campo Upload Package File clique no boto para procurar o arquivo que voc baixou. Selecione o arquivo, e clique em Upload File & Install
53
Uma mensagem avisando que foi instalado com sucesso aparecer, repita o processo, instalando a traduo do front-end tambm 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 coisa, se a administrao no mudar imediatamente para portugus, faa um logout e logue novamente na rea administrativa do site.
Alguns itens no estaro traduzidos, eu creio que, porque como as tradues foram feitas nas verses anteriores essa (1.5.11) quando produzi este material, algumas variveis devem ter mudado de nome nos arquivos e ento, os arquivos de traduo no conseguem localizar as antigas e o texto permanece em ingls. Mas creio que mais do que 95% permanecero traduzidos e a utilizao do Joomla! em nada ser prejudicada com isso, desde que eu escreverei os caminhos nas duas lnguas.
54
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 social dos babunos 4. Tipos de Babunos
muito fcil de criar pginas. Na rea administrativa, clique em Add New Article, (Adicionar Artigo). Voc tambm pode ir atravs de Content -> Article Manager (Contedo -> Adicionar Artigo), no menu, no lado direito, clique em New (Novo)
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.
55
Observaes 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. Note ainda que estas pginas criadas por voc ainda no esto visveis no site. E estaro visveis somente aps criarmos um link de menu para elas. Agora que temos as 4 pginas, vamos ao prximo passo e criar links de menu para elas
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.
56
Aqui voc ver uma lista de todos os links que j so presentes no menu principal. Agora, clique no boto novo (new) no topo direita, para criar um link de menu para uma de nossas 4 pginas.
Ser mostrado uma lista de tipos de itens de menu.

57
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. Agora voc ser levado uma tela onde voc tem que especificar o nome deste link e o artigo vinculado a ele. Nosso primeiro link para a pgina inicial, por isso, escrevi o ttulo e apelido (alias) Home.
58
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!
59
Vinculando ao artigo Na rea superior, direita desta pgina, voc ver uma caixa nomeada Parmetros de Item de Menu (Menu item parameters). Nesta Caixa, clique no boto selecionar prximo ao campo selecionar artigo para especificar qual artigo ser mostrado quando o link for clicado
Uma janela popup aparecer com uma lista de todas as pginas. Voc deve dar um clique-duplo na pgina em que quer criar o vnculo com este item de menu. Fazendo isto, voc seleciona o artigo/pgina que ser mostrado quando um usurio clicar neste link que estamos criando.
Agora, o campo selecionar artigo mostrar o nome da pgina que voc selecionou. 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.
60
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 criou. Clique nele e ele mostrar a a pgina que voc criou. Se voc j criou os links para os outros artigos, voc ser capaz de visualiz-lo como na figura abaixo, se no, crie-os agora.
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.
61
2. Quando o site for visitado atravs de localhost/joomlabeta, a pgina Home que criamo ser mostrada. 3. Todos os outros links para o menu devero ser removidos. A prxima pgina mostra uma baguna tpica do J! quando o mesmo instalado utilizando os exemplos de contedo H muitas coisas nele. Estas coisas so chamadas mdulos, foram descritas anteriormente, e so mostradas em caixas na figura seguinte. O nico mdulo requerido o Main Menu, e todos os outros no so necessrios no nosso site. Vamos escond-los!
62
Seu site deve estar assim agora:
Varrendo para debaixo do tapete Para esconder estes mdulos desnecessrios, v para o back-end localhost/joomlabeta/administrator 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. Marque as caixas ao lado de todos os mdulos, exceto por Main Menu e ento clique no boto Desabilitar no topo direito.
63
Isto dever esconder todos os mdulos, caso voc tenha uma segunda pgina de mdulos, voc deve ir nela e desabilit-los tambm.
Limpando os items de menu extras Agora vamos limpar o Main Menu e 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 -> Main Menu. Ser mostrada uma lista de todos os links atualmente vistos no seu site. Para fazer a sua pgina Home padro, a selecione marcando o checkbox e clique em Padro (Default) no topo direita. Agora voc notar que uma estrela apareeu prxima a este link, ele agora o que aparecer quando voc digitar localhost/joomlabeta Para limpar o menu e remover todos os links que no so requeridos, faa igual voc fez aos mdulos. Selecione todos os links que deseja esconder e clique em despublicar (unpublish)
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.
64
Este o seu primeiro site em Joomla!
Como um contedo salvo
O contedo em Joomla! so as pginas de informaes a ser mostradas no site. H dois tipos de contedo: Com 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.
65
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 ;)
66
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 manualmente, e ser muito mais fcil de fazer o site. Quando quer que eu faa um site ou aplicativo web, eu primeiro desenho a estutura em um pedao de papel. Isto facilita bastante. Ento aqui est a estrutura:
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. 2. 3. 4. 5. 6. 7. 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 Adicionar links para todas as coisas acima no menu Organizando a pgina
67
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 front-end. necessrio criar os links para estes contedos. Voc pode cri-los agora, como fez no site dos babunos ou faz-los posteriormente. 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 descrio para ela no campo de texto. Uma sugesto de descrio seria: Esta seo contm todas as informaes sobre os diferentes departamentos em nossa faculdade. Salve atravs do boto Save. Esta seo foi adicionada lista de sees e voc poder edit-la, delet-la ou criar uma nova em Section Manager
68
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 departamento

Crie categorias atravs do Category Manager pelo control panel ou atravs do menu Content -> Category Manager. Agora, criaremos uma categoria para cada departamento da faculdade. Para faz-lo, clique no boto New Escreva o nome da categoria (Departamento) como ttulo. E selecione a section como departments, como esta categoria um departamento. Olhe a figura ao lado se voc est confuso. Escreva uma descrio pequena do 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.
69
Passo #5: Adicionar pginas/itens de contedo nestas categorias
70
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 engineering) precisa de 3 pginas: 1. Faculty: Uma pgina sobre o corpo docente do departamento 2. Facilities: Mostra todos os laboratrios e maquinrios 3. Projects: Mostra todos os projetos legais feitos por estudantes no departamento.
71
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.
Step #6: Adicionar links para todas as coisas acima no menu

Uma vez que voc criou todas as diferentes pginas para cada departamento, hora de adicionar links para todos os contedos no menu.
72
1: Adicione links para os contedos sem categoria como fizemos no site dos babunos. 2: Add Links para as pginas dos Departmentos 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. No back-end, v para Menu -> Main Menu Clique no boto new Clique emArticles na lista Internal Links A lista expandir. Clique em Category List Layout na sub-lista Category
Na caixa direita Menu Item Parameters , selecione a categoria apropriada.
Abaixo desta caixa, h mais duas caixas que esto minimizadas no momento mas podem ser expandidas ao clicar no nome. Clique no boto Save no topo, direita Se voc visitar o site, ver o link no menu e ao clicar nele, ver uma lista de todos os artigos/pginas pertecentes quele departamento.
73
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.
Na verdade, s precisamos dos nomes das pginas, vamos remover o resto. No back-end, v para menus -> main menu -> mechanical department. Esta pgina contm as facilidades para editar as configuraes para o item de menu. Agora voc apenas tem que mudar os parmetros para este item de link. direita, a caixa Parameters-basic dever ser expandida, clicando em seu nome. Nosso segundo site padro est pronto! Faa as seguintes configuraes:
74
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 aparentar assim:
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.
75
Ao editar qualquer pgina/link/categoria, os 5 botes acima estaro disponveis no lado direito, acima. Preview : Mostra a voc como o contedo que voc escreveu ser mostrado no navegador. Save : Salva as modificaes feitas e vai para a pgina anterior a essa que voc est criando/editando. Apply : Salva suas modificaes e permanece na pgina de edio. Close : Fecha a tela de criao/edio sem salvar. A no ser que voc j tenha clicado em Apply antes. Permanece a ltima verso salva.
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: http://joomlacode.org/gf/download/frsrelease/6418/20469/rt_novus_j15.tgz Como j vimos antes, um template uma extenso do sistema Joomla!. Para instal-lo, logue no back-end e v para Extensions->Install/Uninstall Na caixa Install from URL, digite a URL acima. Clique Install. Joomla! automaticamente far o download e instalar o template! Voc receber uma mensagem de que foi instalado com sucesso e um screenshot
76
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_do-seu_site\templates\rt_novus_j15\images H duas imagens que podem ser substitudas: inset-banner.jpg logo.png Modifique estas imagens ao seu gosto e estamos prontos!
Verso do livro finalizada
77
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, claro! 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
78
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) 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 para visualizar o contedo. Caso logue um usurio com permisses para modificar o site (autor, administrator, etc), nas reas onde ele pode alterar, aparecer um boto de edio, assim, este usurio no precisa logar-se na rea administrativa para modificar contedos do site. Links teis Clique em Extenses -> Administrar Mdulo Clique em Votao e em seguida no boto prximo Preencha os parmetros Selecione a Enquete desejada Salve
Esse componente bem simples, voc apenas adiciona links e diz a forma de comportamento ao clic nele (ir para outra janela, abrir na mesma janela) Antes de criar os links, devemos criar uma categoria para eles.
79
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, (procure o local no Google Maps) 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 prdefinidos 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
80
Captulo 04 SEO, SEF e segurana

04.01 - Como manter seu Joomla seguro um assunto delicado, j que no h nenhum site totalmente seguro na internet e se complica um pouco mais em relao CMS em geral. O problema com CMS que apesar de ter uma equipe de segurana envolvida no processo de desenvolvimento, a falha em um CMS o mesmo que dizer falha em todos os sites que utilizam aquele CMS. No caso do Joomla, outro fator complicador so as extenses, existem mais de 3.000 extenses no Joomla e voc no tem como saber se a pessoa quem desenvolveu tomou todas as precaues necessrias.
Abaixo, voc ler a traduo dos conselhos dados pela equipe de segurana do Joomla, artigo original em http://www.joomlasecurity.info/
Utilize a verso mais nova de segurana do Joomla Esta a primeira atitude que voc deve tomar. Como colocar seu joomla na verso atual Este um guia de como colocar seu Joomla em uma verso mais nova. Por que voc deveria fazlo? Primeiro e mais importante, porque queremos que seu site me Joomla seja seguro. Todos os websites dinmicos so mais ou menos vulnerveis ataques hackers, que devem querer adicionar spam ao seu site, danific-lo ou entrar nele e roubar informaes. Os desenvolvedores Joomla so determinados a estar um passo frente dos hackers o tempo todo, mas em ordem de voc se beneficiar dos esforos da equipe, voc precisa manter sua instalao do Joomla, atualizada. Tenha certeza de checar se h novas verses de vez em quando, e fazer o upgrade sempre que houver uma nova verso disponvel que foi dito lidar com vulnerabilidades de segurana. Aqui est como dar atualizar seu Joomla para uma verso mais nova: Descubra a verso atual da sua instalao. O nmero mostrado na parte direita, no topo de sua rea administrativa.
81
Baixe o patch de atualizao apropriado. Por exemplo, se voc tem a verso 1.5.2 e quer atualizar para a verso 1.5.5, voc baixa o patch nomeado Joomla_1.5.2_to_1.5.5-StablePatch_Package.zip. Encontre a verso apropriada em http://joomlacode.org/gf/project/joomla/frs/ Descompacte o patch na sua mquina 1. Envie os arquivos via FTP no servidor web e deixe-o sobreescrever os arquivos
existentes da sua instalao Joomla
Cuidado! Certifique-se de fazer um backup na sua instalao Joomla antes de fazer o upgrade. s vezes algum plug-in ou componentes de terceiros no so compatveis com a verso atual. raro acontecer, mas se tiver um backup antes de comear, evitar problemas caso saia algo errado. Utilize somente extenses seguras de terceiros e as mantenha atualizadas
A maioria das vezes quando as pessoas dizem que seus sites em Joomla foram hackeados, o problema de segurana no vem do Joomla em si, mas sim o hacker veio de uma extenso de terceiros insegura. Cheque a lista de extenses vulnerveis neste endereo: http://docs.joomla.org/Vulnerable_Extensions_List
Utilize username e senha seguros para administradores No utilize o nome de usurio padro admin. Mude-o para algo seguro e escolha uma senha segura. Uma senha segura contm no mnimo 8 caracteres que misturam letras, nmeros e caracteres especiais.
Utilize um componente SEF que torne seu Joomla mais seguro Um componente SEF usado para fazer as URLs do seu site mais amigveis para mecanismos de buscas. Mas um bom SEF tambm d benefcios em segurana. Uma URL padro diz muito sobre a pgina visitada, que a pgina em Joomla e quais componentes foram utilizados para produzir aquela pgina. Um componente SEF mascara esta informao e torna mais difcil para um hacker encontrar eventuais vulnerabilidades na segurana.
82
O componente SEF chamado sh404SEF inclui um componente de segurana que para vrios ataques no seu website e manda a voc um aviso sempre que seu site estiver exposto a um ataque (Aprenderemos a utilizar este componente mais a frente). Tambm te d a opo de remover o gerador de tag do seu site. O tag gerador diz ao mundo que seu site gerado em Joomla. Claro que uma coisa boa dar crdito ao Joomla, mas h outras maneiras de ajudar a comunidade joomla que no ajudem hackers ao mesmo tempo. Se voc no disser ao hacker que seu site feito em Joomla, torna muito mais difcil para ele saber de onde comear a hackear. Utilize um componente SEF que torne seu Joomla mais seguro
Evite qualquer servidor web que utilize php safe_mode, safe_mode deveria estar OFF. Prefira PHP 5 do que PHP 4
No conte a ningum sobre suas configuraes

Tenha certeza que ningum de fora pode ver sua informao php (configurao do servidor), pelo phpinfo (veja: http://se.php.net/phpinfo) para mais detalhes Esconda a tag geradora que mostra que voc utiliza um CMS em Joomla. Note que no estamos dizendo que Joomla inseguro e sim que ser mais difcil para um hacker especializado em Joomla reconhecer que seu site feito em Joomla. Use um SEF como o sh404SEF para mascarar os componentes do seu site
Proteja seu configuration.php (torne-o unwritable) Voc deveria proteger seu configuration.php, que est localizado na pasta raiz de seu site. O Joomla protege este arquivo por padro. Voc pode fazer isto manualmente colocando o arquivo mudando o CMOD para 444.
Delete os templates que voc no utiliza
importante deletar os templates Joomla que voc no utiliza em seu website. Se voc o mantm os templates padro, algum poderia por exemplo, utilizar o link para seu site com a url /index.php?jos_change_template=rhuk_solarflare_ii e mostrar seu site com o template padro. Alm de tornar seu site feio para quem clica neste link, poderia mostrar contedo que voc no gostaria de publicar na web, por exemplo, atravs de mdulos de posio que no existem no template escolhido.
83
Verifique se todos os diretrios/sub-diretrios possuem um arquivo ndex.html
O que ainda acontece com muitos servidores web que quando voc digita por exemplo www.meusite.com/diretorio-existente, se este diretrio no tem um arquivo como ndex.html, default.html ou outros tipos padro, o navegador mostra a lista de arquivos contidos naquele diretrio, essa uma brecha que pode ser utilizada por um hacker para descobrir mais informaes sobre seu site. O Joomla padro j vem com um ndex.html em todos seus diretrios. Mas importante verificar as extenses que voc instala/cria. Caso voc tenha uma pasta sem este arquivo, copie de alguma das pastas do seu site, verifique que este HTML no tem contedo, e cole na pasta desejada.
importante deletar os templates Joomla que voc no utiliza
Dica Segue abaixo um link de um site muito bom sobre Joomla e neste link h uma srie de artigos sobre aumentar a segurana em Joomla. Ainda no testei algumas das dicas dele. http://www.joomlabrasilia.org/blog-do-cout/tudo-sobre-joomla
04.02 - que SEO (Search Engine Optmization)

Abaixo vai trechos da definio do wikipedia:
Otimizao de Sites o conjunto de estratgias com o objetivo de potencializar e melhorar o posicionamento de um site nas pginas de resultados naturais (orgnicos) nos sites de busca
84
As tcnicas utilizadas no SEO so concebidas para alavancar seus objetivos no seu website melhorando o nmero e a posio de seus resultados nas busca orgnica para uma grande variedade de palavras-chave relevantes ao contedo do web site. Estratgias de SEO podem melhorar tanto o nmero de visitaes quanto a qualidade dos visitantes, onde qualidade significa que os visitantes concluem a ao esperada pelo proprietrio do site (ex. comprar, assinar, aprender algo). A Otimizao para Sistemas de Busca normalmente oferecida como um servio profissional autnomo, ou como parte de um projeto de Webmarketing e pode ser muito eficaz quando incorporado no incio do desenvolvimento do projeto de um website. H algumas atitudes gerais que podemos fazer para que seu site aparea em melhor posicionamento nas buscas e h coisas que temos que fazer para ajudar o seu site em Joomla a ficar no topo das buscas. Nesta apostila, voc aprender o bsico de SEO e como utilizar os recursos do Joomla para melhorar sua posio no ranking.
04.03 Dicas de SEO

Ningum sabe ao certo o que realmente funciona para estes mecanismos de buscas, principalmente porque cada mecanismo desse tem seus prprios algoritmos de indexao e por razes bvias nenhuma delas abrem seus algoritmos.
Abaixo algumas dicas rpidas do que realmente funciona:
Se possvel, compre domnios que sejam palavra-chaves os quais voc espera ser encontrado nas pesquisas. (E.g: se seu site de uma empresa locadora de veculos, alm do domnio da sua empresa, voc poderia ter um domnio como www.locadorasveiculos.com.br e redirecionar esse site ao seu no index.html). Estes mecanismos consideram um domnio que contenha a palavra-chave algo muito importante. Ttulos de pgina e url contendo estas palavras tambm so algo muito importante. Otimize os ttulos do seu site da seguinte forma: o Comece com a palavra-chave principal, marca da empresa ou algo que considere relevante no seu site.
85
Procure fazer um ttulo chamativo para seu site, se possvel utilizando uma pequena descrio do contedo do mesmo. o Os ttulos das pginas devem ser nicos, para no confundir os visitantes e os robs de busca. o Tente limitar seu ttulo em at 65 caracteres, pois esse o limite de exibio no Google Palavra-chave e descries nos META dados relevantes e bem escritos. No utilize mais do que 20 palavra-chaves nas suas meta keywords pois alguns robs consideram isso uma tcnica chamada key spamming. Varie as palavras dentro de seu contedo, utilizando sinnimos e com palavras relevantes. Apresentados em um HTML vlido. Infelizmente o Joomla 1.5 peca um pouco nesta apresentao, pois apesar de voc poder construir um template com css e html vlido, a sada dos componentes ainda so em tabelas no-semnticas. Organize seu site para que seja facilmente navegvel, estruturas lgicas para que usurios e robs possam navegar. Crie uma lgica onde uma pgina no parea uma rua sem sada, onde voc s entra ou sai de um jeito, coloque um link Ir para pgina inicial ou home no seu menu, ou mesmo coloque um link na logo da empresa. Linkbaiting Esta ttica consiste em voc criar algum contedo (imagem, vdeo, texto, som) que faa com que as pessoas voluntariamente coloquem o link para o seu site na pgina deles. como um hit na internet que como chamamos de marketing viral, se espalha atravs do esforo dos prprios internautas. o Adicione contedo nico e/ou informativo. o Coloque algo de humor nele. o D ao visitante motivao para repassar a mensagem.
o
H tambm outros fatores que no so dependentes diretamente de voc.

Quantos sites tm vnculos para o seu Onde eles vinculam para o seu no seu contedo Que palavras so utilizadas no seu link (ex: descrio da pgina) A relevncia dos sites que tm links para o seu
importante lembrar que, apesar de haver vrias tcnicas para enganar os robs de busca, eu no recomendo, pois estas tcnicas podem terminar por piorar sua posio no ranking. Na verdade, utilizando SEO corretamente, voc est criando tambm uma espcie de filtro para ser encontrado por pessoas que realmente quer encontrar voc. No adianta ser encontrado por pessoas que no querem o que voc tem a oferecer.
86
04.04 Otimizando META dados

META dados, so dados passados por voc aos robs de busca e aos navegadores que indicam que tipo de contedo poder ser encontrado na sua pgina. No Joomla, voc pode controlar tanto os META dados gerais do seu site, quanto controlar de cada artigo individualmente. Como nossas pginas so geradas dinamicamente, importante que ns tenhamos um controle maior sobre o que importante para aquela pgina em especfico. Modificando o META dado geral do seu site. Na rea administrativa do site, clique em Site -> Global configuration. Na aba site, h um grupo de campos em Metadata Settings.
Global Site Meta Description Uma pequena descrio sobre o contedo do seu site, de maneira ger essa descrio deve ser de fcil interpretao por humanos. Global Site Meta Keywords Coloque palavras chaves e frases relevantes para seu site, separados p vrgula e grupos de frases entre aspas simples. Show Title Meta Tag Mostra a meta tag ttulo ao ver artigos. Show Author Meta Tag Mostra a meta tag autor ao mostrar artigos.
Sobre as keywords, utilize no mximo 20 palavras-chave e d preferncia aos sinnimos das palavras que definem o seu site. Voc pode descobrir palavras deste tipo utilizando o google. https://adwords.google.com/select/KeywordToolExternal L voc pode escrever uma palavra e marcar a opo de usar sinnimo, o google vai mostrar um resultado de palavras juntamente com a competio da concorrncia utilizando aquela mesma palavra, eu utilizei a palavra test mas se voc descer a rolagem, voc ver um grupo de palavras relacionadas, no meu caso exam, practice e outras. verdade que a maioria intil, mas voc pode aproveitar algumas delas no somente para adicionar na sua keyword, mas para variar as palavras dentro do seu texto. Quanto mais rico em contedo, utilizando menos redundncias e utilizando mais sinnimos, isto poder ajudar o seu site a ser melhor encontrado nas buscas. Escreva contedos claros e concisos, sem muitas repeties nas palavras para passar nossa mensagem o segredo para otimizao de contedo. No seu contedo, inclua palavras que tambm estaro escritas nas suas meta tags de descrio, ttulo e em outras partes do site. Isto ir ajudar a prender suas meta tags dando mais relevncia e conseqentemente uma chance maior de elevar seu statos nos robs de busca. Pesquise suas palavras-chave para obter uma noo de como seus competidores esto otimizando seus sites e tambm, pescar com eles palavras alternativas para otimizarmos ainda mais nossos sites.
87
Nessa parte da apostila voc deve ter notado meu freqente uso em algumas palavras ou termos, mas que em SEO, tudo sobre como o contedo estruturado e isso leva repetio de alguns passos.
04.05 Implementando SEO em Joomla

Aps tanta teoria, prepare-se para repetir os mesmos passos diversas vezes, para ser mais exata, pelo menos o nmero de artigos existentes no seu site! Est na hora de conhecer uma extenso de terceiros, a sh404SEF. Este tutorial uma adaptao e traduo de um tutorial em http://www.kenlapz.org/joomla-tips-tricks/how-to-install-sh404sef-for-your-joomla-15.html Passo 1: Download o componente sh404SEF component. http://joomlacode.org/gf/download/frsrelease/9235/34670/com_sh404SEF_1.3.9_build_357.joomla1.0 .x.zip Passo 2: Instale o componente. Passo 3: Na rea administrativa, v para V para Extensions Site Global Configuration SEO Settings.
Plugin Manager e habilite o plugin system
legacy
Habilite todas as configuraes clicando na opo Yes Passo 4: V para Components sh404SEF
Mude para o modo Extended Display
88
Clique em sh404SE Configuration
Na guia Main escolha : Habilitar Opes (para habilitar o sh404SEF)
89
V para a guia Advanced Advanced Component Configuration Escolha Rewriting mode: with .htaccess (mod rewrite), but to do this please make sure that your webhosting support mod rewrite and for the .htaccess file, we will modify it later.
90
Se voc instalar qualquer componente no suportado para sh404SEF, ns teremos que desabilitar os SEF para evitar qualquer tipo de erro no nosso website, observe aqui a lista de plugins para sh404SEF que te permitem trabalhar com os componentes indicados pelo nome do plugin em http://extensions.joomla.org/extensions/extension-specific/sh404sef-extensions Verifique de vez em quando a lista para ver se h alguma nova extenso habilitada Para desabilitar SEF em qualquer componente, escolha a opo Skip nos componenter. Esta toda a parte de configurao no componente, agora trabalharemos no arquivo .htaccess
91
Passo 5: Trabalhando com o arquivo .htaccess Este ser o ltimo passo que trabalhar com o arquivo .htaccess . Este arquivo colocado no diretrio raiz da sua conta no seu servidor web. geralmente colocado no diretrio public_html. Se no houver esse diretrio, crie-o no diretrio raiz e mude a permisso para 777. Se voc no tem as habilidades necessrias trabalhar com FTP (File Transference Protocol) e fazer esta operao ou no tem permisso para modificar permisses, pea ajuda ao suporte do seu servidor. H um arquivo htaccess para Joomla 1.5 j configurado, para baix-lo, registre-se gratuitamente no site http://www.kenlapz.org, aps confirmar por e-mail a sua inscrio, logue no site e digite este endereo no seu navegador http://www.kenlapz.org/index.php?option=com_jdownloads&Itemid=69&task=view.download&cid=46 Clique em download, uma janela ser aberta com um texto escrito nela, copie este arquivo. V para o diretrio raiz do seu site e crie um arquivo .htaccess ATENO: Para usurios Windows apenas, o padro do Windows no aceitar renomeaes para .htaccess, siga os passos adiante Na raiz do seu site crie um arquivo denominado htaccess.txt e cole o contedo dentro deste arquivo e salve No Windows, clique em Iniciar Executar...
Digite cmd sem as aspas, uma janela do DOS aparecer Digite o seguinte cd C:\ sem as aspas ou o nome da partio onde est seu site Agora digite c:\caminho_para_o_seu_site O prompt do DOS dever estar assim:
o o
C:\caminho_para_o_seu_site> Digite ren htaccess.txt .htaccess
Caso o arquivo htaccess do kenlapz no funcione, abra seu arquivo .htaccess, abra com um editor de texto e digite:
92
## # @version $Id: htaccess.txt 10492 2008-07-02 06:38:28Z ircmaxell $ # @package Joomla # @copyright Copyright (C) 2005 - 2008 Open Source Matters. All rights reserved. # @license http://www.gnu.org/copyleft/gpl.html GNU/GPL # Joomla! is Free Software ## ##################################################### # READ THIS COMPLETELY IF YOU CHOOSE TO USE THIS FILE # # The line just below this section: 'Options +FollowSymLinks' may cause problems # with some server configurations. It is required for use of mod_rewrite, but may already # be set by your server administrator in a way that dissallows changing it in # your .htaccess file. If using it causes your server to error out, comment it out (add # to # beginning of line), reload your site in your browser and test your sef url's. If they work, # it has been set by your server administrator and you do not need it set here. # ##################################################### ## Can be commented out if causes errors, see notes above. Options +FollowSymLinks # # mod_rewrite in use RewriteEngine On ########## Begin - Rewrite rules to block out some common exploits ## If you experience problems on your site block out the operations listed below ## This attempts to block the most common type of exploit `attempts` to Joomla! # # Block out any script trying to set a mosConfig value through the URL RewriteCond %{QUERY_STRING} mosConfig_[a-zA-Z_]{1,21}(=|\%3D) [OR] # Block out any script trying to base64_encode crap to send via URL RewriteCond %{QUERY_STRING} base64_encode.*$.*$ [OR] # Block out any script that includes a <script> tag in URL RewriteCond %{QUERY_STRING} (\<|%3C).*script.*(\>|%3E) [NC,OR] # Block out any script trying to set a PHP GLOBALS variable via URL RewriteCond %{QUERY_STRING} GLOBALS(=|\[|\%[0-9A-Z]{0,2}) [OR] # Block out any script trying to modify a _REQUEST variable via URL RewriteCond %{QUERY_STRING} _REQUEST(=|\[|\%[0-9A-Z]{0,2}) # Send all blocked request to homepage with 403 Forbidden error! RewriteRule ^(.*)$ index.php [F,L] # ########## End - Rewrite rules to block out some common exploits # Uncomment following line if your webserver's URL
93
# is not directly related to physical file paths. # Update Your Joomla! Directory (just / for root) #RewriteBase / ########## Begin - Joomla! core SEF Section # RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_URI} !^/index.php RewriteCond %{REQUEST_URI} (/|\.php|\.html|\.htm|\.feed|\.pdf|\.raw|/[^.]*)$ [NC] RewriteRule (.*) index.php RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization},L] # ########## End - Joomla! core SEF Section E salve o arquivo Passo 6: Testando o seu site Depois de criar e fazer o upload do arquivo .htaccess a nica coisa a fazer testar o seu site. Se no houver problema, as urls estaro mais ou menos assim: De http://www.kenlapz.org/index.php?option=com_content&Itemid=69 para http://www.kenlapz.org/project/ De http://www.kenlapz.org/index.php?option=com_blablabla para http://www.kenlapz.org/forum/ Muito bom, no acham? Erros & Problemas 1. Se voc descobrir que todos os seus links vo para o erro 500, cheque seu arquivo
htaccess e se o apache do seu servidor possui o mod_rewrite, se acontecer desta forma, devemos rodas o sh404SEF sem o arquivo .htaccess (na aba Configuration Advanced) 2. Se o erro for o 404, tente dar um Purge nas sh404SEF url no painel de configurao. Lembre-se, se voc modificar qualquer contedo ou alias (apelido) de seu site, voc dever fazer esse Purge, para a url SEF ser atualizada 3. Se ainda assim houver problema, contate a mim, o autor do artigo ou o Google.
Dica final
94
Para melhorar mais ainda seu site nos mecanismos de busca, adicione seu site nos mesmos. Eventualmente os mecanismos encontraro seu site, mas voc pode dar uma mozinha, adicionando sua url em alguns deles. Veja a lista de mecanismos que encontrei em http://.infodinheiro.blogspot.com Lista de mecanismos de busca ou sites de busca para cadastrar/adicionar sua url/site/blog Sites de Busca brasileiros:
URL: http://www.google.com.br/ Adicionar URL: http://www.google.com.br/intl/pt-BR/add_url.html URL: http://www.buscar.com.br/ Adicionar URL: http://www.buscar.com.br/incluir_url.html URL: http://br.altavista.com/ Adicionar: http://br.altavista.com/addurl/default URL: http://www.aonde.com/ Adicionar URL: http://www.aonde.com/inclusao.htm URL: http://br.yahoo.com/ Adicionar URL: http://add.br.yahoo.com/fast/add?2086175535+BR URL: http://www.achei.com.br/ Adicionar URL: http://www.achei.com.br/incluir/index.htm URL: http://www.guiaweb.com/ Adicionar URL: http://www.guiaweb.com/addurl.php3 URL: http://www.cranik.com/ Adicionar URL: http://www.cranik.com/add_url_form.html URL: http://www.welcome.com.br/ Adicionar URL: http://www.welcome.com.br/cgi-local/sitesubmit_add/sitesubmitter.cgi URL: http://www.brbusca.com Adicionar URL: http://brbrasil.com.br/cgi-local/brbusca/adm/signup.cgi
95
URL: http://www.portalbusca.com/ Adicionar URL: http://www.portalbusca.com/add.php URL: http://www.sisbi.net/ Adicionar URL: http://www.sisbi.net/novo.htm URL: http://www.list.com.br/ Adicionar URL: http://www.list.com.br/addUrl.htm URL: http://www.buscadesite.com/ Adicionar URL: http://www.buscadesite.com/cadastrouser.php URL: http://www.pesquisando.com.br/ Adicionar: http://www.pesquisando.com.br/cadastrar_novo_site.htm URL: http://www.zarp.net/ Adicionar: http://www.zarp.net/central.htm URL: http://www.achem.com.br/ Adicionar: http://www.achem.com.br/cadastrar.asp URL: http://www.acheitudo.com/ Adicionar: http://www.acheitudo.com/incluir.htm URL: http://www.peskisa.com.br/ Adicionar: http://www.peskisa.com.br/cadastro.asp URL: http://www.lokaliza.com.br/ Adicionar: http://www.lokaliza.com.br/add_url_formnew.asp URL: http://www.bastaclicar.com.br Adicionar: http://www.bastaclicar.com.br/users/inicad.asp URL: http://www.portal-internet.com.br/ Adicionar: http://www.portal-internet.com.br/addurl.html URL: http://www.buscasexy.web.pt/ Adicionar: http://www.supertrafego.com/ffa_cadastro.asp?id=49504&cat=&busca= URL: http://www.exploora.com.br/ Adicionar: http://www.exploora.com.br/info/eaddurl.php
96
URL: http://www.buscadireta.com.br/ Adicionar: http://www.buscadireta.com.br/cgi/adiciona.cgi URL: http://www.buscaaqui.com.br/ Adicionar: http://www.buscaaqui.com.br/cadastro/ URL: http://www.gigabusca.com.br/ Adicionar: http://www.gigabusca.com.br/adicionar.cgi URL: http://www.radix.com.br Adicionar: http://www.radix.com.br/estatica/cadastre_seu_site.html URL: http://www.acbusca.com.br/ Adicionar:http://www.acbusca.com.br/busca/cadastro/cadastro_etapa_1.phtml Sites de Busca Portugueses: URL: http://www.google.pt/ Adicionar: http://www.google.pt/intl/pt-PT/add_url.html URL: http://pt.altavista.com/ Adicionar: http://pt.altavista.com/addurl/default URL: http://www.sapo.pt/ Adicionar: http://directorio.sapo.pt/ URL: http://www.aeiou.pt/ Adicionar: http://www.aeiou.pt/aeiou/adicionar.php URL: http://www.portalx.com.pt/ Adicionar: http://www.portalx.com.pt/cgi-bin/links/add.cgi URL: http://www.netindex.pt/ Adicionar: http://www.netindex.pt/adicionar.html URL: http://www.onemagic.net Adicionar: http://www.onemagic.net/index.cgi?como_registar URL: http://www.coolnet.pt/ Adicionar: http://www.coolnet.pt/ URL: http://www.terravista.pt/
97
Adicionar: http://www.terravista.pt/pesquisa/adiciona.php URL: http://www.portugalindex.com/ Adicionar: http://www.portugalindex.com/addurl.php URL: http://www.portugal-global.com.pt/ Adicionar: http://www.portugal-global.com.pt/ URL: http://www.nossogrupo.com.pt/ Adicionar: http://nossogrupo.com.pt/directorio/add.cgi URL: http://www.leme.pt/ Adicionar: http://www.leme.pt/adicionar/ URL: http://www.portugal.com.pt/ Adicionar: http://www.portugal.com.pt/add_url_form.asp?new=site URL: http://www.tumba.pt/ Adicionar: http://www.tumba.pt/tumba/submeter.jsp URL: http://www.portal.co.pt/ Adicionar: http://www.portal.co.pt/index.asp?inc=register URL: http://www.abusca.pt.to/ Adicionar: http://abusca.webcindario.com/?action=add URL: http://www.clix.pt/ Adicionar: http://directorio.clix.pt/index.html URL: http://www.busca.portugal-diario.com/ Adicionar: Depois de escolhida a categoria URL: http://www.mundopt.com Adicionar : Tem que navegar ate a vossa categoria. URL: http://directoriopt.com/ Adicionar : http://directoriopt.com/adicionar/
98
Captulo 05 - Layouts e templates

Estrutura de um template para Joomla Adaptando um template para Joomla Templates mais a fundo, CSS padro e tcnicas especiais para trabalhar com Joomla
99
HTML/XHTML, CSS, XML, PHP O Joomla trabalha com estas tecnologias para a criao de um template, claro que voc pode ter certos trechos em flash ou JavaScript, mootools, JQuery, enfim, tudo que um HTML comum pode manipular, o nosso template tambm. Para esta parte do curso, eu assumo que voc j tenha os conhecimentos esperados na rea de criao para a web, desde que o curso de Joomla, no web design. Estrutura de um template padro do Joomla Cada template fica na sua prpria pasta, o nome da pasta case-sensitive e no pode conter espao dentro da pasta templates e cada template em Joomla contm ao menos os seguintes elementos: Index.php Nele criamos a estrutura (X)HTML do nosso site e passamos os parmetros Joomla responsveis pelo funcionamento do site. templateDetails.xml Nele dizemos quais arquivos fazem parte do nosso template. Sem ele, nosso site no ser apresentado. Ele quem diz quais arquivos so necessrios ao template e se no o definirmos, nenhuma imagem, por exemplo, seria mostrada. template_thumbnail.png uma imagem de 266x172px, em formato png, que basicamente um screenshot de como seu template deve se comportar.No essencial, mas ajuda quando voc divide este template com algum. favicon.ico cone do seu site que aparece no navegador, o do Joomla o padro, voc pode editar, utilizando softwares para isso. No essencial, mas legal ter o seu, valoriza o site . CSS e imagens Por conveno e organizao, criamos uma pasta chamada css e outra images, para colocar os arquivos css e as imagens, respectivamente. Geralmente, nomeamos o arquivo de template.css e os hacks no arquivo ie_only.css. Eu gosto da seguinte estrutura:
100
template.css Classes e ids da estrutura (X)HTML criada por mim. ie_only.css Hacks e coisas feitas exclusivamente para o IE. joomla_core Redefinio do CSS padro do Joomla. O importante na hora de criar um template estar familiarizado com o CSS padro do Joomla, voc ter acesso a essa lista adiante, mas s para voc entender, abra o cdigo fonte de seu site. Note quantas classes e tabelas ele abre, note que varia de acordo com a tela, o cdigo parece meio bagunado a princpio e mesmo, mas com o tempo voc se acostuma.
templateDetails.xml Alm de mostrar quais arquivos sero utilizados, especifica quais mdulos de posicionamento existem, metadados de autor, licensa, direitos autorais e outras variveis. Segue abaixo um exemplo deste arquivo <?xml version=1.0 encoding=utf-8?> <install version=1.5 type=template>  <name>nome_da_pasta</name> <creationDate>Abril 2009</creationDate>  <author>Jennifer Payne</author>  <copyright>GPL</copyright>  <authorEmail>nennypayne@gmail.com</authorEmail> <authorUrl>http://jennifer-payne.blogspot.com</authorUrl> <!URL do autor do Template--> <version>1.0</version>  <description>Criado para a o curso de Joomla</description>  <files>  <filename>index.php</filename> <filename>templateDetails.xml</filename> <filename>js/setiver.js</filename> <filename>images/imagem1.gif</filename> <filename>images/logo.gif</filename> <filename>css/template.css </filename> </files> <positions> <position>breadcrumb</position>
101
<position>left</position> <position>right</position> <position>top</position> <position>user1</position> <position>user2</position> <position>user3</position> <position>user4</position> <position>footer</position> <position>minha_posicao</position> </positions> <params> <param name=showComponent type=radio default=1 label=ShowComponent description=Show/Hide the component output> <option value=0>No</option> <option value=1>Yes</option> </param> </params> </install>
Index.php a combinao das tags php, joomla e estrutura (X)HTML do seu site <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html xmlns=HTTP://www.w3.org/1999/xhtml XML:Lang=<?php echo $this->language; ?> lang=<?php echo $this->language; ?> dir=<?php echo $this->direction; ?>> Doctype a parte do document que descreve o tipo de documento utilizado e como o CSS vai se comportar. Veja o que a w3c diz sobre doctype Escrito por nerds para nerds. E quando digo nerds, no quero dizer profissionais comuns da web como eu e voc. Quero dizer aqueles que fazem o resto de ns parecermos como avs no primeiro dia em que recebem um email. H vrios tipos de doctypes que voc pode escolher, se voc no conhece doctype, sugiro que voc procure algo sobre ele na internet. A linha que diz: lang=<?php echo $this->language; ?>
102
significa que a linguagem utilizada ser determinada baseada na que est configurada para o site, em Configuraes Globais (Global Configuration do Joomla). Vamos agora para a tag <head> <head> <jdoc:include type="head" /> <!Marcadores do head configurados pelo joomla, as metatags, cone e feed so exemplos --> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/meu_template/css/template.css" type="text/css" />  </head> Vamos finalmente comear o <body> <body> <?php echo $mainframe->getCfg(sitename); ?>  <jdoc:include type="modules" name="top" /> <jdoc:include type="modules" name="left" /> <jdoc:include type="component" /> <jdoc:include type="modules" name="right" />
</body> </html> Por enquanto nosso template est vazio, sem marcaes HTML nem nada, mas se olharmos o cdigo-fonte do seu site utilizando este template, veremos vrias tabelas e classes que foram gerada pelo prprio Joomla.
Adaptando um template para Joomla O processo de adaptar um template para Joomla basicamente o mesmo de criar um do zero, tirando a etapa de estruturao do HTML. Abaixo, um layout padro em html.
103
Peguei o meu em: http://www.freelayouts.com/templates/hotel#download O primeiro passo criar uma pasta na sua rea de templates, nomeei a minha Jennifer_joomla E dentro descompactei o zip. H vrios arquivos dentro deste zip, vamos organiz-lo, crie uma pasta chamada css e coloque o arquivo styles.css e renomeie para templates.css Delete o arquivo examples.html Crie um arquivo chamado index.php e cole o cdigo do arquivo index.html, salve o arquivo Crie um arquivo chamado templateDetails.xml Nele, coloque as seguintes linhas: <?xml version="1.0" encoding="iso-8859-1"?> <install version="1.5" type="template"> <name>jennifer_joomla</name> <version>1.0</version> <creationDate>April, 2009</creationDate> <author>Jennifer Payne</author> <authorEmail>nennypayne@gmail.com</authorEmail> <copyright>GPL</copyright> <authorUrl>http://jennifer-payne.blogspot.com</authorUrl> <description> Exemplo de template para a aula de adaptao de layouts do Joomla.</description> <files> <filename>favicon.ico</filename> <filename>index.php</filename> <filename>index.html</filename> <filename>templateDetails.xml</filename> <filename>template_thumbnail.png</filename> <filename>css/template.css</filename> <filename>images/content-bg-left.png</filename> <filename>images/content-bg-right.png</filename> <filename>images/footerbg.png</filename> <filename>images/nav-bg.png</filename> <filename>images/nav-bg-left.png</filename> <filename>images/nav-bg-right.png</filename>
104
<filename>images/titlebg.png</filename> </files> </install>
Ajustes de CSS Como este template especfico seu template no estava organizado dentro da pasta CSS, crie uma pasta, coloque seu arquivo template.css dentro, procure todas as imagens de background listadas e substitua os trechos: url(images/imagem_qualquer.jpg) por url(../images/imagem_qualquer.jpg), a adio de ../ diz ao css que virtualmente saia da pasta css, volte para a pasta raiz do site, para ento conseguir entrar na pasta images. Este passo muito importante para o funcionamento correto do layout. Eu listei todas as imagens existentes na pasta imagem, alm dos arquivos bsicos que o Joomla pede. Defini mdulos que podem ser utilizados. Agora vamos substituio: Subsititua as linhas: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Free web template - hotel - by spyka Webmaster</title> <link rel="stylesheet" href="styles.css" type="text/css" /> </head> Por: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" dir="<?php echo $this->direction; ?>" > <head> <jdoc:include type="head" /> <link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/beez/css/template.css" type="text/css" /> </head> Agora os itens de cabealho, metadados e links esto corretos, vamos comear a adaptar o body agora
105
Note que o menu deste site fica somente no topo, ento, neste caso acho melhor carregar o menu no mdulo top Vamos substituir a rea de navegao
<div class="innernav"> <ul>  <li><a href="index.html">Home</a></li> <li><a href="examples.html">Examples</a></li> <li><a href="#">Solutions</a></li> <li><a href="#">Support</a></li> <li><a href="#">Contact</a></li>  </ul> por: <div class="innernav"> <jdoc:include type="modules" name="top" /> Substituindo o ttulo: <div class="innertitle">  <h1><a href="#">hotel</a></h1> <h2>just another free template</h2>  <div class="innertitle">  <h1><?php echo $mainframe->getCfg(sitename); ?> </h1>  Agora, substitua todas as linhas que esto entre  
106
Por:  <jdoc:include type="component" /> <jdoc:include type="modules" name="user1" /> <jdoc:include type="modules" name="user3" />  Agora, vamos inserir mais mdulos na rea direita (sidebar), substitua o contedo entre as tags   Por:  <jdoc:include type="modules" name="right" /> <jdoc:include type="modules" name="user2" />  Na class footer, voc pode inserir o modulo footer, modificar o texto dentro do rodap ou mant-lo do jeito que est, como voc utilizou o template feito por algum, justo manter o link para o site do mesmo. Sua adaptao est pronta! Criar um template do zero simplesmente criar um index.php comum, e inserir as tags do Joomla dentro de sua estrutura de marcao div ou table. Estilizando os mdulos Aqui segue a parte mais legal na criao de templates para Joomla e foi extrada da traduo de Geciel Rangel Costa - http://gecielc.spaces.live.com/ Autor: Barrie North, www.compassdesigns.net (http://vig.prenhall.com/catalog/Fast_Search/fast_quick_search/1,3064,,00.html) Mas aqui est a melhor parte!
107
Se voc examinar o arquivo modules.php ver todas as opes existentes para os mdulos. realmente fcil adicionar uma sua prpria, isto faz parte das novas poderosas possibilidades includas na verso 1.5 do Joomla. Dentro do arquivo module.php, o exemplo de xhtml se parece com o apresentado abaixo:
Voc pode observar que bem fcil fazer alteraes. Para desenvolver nosso template, ns colocaremos um mdulo de estilo de xhtml em todos os nossos mdulos.
Observe que no podemos colocar esses estilos de mdulos no <jdoc:include type=component />, pois esse no um mdulo. Especificando o mdulo para uma apresentao CSS reduz um pouco o nmero de tabelas Nosso template est pronto!
108
Um pouco mais sobre templates... H vrias coisas sobre templates que pouca gente sabe, que o que te ajuda a tirar a Carinha de Joomla do site. No que a carinha dele seja feia, mas, interessante que ns possamos dar a nossa prpria cara aos nossos projetos... Uma delas que o Joomla atende a uma quantidade enorme de CSS padro, que vem instalado com o joomla assim como as extenses que vimos antes. Nesta apostila eu cito a maior parte do CSS padro do Joomla com suas finalidades
/*** Aqui est a lista descrita do CSS padro do Joomla 1.5***/ /*APENAS O FRONTEND!!!*/ /*Descrito por Jennifer Payne, Recife*/ /*http://jennifer-payne.blogspot.com*/ /*Frontend*/ /*Generalizados*/ input.inputbox /*campos de form em geral*/ input.button/*s funciona se input.inputbox tiver algo*/ div.componentheading /*Ttulo do Componente, utilizado para vrios componentes*/ table.contentpane /*tabela em volta do .contentdescription*/ td.contentdescription /*Texto de descrio do Componente, tambm utilizado para vrios componentes*/ table.contentpaneopen{/*este seletor aparece em vrios mdulos e reas de componente, como autor do artigo e outros, cuidado ao modificar*/} td.contentheading{ /*ttulo de cada artigo do Joomla*/} a.contentpagetitle{/*Link do ttulo de pgina, caso esteja habilitado*/} table.moduletable{/*Em torno de vrios componentes e mdulos*/} span.article_separator /*Separador de um artigo para o outro*/ span.small/*por algum motivo desconhecido, o mdulo login s funciona ao setar valor para ele, at vazio, s com as chaves...sem ele o modulo login no pegou background hauhauahuahauhauha Geralmente um valor ao lado de algum texto, no componente pesquisa a numerao de cada resultado encontrado. www.jenniferpayne.com.br 109 http://jennifer-payne.blogspot.com @JennyPayneDZN
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. */ a.category{/*Links de categoria*/} td.sectiontableheader{/*cabealho faz funcionar as linhas de opes numa tabela com linha 1 e linha 2*/} td.sectiontableentry1{/*primeira linha de opes, s funciona com a sectiontableheader, s precisa ter a abertura e fechamento das aspas*/} td.sectiontableentry2{/*segunda linha de opes, s funciona com a primeira*/} td.sectiontablefooter{/*Aparentemente um rodap complementar para essas tabelas, no consegui modificar*/} /*Esta lista acima so a lista dos CSS generalizados, ou seja, que pertencem a vrios componentes e mdulos, se voc modificar para um deles, modifica para todos. Como resolver isso? Simples! Voc pode atribuir valores nos mdulos e menus na parte Page suffix que fica ao lado direito da rea de parmetros de mdulos e menus, assim, essas tags generalizadas aplicadas em um mdulo. Por exemplo, adicionada apenas no mdulo ao qual ela pertence, por exemplo, se no adiciono em um mdulo o suffix _Jenn, naquele mdulo, o css table.moduletable passaria a se chamar table.moduletable_Jenn, a gente pode utilizar tambm um artifcio que o de adicionar um espao antes do nome e ter ento, nosso mdulo atenderia duas classes. Ex: aplicando Jenn, no lugar de _Jenn, nosso css seria: Isso significa que alm de o padro CSS definido para table.moduletable seria atribudo tambm os valores institudos para a classe .Jenn*/ /* FILE: components\com_contact\views\contact\tmpl\default.php */
form#selectForm /*No consegui alterar todas as reas*/ /* FILE: components\com_contact\views\contact\tmpl\default_form.php */
form#emailForm/*Formulrio de contato*/ input#contact_name /*Entrada de texto do nome*/ label#contact_emailmsg /*E-mail address*/ input#contact_email /*Entrada de texto para email*/ input#contact_subject /*Entrada de texto para assunto da mensagem*/ label#contact_textmsg /*Texto do Enter your Message*/ textarea#contact_text /*Text area da mensagem*/ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
110
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. input#contact_email_copy /*checkbox de enviar cpia do email para si*/ form.form-validate div.contact_email input.inputbox input.required input.validate-email textarea.inputbox textarea.required button.button button.validate /* FILE: components\com_content\helpers\icon.php */
span.hasTip /* FILE: components\com_content\models\article.php */
hr#system-readmore /*Separador entre texto introdutrio (que aparece no leia mais...) e o resto do artigo (no ncessrio criar atributos para ele)*/ /* FILE: components\com_content\views\archive\tmpl\default.php */
form#jForm input.inputbox button.button /* FILE: components\com_content\views\archive\tmpl\default_items.php */
ul#archive-list div#navigation li.row www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
111
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. h4.title h5.metadata span.created-date span.author div.intro /* FILE: components\com_content\views\article\tmpl\default.php */
div.contentpaneopen_edit td.buttonheading td.createdate td.modifydate a.readon /* FILE: input#title input#created_by_alias input#publish_up input#publish_down textarea#metadesc textarea#metakey table.adminform td.key input.inputbox img.calendar textarea.inputbox www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN components\com_content\views\article\tmpl\form.php */
112
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. /* FILE: input#title input#alt td.key /* FILE: table.blog td.article_column div.blog_more /* FILE: components\com_content\views\category\tmpl\blog_item.php */ components\com_content\views\category\tmpl\blog.php */ components\com_content\views\article\tmpl\pagebreak.php */
div.contentpaneopen_edit td.buttonheading td.createdate td.modifydate a.readon /* FILE: components\com_content\views\category\tmpl\blog_links.php */
a.blogsection{/*Muda os links dos itens listados*/} /* FILE: components\com_content\views\category\tmpl\default_items.php */
input.inputbox td.sectiontableheader td.sectiontableentry1 td.sectiontableentry2 td.sectiontablefooter /* FILE: components\com_content\views\frontpage\tmpl\default.php */ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
113
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. table.blog td.article_column div.blog_more /* FILE: components\com_content\views\frontpage\tmpl\default_item.php */
div.contentpaneopen_edit td.buttonheading td.createdate td.modifydate a.readon /* FILE: components\com_content\views\frontpage\tmpl\default_links.php */
a.blogsection /* FILE: table.blog td.article_column div.blog_more /* FILE: components\com_content\views\section\tmpl\blog_item.php */ components\com_content\views\section\tmpl\blog.php */
div.contentpaneopen_edit td.createdate td.modifydate a.readon /* FILE: components\com_content\views\section\tmpl\blog_links.php */
a.blogsection /* FILE: components\com_poll\views\poll\tmpl\default.php */ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
114
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. form#poll/*Em torno do comp Poll, consegui modificar*/ /* FILE: components\com_poll\views\poll\tmpl\default_graph.php */
table.pollstableborder{/*em torno do comp enquete*/} th.sectiontableheader{/*Ttulo da enquete*/} td.sectiontableentry0/*qtd de voto de uma opo*/ td.sectiontableentry1/*texto da opo*/ td.smalldark{/*Texto number of votes*/} /* FILE: components\com_search\search.php */
span.highlight/*Intro dos textos encontrados na pesquisa, no consegui modificar*/ /* FILE: components\com_search\views\search\tmpl\default_error.php */
table.searchintro/*em torno do texto Search Keyword, quando voc j efetuou a pesquisa, no consegui modificar*/ /* FILE: components\com_search\views\search\tmpl\default_form.php */
input#search_searchword /*no consegui modificar*/ input#area_{VALUE} /* Value is set programatically */ table.contentpaneopen/*Em torno desde Search keyword at Ordering*/ input.inputbox/*campo de texto do search*/ #searchForm/*Formulario em torno do comp search*/ /* FILE: components\com_search\views\search\tmpl\default_results.php */
table.searchintro /* FILE: components\com_user\views\login\tmpl\default_logout.php */
#form-login/*s funciona com o span.small com alguma coisa como span.small{}*/ table.contentpane/*wrapper do contedo, vlido para diversos componentes*/ input.button/*boto logout, s funciona em conjunto com table.contentpane*/ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
115
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. /* FILE: components\com_user\views\register\tmpl\default.php */
form#josForm/*no consegui alterar*/ /*Campos de preenchimento ao registrar-se, alguns campos funcionam se inpu.inputbox tiver atributos e outros se input.required tiver atributos*/ label#namemsg input#name label#usernamemsg input#username label#emailmsg input#email label#pwmsg input#password label#pw2msg input#password2 form.form-validate div.componentheading table.contentpane input.inputbox /*Alguns campos s aceitam CSS se ele tiver atributos*/ input.required button.button/*boto Register, s funciona se .input.required tiver algo nele*/ button.validate/*no consegui alterar*/ /* FILE: components\com_user\views\register\tmpl\default_message.php */
div.componentheading www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
116
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. div.message /* FILE: components\com_user\views\remind\tmpl\default.php */
input#email div.componentheading form.josForm form.form-validate table.contentpane label.hasTip input.required input.validate-email button.validate
/* FILE:
components\com_user\views\reset\tmpl\complete.php */
input#password1 input#password2 div.componentheading form.josForm form.form-validate table.contentpane label.hasTip input.required input.validate-password button.validate www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
117
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. /* FILE: components\com_user\views\reset\tmpl\confirm.php */
/*No consegui encontrar os abaixo, parece ser de validao quando voc reseta os valores para um usurio*/ input#token div.componentheading form.josForm form.form-validate table.contentpane label.hasTip input.required button.validate /* FILE: components\com_user\views\reset\tmpl\default.php */
/*No consegui encontrar os abaixo, parece ser de validao quando voc altera um usurio*/ input#email form.josForm form.form-validate table.contentpane label.hasTip input.required input.validate-email button.validate /* FILE: components\com_user\views\user\tmpl\default.php */
div.componentheading /*Ttulo de todos os componentes com a opo "show title"*/ /* FILE: components\com_user\views\user\tmpl\form.php */ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
118
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. input.inputbox/*todos os campos de user details*/ input#name/*S funciona se houver parmetro no inputbox*/ input#email/*S funciona se houver parmetro no inputbox*/ input#username/*S funciona se houver parmetro no inputbox*/ input#password/*S funciona se houver parmetro no inputbox*/ input#password2/*S funciona se houver parmetro no inputbox*/ button.button /*S funciona se houver parmetro no inputbox*/ /* FILE: components\com_weblinks\views\categories\tmpl\default.php */
div.componentheading /*Ttulo do Componente, utilizado para vrios componentes*/ table.contentpane /*tabela em volta do .contentdescription*/ td.contentdescription /*Texto de descrio do Componente, tambm utilizado para vrios componentes*/ a.category {/*Links do comp Category list layout*/} span.small{/*Mostra a quantidade de links numa categoria de links*/ } /* FILE: components\com_weblinks\views\category\tmpl\default.php */
div.componentheading /*Ttulo do Componente, utilizado para vrios componentes*/ table.contentpane /*tabela em volta do .contentdescription*/ td.contentdescription /*Texto de descrio do Componente, tambm utilizado para vrios componentes*/ /* FILE: components\com_weblinks\views\category\tmpl\default_items.php */
td.sectiontableheader td.sectiontableentry1 td.sectiontableentry2 td.sectiontablefooter www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
119
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. /* FILE: components\com_weblinks\views\weblink\tmpl\form.php */
form#adminForm input#jformtitle input#jformurl textarea#jformdescription div.componentheading input.inputbox textarea.inputbox /* FILE: components\com_wrapper\views\wrapper\tmpl\default.php */
div.contentpane div.componentheading /* FILE: modules\mod_banners\tmpl\default.php */
div.bannergroup{/*container do mod banner*/ } div.bannerheader{/*texto do header do mod banner*/} div.banneritem{/*imagem do banner do mod banner*/ } div.clr div.bannerfooter{/*Texto de footer do mod banner*/ } /* FILE: modules\mod_breadcrumbs\helper.php */
a.pathway/*link dentro do mod breadcrumb*/ /* FILE: modules\mod_breadcrumbs\tmpl\default.php */ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
120
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. span.breadcrumbs {/*dentro do mod breadcrumbs*/ } span.pathway{/*dentro do mod breadcrumbs*/ } /* FILE: modules\mod_feed\tmpl\default.php */
ul.newsfeed /*lista do mod newsfeed*/ /* FILE: modules\mod_latestnews\tmpl\default.php */
ul.latestnews /*lista do mod Latest News*/ li.latestnews /*item de lista do mod Latest News*/ a.latestnews /*link do item de lista do mod Latest News*/ /* FILE: modules\mod_login\tmpl\default.php */
input#mod_login_username, input#mod_login_password, input#mod_login_remember{/*No consegui encontrar*/} input.inputbox{/*campo de texto do mod login*/} input.button{/*Boto login do mod login*/ } p#form-login-remember, p#form-login-username, p#form-login-password{/*texto login, password, Remember me*/}
/* FILE:
modules\mod_mainmenu\helper.php */
li#{ITEM ID} /* Value is set programatically */ span.separator{ /*No descobri*/} /* FILE: modules\mod_mainmenu\legacy.php */
ul#mainlevel{/*lista do mod main menu no modo legacy*/} ul#sublevel{/*sub-nvel do menu no modo legacy*/} www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
121
/* FILE:
modules\mod_mostread\tmpl\default.php */
ul.mostread{/*lista do mod. most read*/} li.mostread{/*item de lista do md. most read*/} a.mostread{ /*Links do mdulo most read*/}
/* FILE:
modules\mod_newsflash\tmpl\_item.php */
table.contentpaneopen{ /*este seletor aparece em vrios mdulos e reas de componente, como autor do artigo e outros, cuidado ao modificar*/ } td.contentheading{ /*ttulo de cada artigo do Joomla*/} a.contentpagetitle{ /*Link do ttulo de pgina, caso esteja habilitado*/ } /* FILE: modules\mod_newsflash\tmpl\horiz.php */
table.moduletable{ /*tabela me do mdulo newsflash quando o parmetro na horizontal, no consegui modificar*/ } /* FILE: modules\mod_newsflash\tmpl\vert.php */
span.article_separator{ /*separador colocado aps um artigo*/ } /* FILE: modules\mod_poll\tmpl\default.php */ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
122
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. input#voteid{VOTE ID NUMBER} /* Valor configurado pelo Joomla, no mude */ table.poll{ /*tabela onde o mdulo enquete fica dentro,muda a cor ttulo da enquete e texto dentro dela*/ } table.pollstableborder{ /*tabela em volta das opes da enquete e do resultado que aparece no componente enquete aps votar*/ } input.button{ /*botes da enquete*/ } /* FILE: modules\mod_related_items\tmpl\default.php */
ul.relateditems{ /*muda os parametros de lista do mdulo Related Articles*/ } /* FILE: modules\mod_search\helper.php */
input#mod_search_searchword{ /*parece ser para mudar os atributos da palavra dentro da caixa de pesquisa, porm no consegui modificar por ele, mudei no input.inputbox*/ } input.inputbox/*Muda o input do mdulo search, incluindo o texto dentro*/ input.button /*muda o boto do mdulo search (quando ativo)*/ /* FILE: div.search /*envolve o mdulo search, no consegui modificar*/ /* FILE: modules\mod_sections\tmpl\default.php */ modules\mod_search\tmpl\default.php */
ul.sections /*muda os parametros de lista do mdulo Sections*/ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN
123
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. .moduletable h3{ /*Muda o ttulo dos mdulos envolvidos pela class moduletable*/ } /* Dica: quando voc determina um sufixo para um mdulo, o mesmo o adota como sufixo em qualquer classe que ele possua. Ex: Se adicionasse sufixo Secoes no mdulo sections o CSS ul.sections passaria a se chamar ul.sectionsSecoes enquanto seu moduletable passaria a se chamar moduletableSecoes */ /*FIM!*/
Essa lista foi extrada, modificada e testada da lista contida no site http://joomlatp.com/joomlacss/joomla-1.5-default-CSS-classes-list.html Houveram alguns itens que no consegui modificar. A melhor maneira de se saber quais classes so aplicadas no seu mdulo/componente ainda verificar o cdigo-fonte gerado pelo seu Joomla quando os mesmos so chamados, mas eu encontrei alguns bugs, que esto descritos, outras classes no consegui modificar, mesmo a encontrando no cdigo gerado, outras s funcionam com a ativao de outra classe. Explorando os mesmos e voc pode se aproveitar desta lista para agilizar seu trabalho e tirar a carinha de Joomla do seu site. Colapso de Colunas H duas maneiras do Joomla contar se h mdulos em uma certa rea do site, para expandir o componente para toda rea caso no haja mdulos aplicados naquela rea. Tutorial providenciado pela prpria equipe do Joomla, ainda em ingls. http://docs.joomla.org/Tutorial:More_on_Joomla!_modules O ruim que utiliza cdigos php e muita gente no sabe ou quer trabalhar com o php, ento, aqui vai uma soluo extra. Voc pode simplesmente criar um outro template baseado no anterior, remover as rea de carregamento de mdulos e colunas, ajustar o css sem as colunas e instalar este novo template, aplicando-o apenas nas reas onde no havero mdulos! Eis como fazer isso:
Instale o template com colunas e o template sem colunas V at Extensions -> Template Manager (Extenses -> Administrar layout) Torne o template que ser utilizado pela maioria dos menus como padro Em seguida, selecione no radio button o template sem as colunas e clique no boto editar do lado superior direito Do lado esquerdo, selecione o radio button Select from List e utilizando o SHIFT ou CTRL selecio quais links do menu este template ser vinculado
124
Salve Seu template sem colunas agora tem um sinal verde na linha Assigned que mostra que ele no padro, porm utilizado por alguns menus do site.
Estilos dos mdulos no Joomla. Extrado e traduzido da documentao do Joomla em : http://docs.joomla.org/Tutorial:More_on_Joomla!_modules A sada de mdulos podem ser extendidos no declarao do mdulo <jdoc:include /> adicionando por adicionar o atributo estilo, style=nomedoestilo, onde o nome do estilo corresponde ao estilo chrome utilizado para ficar em torno do mdulo. Para mais informaes veja <jdoc:include /> Statements e What is module chrome? Chrome Type
None
Este o padro caso nenhum estilo seja adicionado ao <jdoc:include />. Nenhum CSS adicional adicionado. Ttulo do mdulo NO includo no frontend independente do status de habilitado.
Table
.moduletable class aplicado a um elemento <table> sem largura que envolve a sada do mdulo. Habilita <th> tags em torno do mdulo ttulo, se habilitado.
Horz
Nenhum estilo adicional ao CSS adicionado. A sada a mesma que o estilo Table acima, mas tambm envolve a sada na segunda tabela de 100% de largura.
XHTML
.moduletable class aplicada uma <div> que <h3> tag em volta do ttulo title, se habilitado.
envolve a sada do mdulo.
Rounded
125
Consultoria, treinamento, servios em Joomla/Dolphin 7 e criao de layouts HTML/CSS partir de seu layout em imagem ou layout inteiramente meu. .module
class aplicada a <div> mais externa.A sada do mdulo envolvida com 4 layers de <div>s que permitem bordas arredondadas.<h3> tag em volta do ttulo title, se habilitado.
Outline
Classe .mod-preview
aplicada a <div> mais externa.
Classe .mod-preview-info Classe .mod-preview-wrapper
aplicada a <div> mais interna que envolve o contedo do mdulo
126
Captulo 06
Enviando seu site para um servidor Fazendo Backup no Joomla!
127
Agora que seu site j tem seu novo visual, contedos escritos e extenses instaladas, j SEF e est tudo funcionando perfeitamente, est na hora de colocar seu projeto no ar!
Enviando seu site para um servidor

Sempre que possvel, trabalhe com seu Joomla no seu servidor local (seu localhost) e aps instalar tudo, configurar e preparar corretamente seu website, envie-o para a web. O processo simples e este tutorial passo-a-passo pode ser executado em sua prpria mquina, simulando o envio para o servidor em sua prpria mquina. Caso voc esteja em um servidor de hospedagem na web, voc precisar obter os seguintes dados: Nome de usurio e senha do ftp da sua conta no servidor Nome de usurio e senha do MySQl do seu site Um banco de dados MySql Ative seu servidor local atravs do Xampp ou de outro simulador onde seu site em Joomla est instalado. No seu navegador, entre em localhost/phpmyadmin (caso seu servidor no seja localhost e seu gerenciador no seja o MySQL, inicie o seu equivalente) Crie a Base de Dados onde voc enviar seu site pronto (no seu prprio localhost para testes ou no servidor web)
128
Marque as opes conforme a figura abaixo e clique em executar
Salve o arquivo em alguma pasta do seu computador Crie um novo banco de dados com qualquer nome em seu servidor web (pode ser seu localhost, como vimos no primeiro captulo, caso voc no esteja utilizando um servidor web externo)
Note que uma mensagem de sucesso foi dada e agora o banco vazio tem a mesma quantidade de tabelas do banco original. Agora, est na hora de voc re-configurar o seu arquivo configuration.php. Abra o arquivo com algum editor de texto. Ex: Bloco de Notas
129
Neste arquivo, h vrias variveis escritas em php que definem a configurao do seu Joomla, voc deve alterar as seguintes linhas, adicionando as novas configuraes do seu site: Seu novo caminho de arquivo de log, de:
var $log_path = 'C:\\xampp\\htdocs\\seusite\\logs';
Deve ficar assim:

var $log_path = '/home/seila/seusite.com/site/htdocs/logs';
Sua pasta de arquivos temporrios:

var $tmp_path = 'C:\\xampp\\htdocs\\seusite\\tmp';
Vai ficar assim:

var $tmp_path = '/home/seila/seusite.com/seusite/htdocs/tmp';
Agora, as configuraes do seu banco:

var var var var $host = 'localhost'; $user = 'root'; $db = 'seu_banco'; $password = '';
$host -> O endereo do seu servidor, quando voc fecha um contrato com uma empresa de hospedagem, eles passam esse seu endereo $user -> Usurio do MySQL tambm passado por eles, ou configurado por voc mesmo atravs de CPanel $db -> Nome do seu banco de dados $password -> senha do seu banco Finalmente, a ltima etapa enviar o seu Joomla para o servidor.
Conhecendo FTP
FTP ou File Transference Protocol existe desde a origem da internet e utilizado para enviar e receber arquivos hospedados na web. Atravs dele que voc vai enviar os arquivos utilizados em seu site para o servidor web, para quem tem o Xampp instalado, h a opo de instalar o Filezilla atravs dela, como servio, mas ainda sim, aconselho a instalar separadamente, por ser mais fcil de configurar. Proceda da seguinte forma: 1. Faa o download de alguma ferramenta FTP, caso voc no possua, h muitas ferramentas muito boas FireFTP, um programa FTP instalado em seu navegador firefox ou faa o download do filezilla em http://filezilla-project.org/download.php 2. Instale 3. Abra o Filezilla 4. Clique em Arquivo -> Gerenciador de Sites 5. Novo site 6. Configure o seu site no programa de acordo com as informaes passadas pela empresa de hospedagem
130
Voc agora ver a estrutura de diretrios do seu site no servidor. Quando voc faz assinatura com um servidor web, eles te do as diretrizes de onde seus arquivos devem ficar. Geralmente em www, htdocs ou public_html. No lado esquerdo, h a estrutura de diretrios no seu computador, encontre a pasta onde est o seu site. Provavelmente algo como C:/Xampp/htdocs/site_em_joomla Selecione todos os arquivos do seu site em joomla e atravs do boto direito clique em upload Tenha pacincia, v dar um passeio, pois demorar algumas horas, porque o Joomla tem milhares de arquivos. Aps finalizada esta etapa, s digitar o endereo do seu site e l est! Para entrar na rea administrativa, adicione o /administrator no final do endereo exatamente como fazamos localmente.
131
Espero que vocs tenham gostado de aprender Joomla! de uma maneira prtica e fcil. Visitem meu blog em http://jennifer-payne.blogspot.com para mais tutoriais e informaes importantes sobre Joomla!
132

Apostila de Joomla - Nova

Enviado por

Dados do documento

Título original

Direitos autorais

Formatos disponíveis

Compartilhar este documento

Compartilhar ou incorporar documento

Opções de compartilhamento

Você considera este documento útil?

Este conteúdo é inapropriado?

Direitos autorais:

Formatos disponíveis

Apostila de Joomla - Nova

Enviado por

Direitos autorais:

Formatos disponíveis

APOSTILA PARA INICIANTES EM JOOMLA 1.

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Captulo 01 Gerenciamento de Contedo

Quais as necessidades dos clientes?

http://dsic.planalto.gov.br/ www.cnt.com.br http://portal.mec.gov.br/ http://www.fortaleza.ce.gov.br/ http://www.tiangua.ce.gov.br http://www.mitsubishi-motors.com.ve/cms/index.php http://www.leyendasdetoledo.com/ www.danone.com http://www.asassaomiguel.com

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Determine como a instalao dever proceder (faa como abaixo)

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Digite localhost/phpmyadmin no seu navegador Crie o banco de dados

2. Adicione um novo usurio

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Instalando o Joomla! 1.5 Faa o download em http://www.joomla.org/download.html

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Descompacte o arquivo na pasta XAMPP/htdocs/sua_pasta

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Terceira e quarta telas

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Grupos de Usurios com acesso Front-End do Joomla!

Grupo Registrado Autor

Grupos de Usurios com acesso ao Back-End do Joomla!

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

User Manager (Gerenciamento de Usurios)

Nesta rea, as configuraes importantes a conhecer, so:

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Captulo 02 Componentes, Mdulos e Plug-ins

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Tabela comparativa entre componentes, mdulos e plugins

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Tornando o Joomla! em portugus

O que eles fazem

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Mdulos Relacionados componentes

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Incluindo Mdulos e Plugins em artigos

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Passo #1: Escreva o nome do site

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Passo #3: Crie Links de Menu

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Ser mostrado uma lista de tipos de itens de menu.

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Visualizando nossos links no Front-End

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Seu site deve estar assim agora:

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

Este o seu primeiro site em Joomla!

Como um contedo salvo

www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

form#selectForm /No consegui alterar todas as reas/ /* FILE: components\com_contact\views\contact\tmpl\default_form.php */

a.blogsection{/Muda os links dos itens listados/} /* FILE: components\com_content\views\category\tmpl\default_items.php */

a.blogsection /* FILE: table.blog td.article_column div.blog_more /* FILE: components\com_content\views\section\tmpl\blog_item.php / components\com_content\views\section\tmpl\blog.php /

span.highlight/Intro dos textos encontrados na pesquisa, no consegui modificar/ /* FILE: components\com_search\views\search\tmpl\default_error.php */

a.pathway/link dentro do mod breadcrumb/ /* FILE: modules\mod_breadcrumbs\tmpl\default.php */ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN

ul.newsfeed /lista do mod newsfeed/ /* FILE: modules\mod_latestnews\tmpl\default.php */

ul.relateditems{ /muda os parametros de lista do mdulo Related Articles/ } /* FILE: modules\mod_search\helper.php */

ul.sections /muda os parametros de lista do mdulo Sections/ www.jenniferpayne.com.br http://jennifer-payne.blogspot.com @JennyPayneDZN