Joomlaapostilaandrerossiteroficialcompleta 111212233004 Phpapp01 PDF

Andr Rossiter
webrossiter@gmail.com
Andr Rossiter
Andr Rossiter
ndice
Introduo ............................................................................................................................. 3
O que CMS .......................................................................................................................... 4
Introduo Joomla ................................................................................................................. 5
A estrutura do Joomla ............................................................................................................ 6
Como contratar uma hospedagem ........................................................................................ 8
Como instalar no Servidor UOLHOST ..................................................................................... 9
O painel de controle ............................................................................................................. 10
Menu configurao geral ...................................................................................................... 16
Menu configurao usurio .................................................................................................. 19
Arquitetura da Informao ................................................................................................... 21
Seo, categoria, artigo e menu ........................................................................................... 28
Plug in, complementos, temas, extenses, FTP ................................................................... 38
Artisteer Como fazer o meu template ............................................................................... 50
Instalando o Joomla no FACEBOOK ...................................................................................... 66
Andr Rossiter
Introduo
A rede mundial de computadores pela internet tem revolucionado a maneira de empreender,

se relacionar, comunicar, trabalhar, etc...
Estar a par da melhor maneira de tirar proveito das novas tecnologias pode ser o diferencial
para se estabelecer no mercado de trabalho, ganhar dinheiro sem sair de casa ou at mesmo
os dois.
O presente curso visa ilustrar o Joomla como forma de empreender e desenvolver sistemas
para rede mundial de computadores, de forma simples atravs de sua tecnologia moderna e
funcional em pouco tempo.
Andr Rossiter
O que CMS
CMS a abreviao da expresso da lngua inglesa (contente management system sistema

de gerenciamento de contedo).
A plataforma CMS open source (cdigo fonte aberto) o que permite o desenvolvedor
manipular as aplicaes deste sistema para suas necessidades sem custos adicionais.
Na verdade os sistemas CMS tem revolucionado a maneira de empreender na web, pois so
feitos por programadores e desenvolvedores ao redor do mundo eleitos por meritocracia e
viabilizam cada vez mais com menos conhecimento desenvolver sistemas e aplicaes
complexas de serem feitas do zero.
Outra grande vantagem deste tipo de sistema que pessoas muito capazes como descrito
anteriormente ao redor do mundo trabalham em conjunto na evoluo de segurana e
interface deste sistema.
Obter todos os recursos disponveis em qualquer plataforma CMS do zero custaria muito caro,
sendo assim outra grande vantagem de se utilizar CMS o baixo custo de sua implementao
o que pode ser repassado para o cliente e torna os empreendimentos mais viveis.
Andr Rossiter
Introduo Joomla
Desenvolvido a partir do Mambo. escrito em PHP e roda no servidor web Apache ou IIS e
banco de dados MySQL. (Wikipedia).
Caractersticas principais
Cdigo aberto (Licena GPL);

Sistema simples de fluxo de aprovao;
Arquivamento para contedo no utilizados (Lixeira);
Gerenciamento de banners;
Sistema de publicao para o contedo;
Sumrio de contedo no formato RSS;
Busca otimizada (qualquer palavra registrada);
Frontend j traduzido em vrias lnguas;
Fcil instalao para novos templates, mdulos e componentes;
Hierarquia para grupos de usurios;
Estatsticas bsicas de visitantes (existem mdulos mais complexos que podem ser
adicionados);
Editor de contedo WYSIWYG;
Sistema de enquete simples (com acompanhamento de resultado em tempo real);
Sistemas de ndices de avaliao;
Extenses livres em diversos sites (Mdulos, Componentes, Templates, Tradues).
Compatibilidade com verso anterior.
(Wikipedia)
Andr Rossiter
Google Trends uma ferramenta do Google Labs que mostra os mais populares termos
buscados em um passado recente.
A ferramenta apresenta grficos com a frequncia em que um termo particular procurado
em vrias regies do mundo, e em vrios idiomas. O eixo horizontal do grfico representa
tempo (a partir de algum tempo em 2004), e o vertical com que frequncia procurado um
termo, globalmente. Tambm permite o usurio comparar o volume de procuras entre duas
ou mais condies. Notcias relacionadas aos termos buscados so mostradas ao lado e
relacionadas com o grfico, apresentando possveis motivos para um aumento ou diminuio
do volume de buscas.
(Wikipedia)
Grafico comparativo Joomla e outros CMS pelo GOOGLE TRENDS
Andr Rossiter
A estrutura do Joomla
O Joomla possui uma interface front end (design) do lado cliente desenvolvida pelo HTML e
CSS, possui em seu back end (programao) um sistema seguro utilizando PHP (linguagem de
programao orientada ao objeto) e um banco de dados MYSQL onde so armazenados os
dados inseridos e atualizados do Joomla.
Esta na verdade a estrutura de um sistema para internet mais complexo e se repete para
diversos outros sistemas, mas cabe bem ao Joomla e corresponde a forma como ele foi
desenvolvido.
Andr Rossiter
Como contratar uma hospedagem
Recomendo um servidor grande, pois oferecem suporte 24hs, possuem manuteno com
maior frequncia que servidores pequenos e de um modo geral as mquinas so mais
modernas e para finalizar o que acredito ser o mais importante a estrutura de segurana
quanto aos aspecto de redes na sua configurao.
Voc deve contratar uma hospedagem do tipo LINUX, pois trabalha bem com aspectos
relacionados a plataforma e estrutura do Joomla como vimos anteriormente.
importante um plano de hospedagem sem limite de trafego de dados no seu site, pois voc
deve imaginar que este pode ficar popular e caso seja limitado quanto ao trafego de dados ao
exceder o limite de trafego o seu site sair do ar.
Nas vdeo aulas do curso eu uso o servidor de Hospedagem UOLHOST do tipo LINUX, plano
econmico com 5GB de espao em disco, fluxo de dados ilimitado.
O segredo deste processo que alguns tipos de plano de pagamento trimestral lhe oferecem
o domnio grtis no primeiro ano.
Andr Rossiter
Como instalar no Servidor UOLHOST
Passo 1
Entre no site da UOLHOST, digite o seu login e senha obtidos no momento da contratao.
Na primeira tela clique na opo painel de controle/construtor de sites.
Passo 2
Na segunda tela na parte inferior clique em instalador automtico de aplicativos.
Andr Rossiter
Passo 3
Na parte inferior clique na opo a direita do CMS desejado a se instalar que no nosso caso o
Joomla.
Passo 4
Preencha os campos existentes na tela, (escolha o diretrio) em seguida clique em instalar.
Andr Rossiter
O painel de controle
Para acessar o seu painel de controle digite a url do site + administrator.

Ex. www.meusite.com/administrator
Nesse momento digite o seu login e senha definidos no momento da instalao.
Dica
Escolha sempre uma senha segura, pois muitos hackers e crackers tentam invadir os sites na
web, seja para mudar os artigos, seja para deletar arquivos, seja para roubar dados de seus
clientes cadastrados.
O importante deste processo que ao criar uma senha segura (caracteres especiais #,*,%,
letras e nmeros) voc dificulta a invaso do seu site.
Talvez parea irrelevante ter uma senha forte, mas muitas pessoas perderam meses de
trabalho por terem uma senha fraca e terem sido invadidos.
Andr Rossiter
A primeira tela do painel de controle
Esta a tela inicial quando voc loga no Joomla, todas as funcionalidades do Joomla, desde a
mais simples at a mais complexa pode ser feita a partir desta interface.
O menu superior site

Este primeiro menu superior trabalha com: configuraes globais do servidor, mdias para
publicao e atualizao FTP pela interface do Joomla, usurios, tipos de usurios, alterao de
senhas e retorno ao painel inicial do Joomla, a navegao tambm pode ser feita pelos cones.
Andr Rossiter
O menu superior menus
Esta aba responsvel por ligar as categorias criadas por voc atravs de menus de navegao
e algumas aplicaes so baseadas neste menu referido. Complemento nas vdeo aulas do
curso.
O menu superior contedo

Este menu onde criamos e definimos a arquitetura do nosso site para o Joomla.
A arquitetura deve ser feita anteriormente a sua configurao de arquivos, vai ajudar na lgica
e na arquitetura de navegao do seu site.
Andr Rossiter
O menu superior componentes
Este menu vem com algumas aplicaes extras que existem para o Joomla e outras voc pode
instalar.
Ex. o componente Jmultimdia visto em nossa vdeo aula sobre implementao de vdeo no
site, por padro o componente de contato existente nele por padro tambm abordado em
nossa vdeo aula.
O menu superior extenses

Neste menu voc pode instalar temas, plug-ins, componentes, aplicativos, dentre outros
diversos, alm de manipular e trabalhar com seus temas e acessar o HTML e CSS da pgina
relacionados ao seu site.
Andr Rossiter
O menu superior ferramentas
Uma vez que possvel cadastrar e liberar cadastro de novos membros ao seu site ou sistema,
esta ferramenta do menu permite que voc envie e-mail em massa para estas pessoas
cadastradas de uma s vez.
O menu superior ajuda

Esta categoria voc tem acesso ao suporte do sistema e informaes do sistema.
O suporte interno do Joomla muito bem organizado e categorizado por ordem alfabtica.
Andr Rossiter
Menu configurao geral
No menu de configurao inicial voc encontra vrias aplicaes importantes, como por
exemplo a configurao do SMTP que torna possvel o envio e recebimento de e-mail pelo seu
sistema de mensagens do Joomla (extenso).
IMPORTANTE
A opo 1 em vermelho a nica desta categoria que est presente em todos os painis de
configurao global. Confira abaixo a opo site.
Opo 2 em verde
Lhe possibilita desabilitar o site para visualizao do visitante enquanto voc o implementa e
configurar uma mensagem para este momento de manuteno, ou atualizao do site.
Permite dar um nome tipo TITLE ao site. O tipo de editor do site, recomendado deixar na
configurao padro, mas existe mais de um tipo e voc ainda pode instalar outros.
O importante deste item da interface de nmero 2 habilitar ou definir quem entre os
usurios do sistema ser notificado pelas mensagens do mesmo decorrente da interao com
o usurio.
Opo 3 em amarelo
Equivalente a meta description do site e as palavras chave, aplicao SEO.
Opo 4 em azul
A opo URL amigvel uma boa aplicao em SEO, mas em alguns momentos habilitar este
recurso pode dar problemas na integrao com o banco de dados, neste caso basta desativar
novamente.
Andr Rossiter
Tela configurao global opo sistema.
Opo 1 em azul
Parmetros do sistema como caminho do FTP, no deve mexer na editorao do sistema
bsico, observe que ele j vem ativo e configurado pela instalao de forma automtica.
Opo 2 em vermelho
Interage diretamente com o menu site opo de usurios, esta opo permite que voc
bloquei o cadastro de novos usurios, que libere de forma geral dentre outras aplicaes.
Opo 3 em amarelo
O Joomla possui mdulos e extenses que lhe permitem interagir com o sistema por upload
tanto para o administrador quanto para o usurio, e neste caso da configurao global para o
administrador o legal restringir extenses de tipos de arquivos para interao imediata, o
que ajuda a proteger o sistema.
Opo 4 em verde
O Joomla para segurana do administrador e do visitante desconecta o internauta ou
administrador tambm por 15 minutos de inatividade no sistema, e neste aplicativo voc pode
alterar este parmetro. Cuidado para no prolongar muito, porem 15 minutos realmente
muito pouco eu gosto de deixar em no mnimo em 60 min. A medida que voc praticar ir
entender o sentido do que digo, principalmente na hora de digitar artigos online.
Andr Rossiter
Tela configurao global opo servidor.
Opo 1 em amarelo
Juntamente com as demais opes desmarcadas ( configuraes FTP e configuraes de banco
de dados) dizem respeito ao sistema, atravs deste comandos e manipulao voc pode
mudar diretrios, banco de dados. Ex. redirecionar o site para outra hospedagem depois que
ele j est publicado.
Opo 2 em verde
A grande vantagem deste painel de codificao a questo de horrio para controle de acesso
de usurios do seu sistema. Atravs desta opo voc sabe o horrio que as pessoas entraram
no seu sistema, ou horrio que fizeram manipulaes, e at mesmo caso voc queira manter
horrio de suas publicaes este sistema tem de estar configurado de acordo com sua posio
geogrfica possvel de configurao neste item.
Opo 3 em vermelho
Este etapa torna possvel que voc receba e-mail pelo seu formulrio de contato.
Existem mtodos de configurao diferente como: send mail, PHP...
Escolha o mais adequado a sua necessidade e configure da maneira certa.
Eu gosto porem de usar o sistema de e-mail do GOOGLE DOCS.
Andr Rossiter
Menu configurao usurio
Passo 1
Observe a tela inicial de administrar usurios no Joomla.
Por esta interface voc adiciona, remove e editora os membros do seu site.
Voc tambm pode ver dados de acesso destes usurios.
Na imagem 1 em verde
Voc observa nome de registro e nome do membro cadastrado no site.
Na imagem 2 em vermelho
Voc pode observar nvel de acesso do usurio e se ele est registrado ou no.
Na imagem 3 em amarelo
Voc tem acesso ao email do usurio e data do ultimo acesso.
Na imagem 4 em azul
Voc tem acesso ao painel de adicionar novo usurio, editorar e remover estes.
Andr Rossiter
Passo 2 (Adicionando novos usurios)
Usurios Frontend:
Registered: depois de logado esse usurio tem acesso ao contedo restrito do site.
Author: alm dos privilgios do usurio registered , tambm pode enviar contedo e edit-lo
(poder editar apenas seu prprio contedo).
Editor: tem os privilgios dos usurios acima e tambm os de editar os contedos de todos do
seu grupo.
Publisher: pode enviar, editar e publicar qualquer contedo.
Usurios Backend:
Manager: tem acesso a criao e edio de contedo e outras informaes da administrao
do site.
Administrator: gerencia os contedos, inclui, exclui, publica e despublica, e tambm pode
administrar os usurios.
Super Administrator*: tem acesso total a administrao do site e somente ele pode criar um
outro usurio Super Administrator.
Andr Rossiter
Arquitetura da Informao
A arquitetura(PB) (do grego arch significando "primeiro" ou "principal" e

tkton significando "construo") refere-se arte ou a tcnica de projetar e edificar
o ambiente habitado pelo ser humano. Neste sentido, a arquitectura trata destacadamente da
organizao do espao e de seus elementos: em ltima instncia, a arquitetura lidaria com
qualquer problema de agenciamento, organizao, esttica e ordenamento de componentes
em qualquer situao de arranjo espacial. No entanto, normalmente a arquitetura associa-se
diretamente ao problema da organizao do homem no espao (e principalmente no espao
urbano).
http://pt.wikipedia.org/wiki/Arquitectura
Talvez voc esteja se questionando o porqu de falar sobre arquitetura da informao se este
curso for o seu primeiro contato com sistemas para internet.
Um site simples com poucos links tipo (home, servios, quem somos e contato) isso realmente
pode no ser o mais relevante, porem os melhores empreendimentos e a grande vantagem
do Joomla a possibilidade de desenvolvimento de sistemas mais complexos voltado para
portais e grandes sites, apesar de atender bem as necessidades de sistemas simples e nesse
momento a compreenso de arquitetura da informao imprescindvel para os seus estudos
e desenvolvimento no Joomla.
Natureza da informao
Existe uma tendncia a pensar que as classificaes so naturais ou bvias, ou lgicas. Ou
ainda s tem esse jeito de fazer.
Na verdade o que existem so convenes mais ou menos aceitas por um determinado grupo
de usurios, pois a forma como as pessoas representam a informao dentro de sua prpria
mente segue padres associativos tanto particulares quanto compartilhados.
Arquitetura da informao envolve:
A compreenso do problema e do pblico alvo
A revelao de um sistema de conhecimento
A relao entre diversos elementos (diferentes ou similares)
Saber se esses elementos tm o mesmo nvel de complexidade
Saber se a relao entre eles unidirecional ou bidirecional
O entendimento prvio dos sistemas tecnolgicos
Uma ponte entre as necessidades cognitivas do usurio e o engenheiro de software
Andr Rossiter
Roteiro de produo para a web
Objetivo:
Compreender a dimenso global de um projeto para a web, e onde a AI se encaixa durante o

processo de produo.
1. Briefing
No briefing levantam-se informaes gerais sobre o cliente, como:
Marcas & Domnio
Cores & Preferncias
Contedos
Objetivos
Pblico-alvo
Necessidades & Desejos
Documento de requisitos
Documento construdo a partir das interaes entre o cliente e o desenvolvedor. Trata-se de
um documento tcnico onde constam informaes descritivas sobre o sistema, suas
funcionalidades, seus requisitos, usurios, especificaes tcnicas, opes tecnolgicas, etc.
Produzido pelo desenvolvedor, precisa ser aprovado pelo cliente para que se possa passar para
a prxima etapa.
Andr Rossiter
2. Arquitetura geral do sistema
Organizao lgica do fluxo de navegao e interao do sistema. Pode ser indicial e/ou
grfica. Trata-se de um documento produzido pelo desenvolvedor para orientar a produo. O
desenvolvedor s passa para a quarta etapa depois da aprovao do documento de
arquitetura geral do sistema pelo cliente.
Andr Rossiter
3. Wireframe
Os wireframes so representaes esquemticas (grficas) dos layouts nicos das telas do

sistema. Indicam o posicionamento dos contedos na tela. So esqueletos que servem para
fundamentar os layouts
Andr Rossiter
4. Layout
Layout o desenho da pgina, conhecido como design. Representao grfica completa com
todos os elementos visuais que vo compor o sistema. O layout uma evoluo do wireframe.
So arquivos de imagem, geralmente .JPG ou PSD, ou PNG ou CDR, produzido em softwares
como Photoshop, Fireworks, Corel, etc. A implementao s comea aps a aprovao do
layout pelo cliente.
Andr Rossiter
5. Produo
Levantamento das informaes visuais, textuais e sonoroas que entraro no web site.
Processamento das informaes atravs de softwares especficos de tratamento de som,
imagem e texto.
Redao final dos textos de todas as sees do web site.
Andr Rossiter
Finalizao & Implementao
Finalizar codificar o layout com tcnicas e ferramentas

de front-end
Implementar fazer a programao geral do sistema
usando as ferramentas de back-end.
Testes
Aps a implementao, o sistema precisa ser testado em laboratrio. Publica-se o site em uma
URL escondida, para simular condies reais de uso, e montam-se grupos de usurios cujos
perfis foram definidos no documento de requisitos. Se forem detectados problemas na
usabilidade retorna-se implementao para eventuais consertos
Documentao
Durante o processo de implementao, so anotadas informaes importantes sobre o web
site com o objetivo de elaborar os manuais de documentao para a equipe de manuteno.
Esses manuais contm especificaes tcnicas e informaes sobre instalao e configurao.
Entrega
A entrega a concluso do projeto. Implica na disponibilizao para o cliente do web site na
URL indicada por ele na fase do briefing ou na entrega do contedo para que o cliente cuide da
publicao.
Fonte (Arquitetura da Informao): Romulo Cesar Pinto
Andr Rossiter
Seo, categoria, artigo e menu
Aparentemente este aspecto complicado relacionado a categorizao uma das grandes

vantagens do Joomla, pois ao criar um sistema de categorizao complexo, porem completo o
Joomla permite que voc trabalhe com sistemas para internet de grande complexidade como
portais de grande porte.
Antes de comear a desenvolver o seu site importante que voc trabalhe aspectos como a
arquitetura da informao vistos no capitulo anterior.
Seo
Devemos comear pela criao de Seo para desenvolver o nosso site no Joomla.
Clique no menu superior Contedo, em seguida clique em Administrar Seo.
Nesta prxima tela, voc pode editorar sees existentes, excluir estas mesmas sees ou
criar novas sees.
Para criar uma nova seo clique no boto novo em verde na parte superior a direita,
conforme imagem ilustrativa.
Andr Rossiter
Editorando a nova seo
A parte detalhes em ttulo preencha o nome relacionado a sesso, este deve ser coerente
com a futura categoria relacionada a esta.
O apelido no preciso completar, mas caso deseje fazer, repita o nome dado no titulo sem
deixar espaos em branco (use underline).
O titulo publicado (caso a sesso seja ativa no momento ou no).
A opo nvel de acesso foi descrita em captulos anteriores, mas observe um breve resumo.
Publico todos podem acessar

Registrado o usurio deve ser cadastrado para ter acesso ao contedo.
Andr Rossiter
Categoria
Deve ser feita depois da Seo obrigatoriamente no Joomla 1.5, o visto neste curso.
Para acessar e poder criar categorias no seu menu superior clique no menu contedo em
seguida clique na opo administrar categorias.
Nesta prxima tela, voc pode editorar categorias existentes, excluir estas mesmas categorias
ou criar novas categorias.
Para criar uma nova categoria clique no boto novo em verde na parte superior a direita,
Andr Rossiter
Editorando a nova categoria
A parte detalhes em ttulo preencha o nome relacionado a categoria, este deve ser coerente
com a seo que ser relacionada obrigatoriamente.
Importante
Existe uma seo abaixo de publicado (relacione a seo a qual esta categoria criada est
relacionada).
O titulo publicado (caso a categoria seja ativa no momento ou no).

Andr Rossiter
Artigo
Deve ser feita depois da Seo e Categorias ou pode ser rfo relacionado a um Menu no
Joomla 1.5, o visto neste curso.
Para acessar e poder criar Artigos no seu menu superior clique no menu contedo em seguida
clique na opo administrar artigos.
Nesta prxima tela, voc pode editorar artigos existentes, excluir estas mesmos artigos ou
criar novos artigos.
Para criar uma novo artigo clique no boto novo em verde na parte superior a direita,
Andr Rossiter
Editorando o novo artigo
A parte detalhes em ttulo preencha o nome relacionado a categoria e seo, este deve ser
coerente com a seo que ser relacionada, porem artigos podem ser rfos relacionados
apenas a Menus
Importante
Voc ter obrigatoriamente que associar este artigo a uma seo e categoria, ou escolher
qualquer em caso de artigo orfo (relacione a seo e categoria o qual este artigo criado est
relacionado). Mais detalhes assista as vdeo aulas.
O titulo publicado (caso a categoria seja ativa no momento ou no).

Andr Rossiter
MENU
Deve ser feita depois da Seo e Categorias ou pode ser rfo relacionado a um ARTIGO
ORFO no Joomla 1.5, o visto neste curso.
Para acessar e poder criar Menus no seu menu superior clique no menu contedo em
seguida clique na opo Main Menu.
Nesta prxima tela, voc pode editorar Menus existentes, excluir estes mesmos Menus ou
criar novos Menus.
O recurso de Menu possui mais configuraes que as demais opes vistas neste capitulo
(seo, categoria e artigos), como formatao e diagramao da estrutura de tpicos do
Joomla para os artigos, sees e categorias criados, o Menus pode estar relacionado a cada
um individualmente ou a todos interligado pela seo, mais detalhes veja as vdeo aulas.
Para criar uma novo menu clique no boto novo em verde na parte superior a direita,
Andr Rossiter
Editorando o novo Menu
Apos ter clicado em novo Menu no item anterior voc ser direcionado a esta tela
representada na imagem abaixo.
Observe que os ttulos so bem descritivos e veja mais detalhes nas vdeo aulas de Andr
Rossiter, desenvolvedor deste curso e apostila.
Exemplo.
Artigo (relaciona um nico artigo ou lista de artigos, relacionados a sees, categorias ou

artigos criados nas etapas anteriores).
Link (relaciona encaminhamento de uma pgina para outra, dentro ou fora do diretrio do
seu site, porm no relacionados a artigos, sees ou categorias).
Contato (relaciona com a categoria de contatos padro criado no Joomla como visto na vdeo
aula sobre formulrio de contato).
JMultimidia / Jumi (relacionado a plug-ins que instalamos conforme as vdeo aulas, caso
deseje criar algum menu relacionado a contedo criado por estes escolha a respectiva opo).
Andr Rossiter
Algumas das categorias possuem subcategorias em sua seleo.
Exemplo
A opo Artigo oferece uma nova aba de Menu sobre o tipo de Layout de Artigo
(Item do Menu).
Observe a imagem ilustrativa abaixo.
Por mais que possamos descrever os Tipos de Item do Menu, a nica forma de compreender
de verdade a pratica, pois eles dizem respeito a diagramao e forma como o contedo ir
ser inserido no layout de sua pgina.
Nas vdeo aulas voc pode observar alguns modelos e sua representao grfica, porm
reforo a importncia de se praticar e desenvolver cada uma destas categorias de item de
menu e esta etapa interfere na apresentao e diagramao do seu site de forma indireta na
disposio do contedo relacionado a seo, categorias e artigos.
Andr Rossiter
Terceira e ltima etapa na criao de seu Menu.
Tipo do Item de Menu

Nesta etapa voc pode r editorar o Item de Menu visto na pgina 36.
Detalhes do Item do Menu

Nesta etapa possvel nomear este menu, relacionar a posio do Mdulo do Menu, tipo de
publicao, nvel de acesso e Target (mesma janela ou nova janela de navegao).
Parmetros bsicos
Nesta opo voc pode relacionar a seo que deseja que este menu seja vinculado, destaques
de exibio do contedo, nmeros de colunas (disposio de contedo).
Demais opes podem variar de acordo com o Tipo de Item do Menu.
Uma boa dica
Aquela opo Welcome to FrontPage remove-se em (parmetros do sistema deletando o

nome ou alterando para outro de acordo com seu desejo ou necessidade).
Andr Rossiter
Plug in, complementos, temas, extenses, FTP
Plug-ins, complementos e temas so todos considerados extenses pelo Joomla.
Extenses
A base para instalar qualquer complemento, Plug-in, ou tema pelo seu painel de controle no
Joomla por extenses.
Para iniciar a instalao de qualquer um destes a primeira etapa :

Clique no menu superior na opo Extenses, em seguida clique na opo
Instalar/Desinstalar.
Importante
Verifique se a extenso, plug-in, tema ou qualquer outro tipo de aplicativo a ser quanto a sua
compatibilidade com a sua verso do Joomla, j que nem todo aplicativo compatvel com
todas as verses.
Andr Rossiter
Instalando Aplicativos
Neste momento dentro do Painel de Administrar Extenses clique em selecionar arquivo.
Neste momento na janela pop up do seu browser (navegador) escolha o arquivo desejado e
clique em abrir.
Neste momento clique em Enviar arquivo e instalar.
Andr Rossiter
O sistema inteligente e informa as etapas, desta forma depois de clicar em enviar e instalar
arquivos aguarde a mensagem de confirmao do sistema sobre o sucesso da etapa
desenvolvida por voc conforme modelo abaixo.
Observao
A maioria dos casos que d falha na instalao de um plug-in, complemento ou tema pela
incompatibilidade da verso instalada referente a sua verso.
Caso a opo instalada seja um plug-in ou complemento veja a categoria Plug-in &
Complementos neste capitulo, caso seja um tema que voc deseje trabalhar veja a prxima
categoria deste capitulo Temas.
Para administrar o Tema selecionado clique no menu superior Extenses em seguida

administrar tema.
Andr Rossiter
Temas & Administrar Tema
Para Administrar Tema, remover temas ou alterar clique no menu superior em Extenses em
seguida escolha a opo Administrar Tema.
Nesta prxima tela voc poder observar os temas que voc tem instalado, remover, ou
adulterar. Para definir um tema padro clique no radio buton ao lado esquerdo do nome do
tema em seguida clique em padro (ele ficar com a estrela de padro conforme imagem
abaixo.)
Andr Rossiter
Para editorar um tema em seu front End (HTML ou CSS) clique no nome do tema.
Veja abaixo a tela que voc ser redirecionado.
Para editorar o HTML clique na opo a direita desta tela anterior na opo Edit HTML.
Este tipo de procedimento realizado para refazer o design (layout do site), adicionar
mdulos, remover mdulos, inserir o analytics, dentre outras funes que voc possa
adicionar pelo HTML.
Observe o editor HTML.
Lembre de clicar em salvar aps as alteraes, nesta tela e na tela principal posterior.
Andr Rossiter
Editor de CSS do Tema
Esta tela pode variar de acordo com o seu tema, porem importante que saiba que comum
haver mais de um CSS.
Para editorar o CSS neste momento escolha a folha de estilo referente ao padro que voc
deseja redefinir em seguida clique na parte superior a direita em Editar.
Observe a tela que voc ser redirecionado aps escolher uma folha de estilos para editorar.
Lembre-se de ao final clicar salvar em todas as telas pelo seu caminho de volta.
Andr Rossiter
Plug-in & Complementos
Para visualizar os plug-ins ou complementos instalados no seu site.

Clique na aba do menu superior na opo componentes observe o modelo abaixo ilustrando o
componente de vdeo instalado (o mesmo abordado na vdeo aula desenvolvida por Andr
Rossiter) no seu box de estudos.
FTP
FTP a derivao em sua etimologia da expresso da lngua inglesa (file transfer protocol
protocolo de transferncia de arquivos) na comunicao cliente servidor.
Nessa apostila abordo como configurar pela primeira vez o seu FTP no painel de controle na
hospedagem da UOLHOST, em seguida tambm atravs de imagens ilustrativas falo sobre a
interface do FIRE FTP que utilizaremos para baixar templates, publicar templates, fazer
alteraes e o que for necessrio implementar no site atravs da transferncia de arquivos
pelos protocolos web.
Andr Rossiter
Como criar uma senha de FTP pelo painel de controle da UOLHOST

1 passo
- acesse a sua conta e clique na opo: painel de controle/ construtor de sites
2 passo
- clique na opo trocar senha de FTP
Andr Rossiter
3 passo
- digite uma nova senha e confirme a senha escolhida por voc.
Importante
- Escolha de preferencia uma senha segura, algum que quebre a sua senha pode mudar os
dados do seu site ou at deletar todo o seu trabalho.
Quanto ao login no somos nos que escolhemos o que est descrito em usurio.
Anote ou lembre estas etapas para poder configurar o FIRE FTP.
Como configurar o FIRE FTP

Como acessar o FIRE FTP
1 Passo
- Instale o programa, depois acesso a rea de FTP
Andr Rossiter
2 Passo
- Abrir a tela. Compreenda a interface.
Opo 1
- Corresponde a rea de editorao:
a) configurar uma nova conexo FTP
b) navegar entre diversas conexes FTP
c) alterar dados de conexo FTP
d) deletar uma conexo FTP
Opo 2
- Corresponde a interface de navegao do seu computador e a tela presente possui os
arquivos que voc poder atualizar no seu diretrio web, atravs dos protocolos
cliente/servidor pela prpria interface do programa.
Opo 3
- Corresponde a interface de arquivos do servidor web onde seus arquivos podem ser
publicados e o seu site hospedado. Este modelo mostra a imagem do servidor antes de ser
conectado.
Opo 4
- Descries um pouco mais tericas que definem aes executadas por suas aes atravs da
interface como forma de comunicao cliente/servidor. necessrio conexo com a internet
para usar o programa.
Andr Rossiter
3 Passo
- Configurar a primeira conta de acesso cliente servidor pelo FIRE FTP.
Imagem acesso a configurao da primeira conta abaixo.
A tela de configurao de acesso. Como preencher os campos na imagem abaixo, apenas

altere inserindo os dados de seu site nos campos descritos.
Host, Login, Password
Andr Rossiter
Modelo da pgina configurada interagindo com o Servidor Web.
Pela hospedagem Windows
Pela hospedagem Linux
OBS. Note que a navegao Windows e Linux ocorre por diretrios diferentes, mas a base de
navegao bsica para acessar, como o Explorer.
Andr Rossiter
Artisteer Como fazer meu template
Tela inicial do programa
importante que voc saiba que existem diversas verses do Artisteer e que de acordo com a
sua verso esta interface inicial pode variar, apresentando mais ou menos recursos.
O Artisteer um software (programa) de computador que interage pela sua interface de

forma mais simples desenvolvendo temas para web sites em plataformas como: Joomla,
Wordpress, Drupal, DotNetNuke, Blogger, Aplicaes ASP, Aplicaes Net e code Charge
Stdio.
Nesta tela inicial voc pode e deve escolher a plataforma web que deseja trabalhar para
poder seguir para a prxima etapa, em nosso caso iremos usar no curso a plataforma do
Joomla.
Andr Rossiter
Irei relatar os menus em ordem crescente da esquerda para direita.
Ideias.
Para cada aba de editorao do Artisteer voc pode clicar na opo Sugerir Desenho e o
programa ir apresentar opes de layout em forma aleatria para o seu Design de Layout.
Em particular, acredito que esta opo no seja a melhor de se trabalhar.
Nesta aba Ideias voc no pode editorar nada, apenas pedir sugesto de ideias referentes aos
nomes descritos em cada etapa.
Andr Rossiter
Cores e fontes
Nesta aba (cores e fontes), apesar de possuir uma opo (sugerir cores) voc pode navegar
entra as opes e escolher cores por conta prpria, alm de definir a tipografia do site ou
grupo de estilo, escala das fontes ou pedir sugesto para suas fontes.
A minha sugesto com relao a fontes que escolha fontes padro, pois algumas fontes
diferentes apesar de bonitas podem acabar prejudicando o seu layout.
Exemplo
Nas verses anteriores ao HTML5 a fonte carregada diretamente do PC (personal computer)
do internauta e quando ele no possui a fonte a diagramao pode alterar pela diferena de
apresentao de formas e tamanho das fontes no caso do internauta no possuir a fonte que
voc usou no seu layout.
A minha sugesto que use uma fonte da famlia sem serifa, tipo arial, verdana ou derivadas.
Andr Rossiter
Disposio
Nesta opo (disposio) voc pode escolher o posicionamento dos links, a disposio das
colunas do seu site, ou at mesmo a quantidade de colunas laterais do seu projeto.
O legal do Joomla em relao ao Wordpress principalmente que em sua interface mesmo

depois de programada, voc pode escolher desabilitar mdulos para pginas definidas.
Conceitos de arquitetura da informao devem ser levados em conta, ou o objetivo final do

seu projeto, outra coisa interessante que voc pode levar em conta uma reformulao do
layout por um projeto seu e usar a excelente arquitetura na organizao do Artisteer para
posteriormente reformular o seu site.
Outra coisa legal que o layout desenvolvido pelo Artisteer completamente padronizado e
aceito pela W3C o que torna o seu site um sucesso para plataformas web e lhe retorna
melhores resultados em SEO.
Andr Rossiter
Fundo
Como as demais categorias do Artisteer voc pode nesta aba selecionar a opo sugerir fundo
e ver se algum lhe agrada ou navegar entra as opes padres e manipular individualmente de
acordo com o intuito do seu projeto.
A opo preenchimento voc escolhe a cor de fundo para o seu site. Voc tambm pode
escolher planos de fundo diretamente de seus arquivos na opo do arquivo.
Andr Rossiter
Folha
Como todas as demais categorias, voc tem uma opo de pedir sugesto de folha e ver os
modelos descritos pelo programa, o ideal porem a aplicao manualmente.
Nesta aba (folha) voc pode manipular a largura da folha, raio de fundo ou topo do layout do
site, escolher aplicar ou no aplicar bordas, transparncias, preenchimento, margens
inferiores e superiores.
Andr Rossiter
Cabealho
Como todas as categorias a opo cabealho possui uma aba a esquerda (sugerir cabealho)
que lhe permite obter sugestes do programa sobre cabealhos para o seu projeto.
Uma coisa muito legal desta categoria (cabealho) o banco de dados de imagens para
modificao do topo do layout, ou efeitos de fundo para imagens bem profissionais e layouts
institucionais.
Voc define inserir o texto do ttulo superior ou no, pode alm de escolher imagens do banco
de dados do programa escolher imagens para interagir com o seu layout direto do seu PC.
Andr Rossiter
Menu
Nesta aba como todas as demais voc possui uma opo de sugesto de menus.
O importante nessa tela porem a opo de disposio da pgina, formatos para os botes,
colorao dos botes, preenchimento destes botes, definir a fonte relacionada a estas
opes e cones para menus do seu site.
Andr Rossiter
Artigos
O mais interessante do Artisteer a facilidade e inteligncia artificial no desenvolvimento de

sua interface, totalmente intuitivo.
Como voc pode observar nesta opo (Artigos) voc pode escolher a forma que deseja
personalizar os seus artigos.
Andr Rossiter
Barra Lateral
Aqui voc pode personalizar o tamanho da barra lateral, escolher a disposio destas barras
laterais, a configurao do contedo relacionado as barras laterais, cores de preenchimento,
quantidade de barras laterais que variam de uma a duas barras laterais.
Andr Rossiter
Menu vertical
Trabalhe com todas as opes e personalizao possvel para o menu vertical do seu site,
apesar de disponvel em outras abas do site, nesta categoria voc pode personalizar de forma
mais avanada individualmente nesta aba (menu vertical).
Andr Rossiter
Botes
A essa altura voc j percebeu como intuitiva a interface, eu acho que parece muito com a
do Word, sendo que as aplicaes mais eficientes e capazes de lhe retornar mais dinheiro que
o Word, em aplicaes diferentes se que possvel fazer esta equiparao.
Manipule desta forma a aparncia dos seus botes.
Dica
O layout padro o boto grande, caso deseje fazer um layout pro FACEBOOK, lembre de
diminuir o tamanho do boto.
Andr Rossiter
Rodap
As opes de rodap so bem simples, acredito que para melhorar a aparncia seja melhor
editorar depois de instalado pelo prprio painel do Joomla, usando o HTML.
Dica
As vezes voc usa uma cor slida no seu rodap e este aparece de forma clara, isto ocorre
quando est previamente aplicado uma transparncia no rodap, para ajustar esta ocorrncia
v na opo (transparncia) em seguida escolha a opo sem transparncia.
Andr Rossiter
Link de Rodap
Para remover a opo link de rodap na parte superior clique na opo exportar em seguida
clique na opo (opes de exportao...).
Ainda em Link de rodap na opo (exportar) voc ter uma nova janela com 3 opes.
Vou detalhar cada uma de forma ilustrativa. (Propriedades).
Andr Rossiter
Marca Dagua
Para exibir ou remover marca dagua.
Esta ultima opo (Nota de Rodap) permite que voc remova o link do final d pagina, eu
acho fundamental, pois acredito que fique muito feio acrescentar isso no final da pgina,
mesmo em templates vendidos para clientes e manter a sua publicidade, acredito que est
seja feita pela excelncia na prestao de servios.
Andr Rossiter
Exportando o seu projeto para publicar no site
Para exportar o seu projeto clique na aba superior no cone da tela de pintura, smbolo do
Artisteer, em seguida clique na opo Exportar, em seguida clique na opo Modelo Joomla.
Nesta prxima tela de um nome ao seu template

(IMPORTANTE no use espao nem caracteres especiais)
Selecione a pasta a ser salvo o seu arquivo (template)
(exportar como)
opo zipada tem de ser feita pelo FTP do Joomla
enquanto a opo Pasta tem de ser feita pelo FTP do fire FTP ou zipada (importante zipada no
pode ser extenso RAR)
Andr Rossiter
Como Instalar o Joomla no
FACEBOOK
Andr Rossiter
Como criar uma Fan Page
importante que voc crie uma Fan Page para poder instalar o Joomla no FACEBOOK, pois no
perfil de usurio normal no possvel ser feito isso, nem na pgina de grupo, mais detalhes
no curso sobre Redes Sociais.
Passo 1
Acesse qualquer pgina Fan Page no FACEBOOK, na parte inferior clique na opo criar pgina.
Andr Rossiter
Passo 2
Escolha a opo Negcios locais ou lugar de acordo com seu empreendimento.
Depois de clicar na opo desejada aparecer uma opo com dados a serem preenchidos,
desenvolva esta etapa e clique em comear.
Andr Rossiter
Passo 3
Voc ser direcionado a sua pgina FAN PAGE no FACEBOOK.
Clique em curtir e atualize os dados bsicos conforme os textos descritos no item comear.
Andr Rossiter
Passo 4
Insira uma imagem no seu perfil de FAN PAGE.
As pessoas no gostam de interagir com canais no FACEBOOK sem imagem.
Momento 1
Momento 2
Andr Rossiter
Momento 3
Sua pgina agora est com sua foto.
Andr Rossiter
Como Instalar o Joomla no FACEBOOK
Instale a APP do IFRAME Apps.

Link de acesso http://www.facebook.com/iframe.apps
Passo 1 clique em (Like gostei) depois clique em ir para aplicativo.
Passo 2
Clique na opo (allow permitir).
Andr Rossiter
Passo 3
Copie e cole a URL (localizador de recursos uniformes) do seu site, ou seja, o endereo do seu
site com o protocolo de comunicao completo.
Ex.
http://www.enderecomeusite.com
Caso voc possua mais de uma FAN PAGE no FACEBOOK, pode ocorrer de ser direcionado a
uma nova pgina para escolher a FAN PAGE a ser instalada o IFRAME APPS.
Escolha a FAN PAGE desejada e clique em adicionar app.
IMPORTANTE
As vezes esta etapa acontece no lugar do passo 3 as vezes como o quarto passo mesmo.
Nesse momento o seu site vai estar instalado no FACEBOOK.
Andr Rossiter
Editorando a APPS
Entre na pgina oficial de sua FAN PAGE no FACEBOOK.

Neste momento clique na opo editar.
Uma nova janela ir aparecer no FACEBOOK conforme imagem abaixo.

Clique na opo aplicativos.
Andr Rossiter
Agora na opo aplicativos.
Observe, instale e editore os aplicativos instalados no seu FACEBOOK.
A opo IFRAME APPS

Clique na opo editar configuraes para adicionar ou remover esta guia de sua pgina.
Na opo ir para aplicativo voc pode alterar os dados e URL do seu site.
Andr Rossiter
Observe o resultado final da FAN PAGE do Professor.
Andr Rossiter
Link de acesso a Fan Page do professor: http://www.facebook.com/tutorbrasil
Andr Rossiter
Gerenciando perfil preferencial
Passo 1
Entre na URL de sua FAN PAGE.
Ex. http://www.facebook.com/minha_fan_page
Clique na opo Editar pgina.
Passo 2
Voc neste momento estar na interface de editorao do perfil de sua Fan Page.
A opo para editorar (definir) sua pgina inicial da Fan Page (gerenciar permisses).
Andr Rossiter
Passo 3
Clique agora na opo guia de destino padro.

Escolha a pgina principal dentre as suas pginas existentes.
Para finalizar lembre de clicar na opo salvar alteraes no final da pgina.

Joomlaapostilaandrerossiteroficialcompleta 111212233004 Phpapp01 PDF

Caricato da

Informazioni sul documento

Titolo originale

Copyright

Formati disponibili

Condividi questo documento

Condividi o incorpora il documento

Opzioni di condivisione

Hai trovato utile questo documento?

Questo contenuto è inappropriato?

Copyright:

Formati disponibili

Joomlaapostilaandrerossiteroficialcompleta 111212233004 Phpapp01 PDF

Caricato da

Copyright:

Formati disponibili

Andr Rossiter

A rede mundial de computadores pela internet tem revolucionado a maneira de empreender,

CMS a abreviao da expresso da lngua inglesa (contente management system sistema

Cdigo aberto (Licena GPL);

Grafico comparativo Joomla e outros CMS pelo GOOGLE TRENDS

Como contratar uma hospedagem

Como instalar no Servidor UOLHOST

Para acessar o seu painel de controle digite a url do site + administrator.

O menu superior site

O menu superior contedo

O menu superior extenses

O menu superior ajuda

Menu configurao geral

Menu configurao usurio

Passo 2 (Adicionando novos usurios)

A arquitetura(PB) (do grego arch significando "primeiro" ou "principal" e

A compreenso do problema e do pblico alvo

A revelao de um sistema de conhecimento

A relao entre diversos elementos (diferentes ou similares)

Saber se esses elementos tm o mesmo nvel de complexidade

Saber se a relao entre eles unidirecional ou bidirecional

O entendimento prvio dos sistemas tecnolgicos

Uma ponte entre as necessidades cognitivas do usurio e o engenheiro de software

Roteiro de produo para a web

Compreender a dimenso global de um projeto para a web, e onde a AI se encaixa durante o

No briefing levantam-se informaes gerais sobre o cliente, como:

Marcas & Domnio

Cores & Preferncias

Necessidades & Desejos

2. Arquitetura geral do sistema

Os wireframes so representaes esquemticas (grficas) dos layouts nicos das telas do

Finalizar codificar o layout com tcnicas e ferramentas

Seo, categoria, artigo e menu

Aparentemente este aspecto complicado relacionado a categorizao uma das grandes

O titulo publicado (caso a sesso seja ativa no momento ou no).

Publico todos podem acessar

O titulo publicado (caso a categoria seja ativa no momento ou no).

Publico todos podem acessar

O titulo publicado (caso a categoria seja ativa no momento ou no).

Artigo (relaciona um nico artigo ou lista de artigos, relacionados a sees, categorias ou

Observe a imagem ilustrativa abaixo.

Tipo do Item de Menu

Detalhes do Item do Menu

Uma boa dica

Aquela opo Welcome to FrontPage remove-se em (parmetros do sistema deletando o

Plug in, complementos, temas, extenses, FTP

Plug-ins, complementos e temas so todos considerados extenses pelo Joomla.

Para iniciar a instalao de qualquer um destes a primeira etapa :

Neste momento dentro do Painel de Administrar Extenses clique em selecionar arquivo.

Neste momento clique em Enviar arquivo e instalar.

Para administrar o Tema selecionado clique no menu superior Extenses em seguida

Observe o editor HTML.

Para visualizar os plug-ins ou complementos instalados no seu site.

Como criar uma senha de FTP pelo painel de controle da UOLHOST

Como configurar o FIRE FTP

A tela de configurao de acesso. Como preencher os campos na imagem abaixo, apenas

Modelo da pgina configurada interagindo com o Servidor Web.

Pela hospedagem Windows

Pela hospedagem Linux

Artisteer Como fazer meu template

Tela inicial do programa

O Artisteer um software (programa) de computador que interage pela sua interface de

Em particular, acredito que esta opo no seja a melhor de se trabalhar.