Zone Lin
文章33
標籤32
分類7
增加 Hexo 的 RSS, ATOM, JSON Feed 訂閱功能

增加 Hexo 的 RSS, ATOM, JSON Feed 訂閱功能

RSS(Really Simple Syndication) 是用 xml 定義的標準格式,用來把新聞、部落格文章或是 Podcast 更新資訊彙整到一個地方

衍生出的格式有 Atom, Json Feed 等格式

既然都做部落格了,當然要提供訂閱功能。(加減多點流量)

在 Hexo 內可以使用 Hexo-Feed 插件幫我們產生 RSS, Atom 還有 Json Feed 的檔案

Hexo-feed GitHub

安裝

需要版本

Hexo 4.X+
NodeJS 12+

安裝指令

npm install hexo-feed --save-dev

製作模板檔案

新增對應的模板檔案

RSS: themes/layout/template/rss.ejs

<?xml version="1.0"?>
<rss version="2.0">
<channel>
<title><%= config.title %><%= tag ? ` • Posts by "${tag}" tag` : '' %><%= category ? ` • Posts by "${category}" category` : '' %></title>
<link><%= config.url %></link>
<description><%= config.description %></description>
<language><%= config.language %></language>
<pubDate><%= moment(lastBuildDate).locale('en').format('ddd, DD MMM YYYY HH:mm:ss ZZ') %></pubDate>
<lastBuildDate><%= moment(lastBuildDate).locale('en').format('ddd, DD MMM YYYY HH:mm:ss ZZ') %></lastBuildDate>
<%_ for (const { name } of (tags || [])) { _%>
<category><%= name %></category>
<%_ } _%>
<%_ for (const post of posts) { _%>
<item>
<guid isPermalink="true"><%= post.permalink %></guid>
<title><%= post.title %></title>
<link><%= post.permalink %></link>
<%_ for (const tag of (post.tags ? post.tags.toArray() : [])) { _%>
<category><%= tag.name %></category>
<%_ } _%>
<pubDate><%= moment(post.date).locale('en').format('ddd, DD MMM YYYY HH:mm:ss ZZ') %></pubDate>
<description><![CDATA[ <%= post.content %> ]]></description>
</item>
<%_ } _%>
</channel>
</rss>

ATOM: themes/layout/template/atom.ejs

<?xml version="1.0"?>
<feed xmlns="http://www.w3.org/2005/Atom">
<id><%= config.url %></id>
<title><%= config.title %><%= tag ? ` • Posts by "${tag}" tag` : '' %><%= category ? ` • Posts by "${category}" category` : '' %></title>
<link href="<%= config.url %>" />
<updated><%= moment(lastBuildDate).toISOString() %></updated>
<%_ for (const { name } of (tags || [])) { _%>
<category term="<%= name %>" />
<%_ } _%>
<%_ for (const post of posts) { _%>
<entry>
<id><%= post.permalink %></id>
<title><%= post.title %></title>
<link rel="alternate" href="<%= post.permalink %>"/>
<content type="html"><%= post.content %></content>
<%_ for (const { name } of (post.tags ? post.tags.toArray() : [])) { _%>
<category term="<%= name %>" />
<%_ } _%>
<updated><%= moment(post.date).toISOString() %></updated>
</entry>
<%_ } _%>
</feed>

Json Feed: themes/layout/template/json.ejs

<%- JSON.stringify({
version: 'https://jsonfeed.org/version/1',
title: config.title + (tag ? ` • All posts by "${tag}" tag` : '') + (category ? ` • All posts by "${category}" category` : ''),
description: config.description,
home_page_url: config.url,
items: posts.map(post => ({
id: post.permalink,
url: post.permalink,
title: post.title,
date_published: moment(post.date).toISOString(),
content_html: post.content || '',
tags: (post.tags ? post.tags.toArray() : []).map(({ name }) => name)
}))
}, null, 4) _%>

設定

修改 Heox 設定檔 _config.yml 新增 feed 設定

feed:
limit: 20
order_by: "-date"
tag_dir: "tag"
category_dir: "category"
rss:
enable: true
template: "themes/layout/template/rss.ejs"
output: "rss.xml"
atom:
enable: true
template: "themes/layout/template/atom.ejs"
output: "atom.xml"
jsonFeed:
enable: true
template: "themes/layout/template/json.ejs"
output: "feed.json"

詳細設定參考 GitHub

完成

接下來只要重新佈署 hexo 即可

hexo server

檢查這些網址看是否安裝成功

http://localhost:4000/rss.xml

http://localhost:4000/atom.xml

http://localhost:4000/feed.json

本文作者:Zone Lin
本文連結:https://zonego.tw/2021/12/09/hexo-rss/
版權宣告:本文採用 創用CC BY 4.0 協議進行許可
貼文內使用的封面圖大部分來自unsplash,個別圖片的連結請看封面圖來源
×