Пропустить до содержимого
Astro Astro

Добавить RSS-ленту

Приготовьтесь к...

  • Установить пакет Astro для создания RSS-ленты для вашего сайта
  • Создать ленту, на которую можно подписаться и которую можно читать с помощью RSS-лекторов

Установите пакет Astro для RSS

Astro предоставляет специальный пакет для быстрого добавления RSS-ленты на ваш сайт.

Этот официальный пакет генерирует документ не HTML с информацией обо всех ваших блог-постах, которую можно прочитать с помощью читателей лент таких как Feedly, The Old Reader и других. Этот документ обновляется каждый раз при перестроении вашего сайта.

Читатели могут подписаться на вашу ленту и получать уведомления при публикации новых постов на вашем сайте, что делает эту функцию популярной в блогах.

  1. Завершите работу сервера разработки Astro и выполните следующую команду в терминале для установки пакета RSS Astro.

    Terminal window
    npm install @astrojs/rss

  2. Перезапустите сервер разработки, чтобы снова начать работу над вашим проектом Astro.

    Terminal window
    npm run dev

Создайте документ ленты .xml

  1. Создайте новый файл в src/pages/ с названием rss.xml.js

  2. Скопируйте следующий код в этот новый документ, заменив свойство site на уникальный URL вашего сайта на Netlify. Настройте свойства title и description, и при необходимости укажите другой язык в customData:

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

    export async function get() {
      return rss({
        title: 'Astro Learner | Blog',
        description: 'My journey learning Astro',
        site: 'https://my-blog-site.netlify.app',
        items: await pagesGlobToRssItems(import.meta.glob('./**/*.md')),
        customData: `<language>en-us</language>`,
      });
    }

  3. Этот документ rss.xml создается только при сборке вашего сайта, поэтому вы не сможете увидеть эту страницу в браузере во время разработки. Завершите работу сервера разработки и выполните следующие команды, чтобы сначала собрать ваш сайт локально, а затем просмотреть предварительный просмотр вашей сборки:

    Terminal window
    npm run build
    

    npm run preview

  4. Перейдите на http://localhost:4321/rss.xml и убедитесь, что вы видите (неформатированный) текст на странице с item для каждого из ваших файлов .md. Каждый элемент должен содержать информацию о посте в блоге, такую как title, url и description.

  5. Не забудьте завершить предварительный просмотр и перезапустить сервер разработки, когда захотите снова просмотреть свой сайт в режиме разработки.

Чек-лист

Ресурсы