Componentes, módulos e plugins úteis

Componentes:

1- JCE 1.5.2 - Editor de texto com função show/hide

2- Art Banners Plus - Permite inserir banner em flsh

3- Phoca Gallery 2.2.0 - Existe uma mais nova (2.2.3), mas tive problemas com a criação de thumbmails nela. Essa versão, apesar de ser anterior, já vem com o plugin de uploads múltiplos através de zip, java (a que eu mais uso) e ftp, diferente da 2.1.0 que não disponibiliza essas recursos.
4- Phoca Favicon - Para substituição do favicon default do joomla.
5- Phoca guestbook - Livro de visitas
6- Joomla Pack 1.2 - Faz backup do site e do banco de dados
7- Joomla Explorer - Administra seus arquivos através do admin do joomla.
7- DocMan e Phoca Downloads - Gerenciadores de download.
8- Aacajoom - Administrador de newsletter

Módulos:
1- Phoca Gallery Menu 2.2.1 - Cria um menu usando como referência as categorias do Phoca Gallery.
2- Art Banners Plus Módulo - Para visualização dos banners cadastrados no componente homônimo.
3- Anti Right Click - Bloqueia o uso do botão direito no site.
4- LCPlayer - Módulo para execução de rádios e tvs on line através de endereço mms.
5- Page Peel Banner - Como vou descrever esse? Hum... Ele inseri no canto superior de sua home page aquele efeito de folha balançando e então, quando o internauta proxima o mouse em direção a animação, ela se movimenta e divulga um banner (500 x 500). Deu pra entender?  :D
6- Rok Slide Show 3.0.3 - Fácil, prático e customizável. 

Plugins:
1- All Videos 2.5.3 - Inseri videos através da tag {"extençãodoarquivo"}{/extensaodoarquivo}.
2- JCE 1.5.2 - Plugin que aciona as funcionalidade deste excelente editor de textos.

Uma dica muito boa no site do El Micox, ele demonstrou como começar um css as propriedades css mais comuns.

Segue o código que o El Micox fez:

* { margin: 0; padding: 0; /* padronizando nos navegadores */ }

img { border: 0;}

fieldset { display: block; border: 2px ridge #FFF; padding: 10px; /* padronizando nos navegadores */ }

ul, ol { margin-left: 10px; /* padronizando nos navegadores */}

input[type=hidden]{ display: none !important; visibility: hidden !important; /* esconde mesmo inputs hidden no FF */}

button { border: 1px outset #AAA;}

form button { text-align: center; margin: 5px auto; display: block; }

form ul { list-style: none; margin-left: 0; }

fieldset label { display: block;}

fieldset .radios label { display: inline; }

p { margin-top: 5px; } /* padronizando tamanhos de cabecalho em todos os browsers */

h1 { font-size: 250%;}

h2 { font-size: 200%;}

h3 { font-size: 150%;}

h4 { font-size: 120%;} /* classes costumeiras */

.ak { text-decoration: underline; /* access keys */ }

.u { text-decoration: underline; /* textos underline */}

.secoes { display: none; /* exibe nomes das seções se o CSS estiver desativado */ }

.img-left { float: left; }

.img-right { float: right;}

.erroinfo { background: #FFCCCC;}

.erro { background: #FF0000;}

Guia de CSS - Joomla

Esse é um site que contém várias referências para os CSS utilizados no core do Joomla.

Paginação do Joomla

Você já reparou que a paginação do Joomla é meio feia?? Pois é pensando nisso, fiz uma que passarei a usar como padrão nos sites que vou desenvolver, isso não singifica que será aplicados em todos mas pelo menos serve de base.
Básicamente o que você precisa fazer é baixar este arquivo (paginacao.zip), dentro do zip existem dois arquivos, um é o código php esse você deve colocar dentro da pasta html do seu template (/templates/seutemplate/html/pagination.php), e o outro arquivo é o CSS da nossa paginação, esse você deve pegar o código lá e colocar dentro do CSS do seu template ou apenas indicar no seu template mais um arquivo de CSS.
Além de modificarmos para um modo mais bonito, também deixamos o mesmo muito mais semântico. Se quiser ver a prévia do resultado basta olhar a paginação aqui do blog.
Adoraria ver variações desse trabalho, quem fizer alguma coisa relacionada e com isso e quiser postar nos comentários, ficarei grato.


Fonte : Ronildo Costa : http://www.ronildo.com.br/blog/index.php?start=80

Templates de CSS

Se você também tem os hábitos de começar os projetos do zero (não totalmente do zero ), essa dica é bem legal.
Encontrei esse site que disponibiliza alguns grids de CSS para ajudar no desenvolvimento. Ele não faz muita coisa, mas o que faz ajuda muito.
Para utilizar só entrar no template que quiser e exibir o código fonte e copiar tudo ou salvar página.

Smooth Scroll Joomla

Aqui vai mais uma dica pra Joomla, é uma dica bem simples porém dá uma enfeitada no site. Esse efeito chama-se Smooth Scroll, ele suaviza um scroll para não dar um salta e sim deslizar na página.
Recentemente eu implementei isso aqui no blog, se você quiser colocar isso nas suas páginas siga as instruções.

1. Tenha certeza que seu Joomla está carregando o javascript do Mootools.
   Como você sabe? olhe o código fonte do seu site e veja se tem a chamada para o arquivo:
   <script type="text/javascript" src="/media/system/js/mootools.js"></script>
2. Coloque este código no index.php do seu template entre as tags <head>:
   
   <script type="text/javascript">
   window.addEvent('domready',function(){ new SmoothScroll({ duration:1700 }, window); });
   </script>
3. Agora quando você criar âncoras no seu site ele vai suavizar automáticamente.
4. Não esqueça de criar suas âncoras desse tipo:
   <a name="topo" id="topo"></a>
   <a href="#topo" class="anchor">Algum texto</a>

* Onde tem 1700 é a velocidade, fique a vontade para alterar esse valor.
Se quiserem ver um exemplo na prática esse link pode ajudar.

PNG Fix para IE 6

<!--[if IE 6]>
<script src="/blog/<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/javascript
/DD_belatedPNG.js" type="text/javascript"></script>
<script>
  /* Exemplo de utilizacao */
  DD_belatedPNG.fix('.png_bg');
</script>
<![endif]-->

Basicamente esse é o código que você vai precisar colocar no seu template entre as tags head.
Nesta linha (DD_belatedPNG.fix('.png_bg');), você coloca todos os elementos do HTML que você quer que seja afetado. Por exemplo onde tá .png_bg, você pode colocar div ou p, então tudo que for div ou paragráfo, o script vai interferir nas imagens para funcionar o truque.
Nesta linha que vou colocar o código abaixo é o caminho para onde arquivo está, no caso eu coloquei o arquivo dentro de uma pasta chamada "javascript" dentro da pasta do meu template.

<script src="/blog/<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/javascript
/DD_belatedPNG.js" type="text/javascript"></script>

O site do desenvolvedor e onde você pode fazer o download do arquivo é este aqui: http://www.dillerdesign.com/experiment/DD_belatedPNG/