Como inserir descrição nos módulos do Joomla

Imagine um site com diversos módulos, tudo sem identificação, e um leigo ou até uma pessoa com conhecimento, no primeiro momento vai se perder um pouco.

A melhor coisa a se fazer é identificar com uma descrição cada módulo, assim fica fácil pra qualquer administrador.

Neste exemplo colocamos a descrição "Menu principal".

Você pode fazer com todos os módulos deixando bem organizado.

Agora vamos ao trabalho.

Primeiramente Vá em Extensões > Gerenciar módulos; Depois clique para editar o módulo escolhido;

Note que aparece um campo chamado NOTA;

Insira uma pequena descrição neste campo e salve a alteração.

Pronto, simples e muito útil!

Colocar Rodapé fixo no fim da página

Esse é um problema clássico que todos nós desenvolvedores já passamos. Aprenda a criar um rodapé fixo no final do navegador. É uma solução que funciona bem em todos os navegadores.

O PROBLEMA

Como vemos na imagem acima, o rodapé do site seguindo uma estrutura normal de HTML ficaria logo após a div do conteúdo.

A SOLUÇÃO

Como vemos na imagem acima, esse é o resultado final que queremos.

O código HTML

 <div class="tudo">  
   <div class="topo"></div>  
   <div class="conteudo"></div>  
   <div class="rodape"></div>  
 </div>  

O código CSS

html,  
 body {  
   margin:0;  
   padding:0;  
   height:100%;  
 }  
 .tudo {  
   min-height:100%;  
   position:relative;  
 }  
 .topo {  
   background:#ff0;  
   padding:10px;  
 }  
 .conteudo {  
   padding:10px;  
   padding-bottom:60px;  /* Mesma Altura do Rodapé */  
 }  
 .rodape {  
   position:absolute;  
   bottom:0;  
   width:100%;  
   height:60px;  /* Mesma Altura do Rodapé */  
   background:#6cf;  
 }  

Funciona em praticamente todos os browsers (menos em IE 6).

Ativar o cache do Joomla

Uma ótima forma de otimizar seu site em joomla, é ativando o cache do mesmo.

Para ativar o cache do joomla é muito simples, vamos ao passos que se deve fazer.

Primeiramente entre na parte administrativa de seu site e, vá em Configurações Globais -> Sistema e procure por Configurações de Cache, e configure-as como na imagem abaixo.

Agora está quase pronto, basta apenas ativarmos o plugin, veja na imagem abaixo.

O Sistema - Cache vai estar com o x vermelhor, ou seja inativo, basta clicar ali, e ativá-lo.

Pronto, o cache do seu site está ativado.

Como remover index.php da url do Joomla

Um dos principais erros que iniciantes mais cometem no Joomla, é esquecer desse detalhe básico que afeta diretamente o SEO do site. Então, vamos tentar de uma vez por todas, resolver esse problema tão simples que não só diz respeito a SEO, mas a estética do site, pois as vezes essa url é de doer na vista. 
No administrator, vá no menu: Sistema -> Configuração Global
Habilite as opções “URLs Amigáveis” e “Usar mod_rewrite do Apache”, ficando como a imagem abaixo:

Pronto? Só isso? Resolvido o problema? Não!

É justamente isso que a maioria faz, acha que basta habilitar nas configurações e pronto!

Repare na imagem abaixo. 

Esse é o ponto! Para que a “mágica” funcione é preciso que na raiz/pasta do Joomla, você renomeie o htaccess.txt para .htaccess.

Caso não consiga e seu Windows não deixe, basta usar um editor HTML qualquer e renomear por ele.

Utilizando CSS Media Queries

As Media Queries definem condições para que o CSS seja utilizado em cenários específicos. Se essas condições forem aprovadas, ou seja, se o dispositivo de adequar a todas as condições estabelecidas na sua Media Querie, o CSS será aplicado.
Geralmente usamos as Media Queries dentro código CSS, que é bem mais organizado. Você linka seu CSS normalmente no HEAD do seu documento:

<link rel="stylesheet" href="estilo.css">

E dentro do código CSS, você vai separar os famosos **breakpoints**, que são as condições da largura das telas do dispositivos, que definem quando cada bloco de CSS será utilizado. Veja o código abaixo:

/* Código geral, que será herdado por qualquer dispositivos.
   nesse caso, seria o código usado no desktop.   
*/
a {
   color: blue;
  }
 
/* 
 Pra dispositivos que tem uma largura mínima de 768 pixels. Tablets, por exemplo.
*/
@media screen and (min-width: 768px) {
  a {
     color: yellow;
    }
}
 
/* 
 Com uma largura mínima de 992 pixels. Monitores por exemplo.
*/
@media screen and (min-width: 992px) {
  a {
     color: green;
    }
}
 
/* 
 Dispositivos com largura mínima de 1200 pixels. Por exemplo TVs.
*/
@media screen and (min-width: 1200px) {
  a {
     color: black;
    }
}

E assim você vai escrevendo seu CSS e alterando o layout de acordo com dispositivo desejado.