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

Приготовьтесь…

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

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

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

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

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

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

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

   npm

   npm install @astrojs/rss

   pnpm

   pnpm add @astrojs/rss

   Yarn

   yarn add @astrojs/rss

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

   npm

   npm run dev

   pnpm

   pnpm run dev

   Yarn

   yarn run dev

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

Заголовок раздела Создайте документ ленты .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 | Блог',
       description: 'Мое путешествие по изучению Astro',
       site: 'https://my-blog-site.netlify.app',
       items: await pagesGlobToRssItems(import.meta.glob('./**/*.md')),
       customData: `<language>ru-ru</language>`,
     });
   }

3. Добавьте свойство site в конфигурацию Astro с уникальным URL-адресом вашего сайта в Netlify.

   astro.config.mjs

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

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

   npm

   npm run build
   
   npm run preview

   pnpm

   pnpm run build
   
   pnpm run preview

   Yarn

   yarn run build
   
   yarn run preview

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

   просмотрите вашу RSS-ленту в ридере

   Загрузите программу для чтения фидов или подпишитесь на онлайн-сервис для чтения фидов и подпишитесь на свой сайт, добавив собственный URL-адрес Netlify. Вы также можете поделиться этой ссылкой с другими пользователями, чтобы они могли подписаться на ваши посты и получать уведомления о новых публикациях.

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

Чек-лист

Заголовок раздела Чек-лист

• Я могу установить пакет Astro с помощью командной строки.
• Я могу создать RSS-ленту для моего сайта.

Ресурсы

Заголовок раздела Ресурсы

• Генерация элементов RSS в Astro