web

Mais uma opção para quem quer fazer um curso online. Especialmente sobre PHP. Os cursos oferecidos são:

• Customizando Templates para Joomla 1.5
• Ferramentas para Joomla 1.5
• Introdução ao Zend Framework
• Introdução ao CakePHP
• Introdução ao CMS Drupal
• Desenvolvendo Portais com Joomla 1.5
• Padrões de Projeto
• Aplicativos em PHP Orientado a Objetos
• Abstração de Bancos de Dados ADOdb
• PHP Orientado a Objetos Básico
• Introdução à jQuery

Mais detalhes no site dos cursos.

Antes de mais nada, blogroll é uma coleção de links para outros blogs. Este termo é como é conhecido internacionalmente, apesar de eu colocar em meu blog com o título Blogs amigos, tentando parecer mais amigável ao leigo (bom trocadilho, né?).

Já faz um bom tempo que mantenho esse Blogroll em meu blog. Para fazer esse blogroll antigo, eu usava dois serviços: o delicious com sua exportação para RSS e o módulo Drupal agregador de conteúdo, que é capaz de criar um bloco para um certo RSS.

Eu criei uma tag "blog" no Delicious e comecei a jogar lá todos os blogs que achava interessantes (freqüentemente, os blogs cujo RSS eu também assino). É daí que vêm minha lista de blogs amigos.

Mas havia alguns inconvenientes nessa estratégia, dentre os quais posso citar dois como principais: a dificuldade de personalizar o blogroll apenas, sem interferir em outros blocos gerados pelo mesmo esquema; e, o principal, a ordem em que aparecem os blogs ser a partir dos mais novos.

É interessante mostrar a partir dos mais novos, mas quando se trata de um blogroll com muitos blogs na fila, começa a ficar bem injusto, pois os blogs mais antigos terminam nunca mais aparecendo.

Como sera o ideal? Uma forma de pegar todos os blogs que cadastrei, escolher alguns deles (10, por exemplo) ao acaso e mostrá-los. Assim todos teriam chances iguais de aparecer.

Passei hoje no Delicious e descobri que ele oferece uma forma de manipular essas informações para apresentarmos da forma que quisermos. Sim, um arquivinho JavaScript com todo o conteúdo facilmente acessível.

A partir do exemplo que o Delicious apresenta, fiz um blogroll do jeitinho que eu queria, e mais: com o ícone de cada site!

Quem quiser usar essa idéia, fique à vontade! Aqui está o código, e você só precisa mudar o endereço http://del.icio.us/feeds/json/bardo/blog?count=100 no código, trocando bardo por seu login e blog pela tag que você usa, e definir em qtShow para a quantidade de blogs que você quer mostrar no seu blogroll. Claro que, desde que saibam o que estão fazendo, estão livres para mudar bem mais que isso no código...

<div id="myblogroll"></div>
<script type="text/javascript" src="http://del.icio.us/feeds/json/bardo/blog?count=100"></script>
<script type="text/javascript">
qtShow =13
function showImage(img){
return (function(){
img.style.display='inline'
})
}
function randOrd(a,b){
return (Math.round(Math.random()) -0.5)
}
ul =document.createElement('ul')
ul.style.listStyle ="none"
allp =new Array()
for (i in Delicious.posts){
allp.push(Delicious.posts[i])
}
allp.sort(randOrd)
last =(allp.length >qtShow) ?qtShow :allp.length -1
for(i =0; i <=last; i++){
post =allp[i]
li =document.createElement('li')
a =document.createElement('a')
a.style.marginLeft ='20px'
img =document.createElement('img')
img.style.position ='absolute'
img.style.display ='none'
img.height =img.width =16
img.src =post.u.split('/').splice(0,3).join('/')+ '/favicon.ico'
img.onload =showImage(img)
a.setAttribute('href',post.u)
a.appendChild(document.createTextNode(post.d))
li.appendChild(img)
li.appendChild(a)
ul.appendChild(li)
}
document.getElementById('myblogroll').appendChild(ul)
</script>

E pronto! É só colocar em um bloco no template do seu site e você tem o seu próprio blogroll, de facílima manutenção (é só adicionar links pelo Delicious).

Notas Anexas

Primeiro, o especialista em JavaScript aqui simplesmente não sabia que esta linguagem tinha uma estrutura de dados similar a Array (simplificado) sem usar a classe Array. Alguém sabe mais a respeito? Sabe um jeito mais prático de converter para Array ou contar seus elementos? Se alguém souber, eu agradeço!

Outra: se você tem um blog e tem acesso aos arquivos do blog, por favor coloque um favicon.ico na raiz do PATH do seu blog! Com isso, seu blog aparecerá com ícone nos blogs que usarem este código e te adicionarem.

Se você utiliza um programa de navegador moderno e eficiente, provavelmente ele oferece um recurso que ultimamente tem sido esquecido pela maioria dos usuários e webdesigners: as barras laterais.

O que são sidebars

Você usa o Mozilla Firefox? Vá em Exibir, Painel e verá a lista de barras laterais disponíveis. Clique em qualquer uma delas pra vê-la funcionando.

Você usa o Opera? No canto esquerdo há uma lista de botõesinhos, um acima do outro (é muito botão pra um navegador só!). Clicando em cada um deles você ativa sua barra lateral para a função correspondente.

Você usa o Mozilla? O completo, e não o Firefox? Então simplesmente aperte a tecla *F9*. Você verá a lista de algumas barras laterais disponíveis.

Enfim, uma barra lateral (ou painel) nada mais é do que uma área retangular estreita e comprida que aparece na área à esquerda no navegador, ao lado da área de apresentação de páginas. Essa área pode apresentar conteúdo interessante, como é o caso da barra lateral What's Related do Mozilla, que encontra páginas que têm a ver com a página que você está vendo agora na área principal.

O que coloco nisso? (como uso isso pra melhorar meu site)

Um sidebar na verdade é apenas uma página HTML simples. No caso do Mozilla e do Mozilla Firefox, pode ser uma página utilizando XUL (linguagem própria de interface das aplicações Mozilla). Ou seja, você pode adicionar funcionalidades criando um pequeno programa que fique ao lado da página principal: uma calculadora, um chat simplório sempre presente, um formulário para publicação em blogs... São diversas as possibilidades, mas vejamos apenas os casos simples, que já oferecem bastante poder (e também funcionam no Opera). Você pode:

• listar as últimas notícias - com contador de comentários entre parênteses ao lado de cada uma delas;
• oferecer links diretos para as principais seções do seu site;
• oferecer um formulário minúsculo para busca direta no seu site;
• oferecer um sinalizador para seu status de online (aquela imagem pequenininha que diz se você está ou não online no momento) de ICQ ou Yahoo!;
• colocar a previsão do tempo e cotação do dólar discretamente, embaixo de tudo isso;
• o que mais você achar interessante.

Você pode fazer do sidebar um RSS com super-poderes, com muitas informações além das últimas notícias publicadas. Pense nele como um recurso adicional a se oferecer: se usuário quiser um RSS, usa um RSS; se quiser um Sidebar, instala o sidebar.

Um exemplo de aplicação para Sidebars é o instalador de Sidebars do The One Ring, sugerido pelo Hugo nos comentários. Fica em http://www.theonering.net/staff/corvar/cgi-bin/sidebar-inst.pl.

Criando um arquivo estático

Vamos então a um exemplo simples. Como fazer um sidebar estático com uma lista de links? Simples! Escreva um HTML normal (pensando no espaço reduzido) com única diferença: todo link que você pretende que abra na área de conteúdo do navegador deve ter target="_content".

E é só isso! Notícia 01 Mas é claro que você dificilmente vai querer algo estático. Da mesma forma que uma página normal, o sidebar pode ser também uma página PHP, JSP, Perl/CGI... O que você quiser.

Instalando a Sidebar no navegador

O próximo passo é criar um link para instalar o sidebar que você fez para o seu site. Conheço até o momento dois tipos de link: um para instalar nos navegadores Mozilla e outro para o Opera. Ainda não descobri um link para o Konqueror, se alguém souber comenta aqui!

Para instalar em um navegador mozilla, coloque um qualquer coisa que ative a seguinte função JavaScript (pode ser um link, um botão...): sidebar.addPanel("Site Teste", "http://www.tes.te/sidebar.php", "") Substitua o título do sidebar e o endereço para o arquivo pelos valores que desejar.

Para o Opera, você deve fazer um link normal para o arquivo, adicionando o atributo rel, desta forma: Instalar Sidebar ----

Concluindo

Espero que este texto traga um pouco de esclarecimento sobre o assunto. São poucas linhas, mas a coisa é realmente simples. O que espanta é a falta de popularidade de um recurso tão útil. Mas ainda há tempo para revertermos o quadro! Principalmente agora, com a ascensão do Firefox...