Pular para o conteúdo

Adicione um feed RSS

Se prepare para...

  • Instalar um pacote Astro para criar um feed RSS para seu website
  • Criar um feed que pode ser inscrito em e lido por leitores de feeds RSS

Instale o pacote de RSS do Astro

Seção intitulada Instale o pacote de RSS do Astro

Astro fornece um pacote customizado para rapidamente adicionar um feed RSS ao seu website.

Este pacote oficial gera um documento não-HTML com informação sobre todas as suas postagens do blog que pode ser lido por leitores de feed como Feedly, The Old Reader, e mais. Esse documento é atualizado toda vez que seu site é reconstruído.

Indivíduos podem se inscrever em seu feed em um leitor de feed, e receber uma notificação quando você publicar uma nova postagem do blog no seu site, o que o faz uma funcionalidade popular em blogs.

  1. Feche o servidor de desenvolvimento do Astro e execute o seguinte comando no terminal para instalar o pacote de RSS do Astro.

    Terminal window
    npm install @astrojs/rss

  2. Reinicie o servidor de desenvolvimento para começar a trabalhar no seu projeto Astro novamente.

    Terminal window
    npm run dev

Crie um documento de feed .xml

Seção intitulada Crie um documento de feed .xml

  1. Crie um novo arquivo em src/pages/ chamado rss.xml.js

  2. Copie o seguinte código nesse novo documento. Customize as propriedades title e description (título e descrição), e se necessário, especifique uma língua diferente em customData:

    src/pages/rss.xml.js
    import rss, { pagesGlobToRssItems } from '@astrojs/rss';
    

    export async function GET(context) {
      return rss({
        title: 'Aluno de Astro | Blog',
        description: 'Minha jornada aprendendo Astro',
        site: context.site,
        items: await pagesGlobToRssItems(import.meta.glob('./**/*.md')),
        customData: `<language>pt-br</language>`,
      });
    }

  3. Adicione a propriedade site à configuração do Astro com a sua Netlify URL única.

    astro.config.mjs
    import { defineConfig } from "astro/config";
    

    export default defineConfig({
      site: "https://example.com"
    });

  4. Esse documento rss.xml é apenas criado quando seu site é construído, então você não será capaz de ver essa página no seu navegador durante o desenvolvimento. Feche o servidor de desenvolvimento e execute os seguintes comandos para primeiro, fazer build do seu site localmente e então, ver uma pré-visualização da sua build:

    Terminal window
    npm run build
    

    npm run preview

  5. Visite http://localhost:4321/rss.xml e verifique que você pode ver texto (não formatado) na página com um item para cada um dos seus arquivos .md. Cada item deve conter informação sobre a postagem do blog como um title, url, e description.

  6. Certifique-se de fechar a pré-visualização e reiniciar o servidor de desenvolvimento quando você quiser ver seu site em modo de desenvolvimento novamente.

Checklist

Seção intitulada Checklist

Recursos

Seção intitulada Recursos
Contribua

O que passa em sua cabeça?

Criar uma Issue no GitHub

A maneira mais rápida de alertar nosso time sobre um problema.

Comunidade