A maior rede de estudos do Brasil

Grátis
99 pág.
Curso Joomla

Pré-visualização | Página 8 de 15

porém, diferente da opção anterior, se 
colocarmos aqui o valor dois ou acima, ele irá organizar os artigos um ao lado 
do outro, dividindo em colunas baseado no valor digitado no próximo campo 
 
#Colunas 
 
É a quantidade de colunas em que serão divididos os artigos apresentados no 
campo anterior, em outras palavras, para uma melhor organização, é 
interessante que o mesmo valor colocado em #Introdução Artigos seja 
colocado aqui também 
 
#Links 
 
Aparecerá no final, após todos os outros. Aqui é definida a quantidade de 
artigos que apresentarão somente os seus respectivos títulos 
 
Para compreendermos melhor, preencha da seguinte forma: 
 
 
 
Clique em Salvar e veja o resultado no front-end. 
 
Perceba que em nosso menu já temos um novo link 
 
 
 
Ao clicar nele, podemos verificar todos os nossos artigos, preste bem atenção 
na disposição dos mesmos: 
 
44 
 
Veja que o primeiro artigo ocupa de forma completa a área do conteúdo, os 
dois que se seguem estão abaixo divididos exatamente em duas colunas e por 
fim temos quatro links apresentando somente o título com uma barra de 
paginação ao término dos mesmos 
 
É justamente a parametrização feita no Layout desse item de menu, significa 
que se desejarmos três artigos “completos”, um em baixo do outro, devemos 
colocar esse número no primeiro campo (#Artigos Principais) e assim 
sucessivamente. 
Retirando o título do artigo do botão “Leia Mais” 
 
Por padrão, os botões “Leia Mais” dos nossos artigos vem acompanhado do 
título do mesmo 
 
 
 
Como retirar isso? 
 
Vá até o item de menu que acabamos de criar (Notícias) e acesse “Opções do 
Artigo” 
 
 
 
Note que temos as mesmas opções em cada um dos artigos criados, a 
diferença é que aqui conseguimos alterar todos que estão dentro desse link de 
uma única vez. 
 
Vá até “Exibir Título no Leia Mais” e marque como OCULTAR 
 
 
45 
 
Podemos ver o resultado abaixo: 
 
 
 
 
Criando item de menu inativo 
 
É muito natural, quando estamos criando um site, montar os itens de menu e 
deixá-los provisoriamente inativos até construir o conteúdo correspondente. Ao 
criar páginas em HTML, é possível usar # dentro da TAG <a>, dessa forma, o 
menu apesar de aparecer, se torna inativo. 
 
Exemplo: 
 
<a href=”#”>Nome do Botão</a> 
 
Vamos aprender a criar algo semelhante em nosso menu do joomla. 
Acesse Menus – Main Menu – Adicionar Item de Menu 
 
No campo “Título do Menu”, vamos colocar Site Oficial e em “Tipo de Item de 
Menu” selecione Links de Sistema – URL Externa 
 
 
 
Agora basta inserir # no campo link 
 
 
46 
 
 
Dessa forma teremos um link que existe, mas se encontra inativo, em qualquer 
momento, podemos retornar e inserir uma URL externa ou simplesmente 
alterar o “tipo de item do menu” 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
47 
 
Aula 09 - TAREFA COMPLEMENTAR 
 
Realize as etapas abaixo para criar um novo item de menu com conteúdo 
 
1 Crie uma categoria chamada Personagens 
2 Copie para sua máquina fotos dos personagens referente o seu filme 
3 Crie três novos artigos ligados a categoria Personagens 
4 Crie um novo item de menu em forma de blog 
5 Conecte o novo item de menu a categoria Personagens 
 
Importante: 
 Não esqueça de conectar cada novo artigo a categoria Personagens 
 Cada artigo deverá fazer a descrição de um personagem diferente 
 Cada artigo deverá ter uma foto 
 Armazene as fotos em uma pasta chamada personagens 
 Centralize a foto e deixe o texto abaixo da mesma 
 Coloque o “Leia Mais” entre as fotos e os textos 
 Retire o Título dos artigos do botão “Leia Mais” 
 A estrutura de layout do novo item de menu não deverá ter nenhum 
artigo principal ou links inferiores, contudo, deverá apresentar os 3 
artigos criados em 3 colunas 
 
 
 
 
 
 
 
 
 
48 
 
Aula 10 - MÓDULOS 
Conforme explicado anteriormente, os módulos se assemelham aos 
componentes, contudo, não possuem tantas funções, mas tem a vantagem de 
serem atribuídos a qualquer área do site além aparecerem em mais de uma 
página 
 
Muitos componentes também podem ser apresentados como módulos, isso 
significa que além de ter diversas opções de personalização, é possível 
apresentá-los em diferentes lugares. 
 
Conhecendo um pouco sobre Templates 
 
Para compreendermos melhor essa diferença entre componentes e módulos e 
darmos continuidade em nosso processo de criação, vamos explicar um pouco 
sobre outra importante extensão, os templates. 
 
Templates nada mais são que o “esqueleto” do site, onde toda informação é 
apresentada. Cada template possui diversas posições e elas são preenchidas 
pelos módulos. 
 
O Joomla em sua versão mais atual vem com dois diferentes templates, o 
protostar é aquele que vem instalado como padrão. Mais a frente veremos mais 
detalhes sobre configurações de templates, por enquanto, basta conhecermos 
as posições do protostar, vejamos abaixo como fazer isso: 
 
Acesse Extensões – Gerenciador de Temas 
 
 
 
 
 
 
 
 
 
49 
 
Em seguida, clique em opções (ícone em formato de engrenagem do lado 
superior direito) 
 
 
 
Altere a Opção Preview Module Position para “ATIVADO” 
 
 
 
Com isso agora temos a possibilidade de enxergar as áreas do template. Para 
isso, vá até o front-end e independente da página digite ao término da URL: 
?Tp=1 e aperte ENTER 
 
Perceba que é possível visualizar as posições do template (em vermelho) 
mesmo as que não estão sendo utilizadas. Inclusive, quando uma posição não é 
utilizada, ela simplesmente “se retrai” permitindo que os conteúdos próximos 
venham a se expandir, todavia, se encaixarmos algum conteúdo em uma 
posição ainda não utilizada, o template se adapta para comportar aquela 
informação. 
 
As posições do Template Protostar 
 
Vamos compreender melhor como é feita a distribuição das posições do 
template padrão, observe que as três primeiras áreas são: Position 0, Position 1 
e banner, sendo um em baixo do outro 
 
 
 
 
50 
 
Perceba que os três preenchem a área completa do template, de ponta a 
ponta, diferente dos que veremos a seguir: Position 8, Position 3 e Position 7. 
 
Todos eles estão um ao lado do outro 
 
 
 
Apesar de não aparecer (em nenhum template), existe uma área que é usada 
para receber o conteúdo de nossos artigos e também para apresentar diversos 
componentes, chama-se “content”. 
 
Basta observar e ver que o local onde está o artigo realmente não apresenta 
nenhuma janela mostrando o nome da posição e ele(s) se encontra(m) bem 
embaixo do Position 3 
 
 
 
Por fim, na parte inferior, temos as três últimas posições, sendo Position 2, 
Footer e Debug. A primeira citada está na mesma linha do Position 3 e do 
content e as outras duas se assemelham as do topo e se espalham de forma 
horizontal por todo o site 
 
 
51 
 
Um template, portanto, se assemelha a um quebra cabeça no qual podemos ir 
encaixando nosso conteúdo (componentes e módulos) de forma a construir o 
designer desejado. 
 
Gerenciando Módulos 
 
Agora que conhecemos nosso template e suas respectivas posições, vamos 
voltar aos Módulos. Acesse Extensões – Gerenciador de Módulos 
 
 
 
Já temos, por padrão, três módulos instalados sendo: 
 
Breadcrumbs (usado como uma espécie de mapa, mostrando o local onde o 
visitante se encontra) 
 
 
 
 
 
Main Menu (usado para gerar o menu de nosso site) 
 
 
 
 
 
 
52 
 
Finalmente temos o Login Form (módulo usado para o gerenciamento interno. 
Veremos mais sobre ele adiante) 
 
 
 
 
Existem três colunas importantes nessa área de gerenciamento de módulos, 
sendo Posição, Tipo e Páginas 
 
 
 
No primeiro temos exatamente