Este Tutorial foi feito Por Eric Costa Abril.com
Os widgets estão no auge de sua popularidade. Com eles é possível adicionar notícias, miniaplicativos, joguinhos e outros trecos digitais a qualquer blog ou site pessoal. Parece complicado de fazer, mas, em termos de programação, um widget é meramente um componente, classe ou página que gera o conteúdo em HTML, JavaScript ou Flash capaz de mostrar as informações desejadas. Neste tutorial, vamos montar um widget simples, capaz de baixar e mostrar as notícias de um canal RSS definido previamente, feito em PHP. O pacote de arquivos PHP e HTML usados no passo-a-passo está em www.info.abril.com.br/download/5166.shtml. Confira a seguir.
1. Ambiente de desenvolvimento
Para começar, vamos instalar o pacote WampServer (www.info.abril.com.br/download/4919.shtml). Ele será nossa base para testar o widget no computador local antes de enviá-lo para um servidor acessível pela internet. A instalação é bem simples, exigindo apenas, ao final, a indicação do navegador-padrão a ser usado pelo pacote. Depois disso, crie uma pasta denominada widget, dentro do diretório C:\wamp\www\, onde colocaremos os arquivos do widget.
2. Instalação do componente
O principal componente que usaremos em nosso widget é o Magpie RSS, um pacote para baixar e ler canais RSS. Para isso, descompacte o pacote Magpie RSS em uma pasta e copie os arquivos rss_fetch.inc, rss_parser.inc, rss_cache.inc e and rss_utils.inc para uma subpasta magpierss dentro da pasta widget criada acima. Além disso, copie para lá também a pasta extlib.
3. Baixando o RSS
Copie, agora, para a pasta widget, o arquivo magpie_simple.php, que está na pasta scripts do pacote do Magpie. Edite o arquivo, substituindo a linha define(´MAGPIE_DIR´, ´../´); por define(´MAGPIE_DIR´, ´magpierss/´);. Grave tudo e acesse http://localhost/widget/magpie_simple.php. Digite o endereço de um canal RSS e verifique se o componente Magpie está funcionando corretamente.
4. Montagem do widget
Agora, use o editor HTML KompoZer (www.info.abril.com.br/download/5165.shtml) para definir o visual de nosso widget. Como queremos mostrar notícias em seqüência, um visual tabular resolve bem. Lembre-se de deixar um texto referente a cada notícia, de forma a facilitar a localização dos pontos onde entrarão essas informações no código HTML gerado pelo editor.
5. Hora de juntar tudo
Com o visual em HTML e o Magpie funcionando, é hora de juntar tudo. Use como exemplo o arquivo widget.php fornecido no pacote citado no começo deste tutorial. A idéia é usar a variável $widget para armazenar os comandos HTML. Ele começa recebendo o HTML referente aos comandos anteriores ao conteúdo em RSS, depois, em um laço foreach, gera as tags para cada notícia, recebendo, ao final, o restante do HTML. Ignore tudo o que vem antes de (incluindo o próprio) e depois de ao unir o HTML em uma página PHP. Novamente, se preferir, simplesmente use o arquivo fornecido e mexa nos comandos iniciados por $widget .=. Por fim, não se esqueça de substituir o endereço do RSS pelo do seu site.
6. Teste local
Depois de cumprir o passo anterior, grave o arquivo widget.php na pasta widget e teste o resultado na URL http://localhost/widget/widget.php. Se tudo correu bem, o widget deverá ser mostrado perfeitamente. Caso tenha ocorrido alguma mensagem de erro, verifique se há aspas dentro dos argumentos do comando echo e as retire. Outro erro comum é esquecer de finalizar cada linha em PHP com ponto-e-vírgula.
7. Página final
Com tudo funcionando, é possível enviar o widget para um provedor online e permitir seu uso por blogs e outros sites. Envie toda a pasta widget. Para adicionar o widget a uma página, basta usar o código abaixo (substituindo o endereço inicial pelo de seu site): Com isso, o widget aparece automaticamente. Vale a pena, posteriormente, mexer no código para adicionar recursos ao widget, como parâmetros para fixar o tamanho horizontal e vertical, número de itens RSS baixados, entre outros. No pacote indicado inicialmente, há um arquivo widget_p.php com alguns desses parâmetros prontos.
WIDGET AUTOMÁTICO
Há alguns serviços que permitem criar um widget com base em um canal RSS automaticamente, sem conhecimentos de programação. Uma versão simples é a do Widgets.cc (http://widgets.cc/rss/scrollbox/), com poucas opções de personalização. Já o widget do site Grazr (www.grazr.com) pode receber temas, utilizar listas de canais em OPML e ser publicado em páginas como Netvibes e Pageflakes.
Sign up here with your email
ConversionConversion EmoticonEmoticon