RSS 是博客的核心功能，但默认的 XML 格式在浏览器中看起来不够友好。传统的解决方案需要自己编写 XSLT 样式表，这对很多博主来说是个技术门槛。
今天介绍一个超简单的解决方案——RSS.Beauty，它是一个在线服务，可以自动为你的 RSS 源生成漂亮的样式表，而且完全免费！
效果如下：
在线预览：
RSS.Beauty 是一个在线服务，专门用于为 RSS 源生成美观的 XSLT 样式表。它的特点是：
打开浏览器，访问 RSS.Beauty 网站。
RSS.Beauty 提供了多种样式表链接，你可以选择：
选项 1：使用官方 CDN（推荐）
https://rss.beauty/xsl/pretty-feed-v3.xsl选项 2：自定义样式 点击 “Customize” 按钮，可以调整颜色、字体等参数，生成自定义的样式表链接。
在你的 RSS 生成代码中，添加 XSLT 引用。以 Next.js 为例：
// src/app/feed/route.ts
const rssContent = `<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="https://rss.beauty/xsl/pretty-feed-v3.xsl"?>
<rss version="2.0"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:content="http://purl.org/rss/1.0/modules/content/">
<channel>
<title>你的博客标题</title>
<link>https://你的博客网址</link>
<description>你的博客描述</description>
<!-- RSS 内容 -->
</channel>
</rss>`;关键修改就是这一行：
<?xml-stylesheet type="text/xsl" href="https://rss.beauty/xsl/pretty-feed-v3.xsl"?>保存修改后，重新部署你的博客：
npm run build
npm start访问你的 RSS 源（例如 https://你的博客网址/feed），现在应该能看到美化的页面了！
如果你希望完全掌控样式表，或者担心依赖外部服务，可以将样式表下载到本地使用。这样可以避免跨域问题，并且完全自托管。
访问以下链接下载你需要的样式表文件：
直接访问这些链接，浏览器会显示 XSLT 代码，然后右键选择”另存为”保存文件。
将下载的文件放置到你网站的静态资源目录中。不同框架的静态资源目录位置：
public/rss.xsl 或 public/atom.xslpublic/rss.xsl 或 public/atom.xslstatic/rss.xsl 或 static/atom.xslsource/rss.xsl 或 source/atom.xsl重要提示：样式表文件必须放在同一个域名下，不能跨域引用。
在你的 RSS 生成代码中，将 XSLT 引用改为本地路径。
以 Next.js 为例，如果你的 RSS 源在 src/app/feed/route.ts：
// src/app/feed/route.ts
const rssContent = `<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/xsl" href="/rss.xsl"?>
<rss version="2.0"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:content="http://purl.org/rss/1.0/modules/content/">
<channel>
<title>你的博客标题</title>
<link>https://你的博客网址</link>
<description>你的博客描述</description>
<!-- RSS 内容 -->
</channel>
</rss>`;如果是 Atom 源，则使用：
<?xml-stylesheet type="text/xsl" href="/atom.xsl"?>保存修改后，重新部署你的博客：
npm run build
npm start然后访问：
https://你的博客网址/rss.xsl - 确认样式表文件能正常访问https://你的博客网址/feed - 确认 RSS 源显示美化的页面| 对比项 | 本地部署 | 在线服务 |
|---|---|---|
| 依赖性 | 完全独立 | 依赖 RSS.Beauty |
| 跨域 | 无跨域问题 | 可能存在跨域限制 |
| 自定义 | 可自由修改 | 受限于在线生成器 |
| 维护 | 需要自己维护 | 自动更新 |
| CDN | 需要自己配置 | 内置 CDN 加速 |
| 适合场景 | 企业级、高定制需求 | 个人博客、快速上线 |
本地部署的优势是可以自由修改样式表。打开 rss.xsl 文件，找到 <style> 标签，你可以：
<style>
/* 修改主色调 */
:root {
--primary-color: #667eea;
--secondary-color: #764ba2;
}
/* 修改字体 */
body {
font-family: 'Helvetica Neue', Arial, sans-serif;
}
/* 自定义布局 */
.container {
max-width: 1000px; /* 改变宽度 */
padding: 50px; /* 改变内边距 */
}
/* 添加自定义元素 */
.custom-banner {
background: linear-gradient(90deg, #ff6b6b, #feca57);
/* 你的自定义样式 */
}
</style>修改完成后保存，无需重新部署，刷新浏览器即可看到效果。
目录结构：
your-project/
├── public/
│ └── rss.xsl ← 样式表文件放在这里
├── src/
│ └── app/
│ └── feed/
│ └── route.ts ← RSS 生成代码RSS 引用：
<?xml-stylesheet type="text/xsl" href="/rss.xsl"?>目录结构：
your-project/
├── public/
│ └── rss.xsl ← 样式表文件放在这里
├── src/
│ └── pages/
│ └── rss.xml.js ← RSS 生成代码RSS 生成代码：
import rss from '@astrojs/rss';
export const GET = async () => rss({
title: '你的博客',
description: '博客描述',
site: 'https://你的博客网址',
items: getPosts(),
stylesheet: '/rss.xsl', // 使用本地样式表
});目录结构：
your-project/
├── static/
│ └── rss.xsl ← 样式表文件放在这里
├── layouts/
│ └── _default/
│ └── rss.xml ← RSS 模板RSS 模板：
<?xml version="1.0" encoding="UTF-8"?>
{{ printf "<?xml-stylesheet type=\"text/xsl\" href=\"%s\"" "/rss.xsl" | safeHTML }}
<rss version="2.0">
<!-- RSS 内容 -->
</rss>目录结构：
your-project/
├── source/
│ └── rss.xsl ← 样式表文件放在这里
├── _config.yml ← 配置文件配置文件：
# _config.yml
feed:
type:
- atom
- rss2
path:
- atom.xml
- rss2.xml
limit: 20
rss:
xml_stylesheet: '/rss.xsl' # 使用本地样式表RSS.Beauty 是一个非常实用的工具，特别适合不想折腾技术的博主：
如果你还没有美化 RSS 源，或者觉得自己写 XSLT 太麻烦，强烈推荐试试 RSS.Beauty！
后记：有时候，最好的解决方案不是自己造轮子，而是善用现有的优秀工具。RSS.Beauty 就是这样一款工具，它让 RSS 美化变得简单快捷，让博主可以专注于内容创作，而不是纠结于技术细节。推荐大家使用！
此内容由惯性聚合(RSS阅读器)自动聚合整理，仅供阅读参考。 原文来自 — 版权归原作者所有。