Saiba como embutir um feed de RSS com atualizações de outro site na sua página web
Uma boa forma de “esquentar” um site de conteúdo pouco atualizado é embutir um feed de notícias RSS externo, ou seja, de outro site. Assim, mesmo que boa parte do site não seja atualizada pelo webmaster, o feed garante que o internauta encontre algo de novo ao visitar a página. Neste tutorial, mostraremos como inserir um feed RSS externo. O feed utilizado será o do site de INFO. No tutorial, montaremos dois arquivos: um, do tipo ASP, com o layout, e outro, do tipo XSL, responsável por receber os dados do feed RSS. O tutorial foi feito no Dreamweaver 8 e requer um servidor web com suporte a tecnologias de páginas dinâmicas. Os procedimentos foram realizados em um servidor IIS 5, que possui suporte nativo a ASP. Mas as instruções valem também para outras linguagens, como PHP e Coldfusion, bastando apenas mudar a extensão do arquivo de layout e possuir o servidor adequado. Você deve estar conectado à internet para que tudo funcione corretamente. Nosso exemplo mostrará o feed RSS embutido na home page de uma loja fictícia de produtos de informática.
1. O primeiro passo é montar o layout da página que exibirá o feed RSS. Você pode utilizar os recursos do Dreamweaver para criá-la do jeito que desejar. O importante aqui é designar uma área para receber os títulos da matéria, dentro de uma coluna de notícias. Em nosso, deixamos a coluna de notícias do lado direito e a preenchemos com títulos falsos, apenas para o planejamento do layout.
2. Com a página pronta, você deve salvá-la com uma das extensões dinâmicas suportadas pelo Dreamweaver. Em nosso caso, salvamos o arquivo como home_rss.asp, já que o ASP é suportado nativamente pelo servidor IIS, usado neste tutorial. Se o seu site trabalha com uma linguagem diferente, escolha a extensão adequada.
3. Com a página na linguagem adequada, selecione os títulos falsos das notícias e os apague. Eles serão substituídos posteriormente por novos títulos.
4. Vamos deixar a página ASP de lado por enquanto, e passar para o arquivo que receberá as informações do documento XML correspondente ao RSS. No Dreamweaver, esse tipo de arquivo é chamado de fragmento XSLT, por gerar apenas parte do código de uma página. Abra o Dreamweaver, clique no menu File/New e escolha a opção Basic Page/XSLT Fragment.
5. Na tela seguinte, marque a opção Attach a remote file on the internet e digite o endereço do RSS de INFO, (http://info.abril.com.br/aberto/infonews/rssnews.xml). Clique em OK. A estrutura do RSS aparece no painel Bindings, dentro do grupo Application. Salve o arquivo como manchetes.xsl, dentro de um diretório do servidor web, junto com a página dinâmica ASP.
6. No painel Bindings, dentro da estrutura do arquivo XML, clique no nó “title”, que está dentro do nó “item” (cuidado para não confundir com outro “title”, que está dentro do nó “channel”). Com o nó selecionado, arraste para o documento aberto no Dreamweaver.
7. Tecle F12 para ver uma prévia do arquivo. Você deve visualizar o título da notícia mais recente do RSS de INFO. Isto quer dizer que seu arquivo XSL está recebendo os dados do RSS.
8. Até agora, nosso fragmento XSLT só exibe o título da notícia mais recente. O próximo passo é fazer com que ele mostre todas as notícias do feed RSS. Na área de layout do arquivo XSLT, selecione o bloco de título (o único elemento da página). Clique com o botão direito e acione Paragraph Format/Paragraph. Depois clique ao lado do bloco e insira uma quebra de linha. Com isso, cada título de notícia será um parágrafo. Novamente, selecione o bloco de título da notícia.
9. Acesse o menu Insert/XSTL Objects/Repeat Region. Na janela seguinte, selecione o nó que será repetido (ou seja, o “title” que está subordinado ao nó “item”). Clique em OK. O Dreamweaver exibe uma caixa cinza em torno do bloco selecionado no passo anterior, indicando que a região será repetida.
10. Tecle F12 para visualizar uma prévia do arquivo. Agora você deve ter uma lista dos itens do RSS de INFO.
11. Nosso fragmento XSLT já exibe os títulos das matérias, mas eles ainda não têm links para as notícias. É nisso que vamos trabalhar agora. Selecione o bloco de texto correspondente ao título das notícias, na área de layout do arquivo de estilo XSL.
12. No painel de propriedades, clique no ícone de pasta, ao lado da caixa Link. Na janela seguinte, marque a opção Data Sources. O Dreamweaver exibe a estrutura do RSS.
13. Os links de cada título correspondem ao nó “link” do arquivo RSS. Por isso, selecionamos o nó “link”, subordinado ao nó “item”, e clicamos no botão OK.
14. Tecle F12 para ver uma prévia. Agora, os títulos de cada notícia já contêm links. Clique nos links para testar. Nosso trabalho no arquivo manchetes. xsl está encerrado.
15. Voltamos para o arquivo home_rss.asp. Clique na primeira linha da área que abrigará as manchetes. Acesse a barra de ferramentas Applications, clicando no botão Common para exibir outros grupos e selecionando a opção Applications.
16. Com esta barra de ferramentas à mostra, clique no botão XSL Transformation, o último do canto direito. Surge a tela XSL Transformation. Nela, clique no botão Browse da caixa XSLT File e selecione o documento manchetes.xsl. Clique em OK.
17. O Dreamweaver mostra o nó do título de notícias embutido na página. Neste ponto, o programa também cria uma pasta chamada “includes” no diretório em que o site está. Essa pasta deve ser transferida para o servidor, para que a página seja exibida corretamente.
18. Tecle F12 e veja o resultado. O RSS está embutido no documento, com links para cada notícia. Sua página dinâmica está pronta.