Como formatar RSS: adicionando estilo a um feed

click fraud protection

Um problema que se destaca com o Rich Site Summary (RSS (Frequentemente conhecido como Real Simple Syndication) é estilo ou a falta dele. Sem nenhuma formatação, as informações apresentadas em um feed RSS nada mais são do que dados brutos. Parece um pouco com uma impressão de computador ou arquivo de texto. Ainda é funcional e fornece todas as informações de que um leitor precisa para consumir o conteúdo, mas parece sem graça.

A questão é: você pode fazer as informações sobre o seu site ou blog em um feed visualmente agradável e atraente? A resposta é sim. Existem várias maneiras de fazer isso, mas a mais simples é vincular um arquivo CSS ao seu documento XML.

O que é CSS?

Folhas de estilo em cascata (CSS) são uma forma de formatar um documento. A vantagem do CSS é que ele pega as instruções de apresentação de uma página e a segmenta. Isso significa que uma página CSS pode realmente funcionar para vários documentos ou páginas da web. Temos um guia separado para adicionando CSS ao XML. Quando você está trabalhando com um arquivo XML para um feed RSS, o conceito é o mesmo.

instagram viewer

Como adicionar estilo CSS ao RSS

CSS é um arquivo separado que fornece instruções de formatação específicas para um processador. O processador examina cada linha do documento XML em sequência. Ele começará com a instrução de declaração. Identifica o idioma do arquivo e fornece informações, como a versão.

O processador descerá para a próxima linha do código. Ao vincular CSS a um arquivo XML, esta linha deve servir como um ponteiro para o arquivo de formatação.


Adicionando a linha acima em seu RSS XML arquivo, você diz ao processador que há um arquivo separado com informações. Nesse caso, o arquivo é uma folha de estilo em cascata. O processador sabe abrir esse arquivo e lê-lo. O arquivo XML completo para um feed RSS seria algo assim:

Artigos XML da Lifewire
Novas ofertas empolgantes do mundo de XML e Lifewire
htts: //www.lifewire.com/xml-articles-example-url.html
Lifewire
Mantenha-se atualizado sobre todas as dicas e truques de web design com Lifewire
https://www.lifewire.com/

Você decide como formatar e estilizar as informações. Use as tags de elemento no XML para o arquivo CSS. Por exemplo:

item {
display: bloco;
margem inferior: 30pt;
margem esquerda; 0;
}
instagram story viewer