V4 Obsidian 一键发布到公众号和小红书

发布于: 2025-11-18 更新于: 2025-12-09 📂 Youtube

📺 视频链接

你是否也遇到过这种情况：

写完一篇文章后，要在公众号排版2小时，再做小红书图片1小时...内容创作只用1小时,发布却花3小时？

今天给大家分享两个Obsidian插件，让你：

✅ 一键导出到公众号，保留所有格式和样式
✅ 一键生成小红书图片，自动排版完成
⚡ 效率提升10倍，解放双手！

插件下载

1. Note to RED（小红书插件）

GitHub仓库： https://github.com/Yeban8090/note-to-red

安装方式：

方式一：Obsidian插件市场（推荐）

设置 → 第三方插件 → 关闭安全模式
浏览社区插件 → 搜索「Note to RED」
安装并启用

方式二：手动安装

访问 Release页面
下载最新版本
解压到 {你的vault}/.obsidian/plugins/ 目录
重启Obsidian并启用插件

2. NoteToMP（公众号插件）

GitHub仓库： https://github.com/sunbooshi/note-to-mp

安装方式：

方式一：Obsidian插件市场（推荐）

设置 → 第三方插件 → 关闭安全模式
浏览社区插件 → 搜索「NoteToMP」
安装并启用

方式二：手动安装

访问 Release页面
下载最新版 note-to-mp.zip
解压到 {你的vault}/.obsidian/plugins/ 目录
重启Obsidian并启用插件

NoteToMP自定义CSS样式案例

一、基础样式片段

1. 为标题添加 emoji 装饰

CSS

/* 二级标题前添加火箭图标 */
h2::before {
  content: "🚀 ";
}

/* 三级标题前添加小圆点 */
h3::before {
  content: "● ";
  color: #3498db;
}

2. 美化引用框

CSS

/* 简约卡片式引用 */
blockquote {
  background: #f8f9fa;
  border-left: 4px solid #3498db;
  padding: 15px 20px;
  margin: 15px 0;
  color: #555;
}

CSS

/* 带 emoji 装饰的引用 */
blockquote::before {
  content: "💡 ";
}

blockquote {
  background: #fff9e6;
  border-left: 4px solid #f39c12;
  padding: 15px 20px;
  margin: 15px 0;
  border-radius: 6px;
}

3. 突出强调文字

CSS

/* 彩色背景高亮 */
strong {
  color: #e74c3c;
  background: #fff5f5;
  padding: 2px 6px;
  border-radius: 3px;
}

CSS

/* 下划线标记 */
strong {
  color: #3498db;
  border-bottom: 2px solid #3498db;
  padding-bottom: 2px;
}

4. 自定义列表样式

CSS

/* 彩色圆点 */
ul li::marker {
  content: "● ";
  color: #3498db;
}

CSS

/* emoji 标记 */
ul li::marker {
  content: "✓ ";
  color: #27ae60;
}

二、完整主题方案

主题 1：商务专业（蓝色系）

适合技术分享、职场干货、行业分析等严肃内容。

CSS

/* ===== 全局设置 ===== */
.note-to-mp {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  padding: 20px;
  color: #333;
  line-height: 1.8;
}

/* ===== 标题样式 ===== */
h1 {
  font-size: 24px;
  font-weight: bold;
  color: #2c3e50;
  text-align: center;
  padding: 15px 0;
  margin: 20px 0 15px;
  border-bottom: 3px solid #3498db;
}

h2 {
  font-size: 20px;
  font-weight: bold;
  color: #fff;
  background: #3498db;
  padding: 10px 18px;
  margin: 25px 0 12px;
  border-radius: 4px;
}

h3 {
  font-size: 18px;
  font-weight: bold;
  color: #34495e;
  padding-left: 15px;
  margin: 20px 0 10px;
  border-left: 4px solid #3498db;
}

/* ===== 正文样式 ===== */
p {
  font-size: 15px;
  color: #444;
  margin: 10px 0;
  text-align: justify;
}

/* ===== 强调样式 ===== */
strong {
  color: #e74c3c;
  font-weight: bold;
  background: #fff5f5;
  padding: 2px 5px;
  border-radius: 3px;
}

em {
  color: #7f8c8d;
  font-style: italic;
}

/* ===== 引用块 ===== */
blockquote {
  background: #ecf5ff;
  border-left: 4px solid #409eff;
  padding: 15px 18px;
  margin: 15px 0;
  color: #555;
  border-radius: 4px;
}

/* ===== 代码样式 ===== */
code {
  background: #f5f7fa;
  color: #e74c3c;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 14px;
  font-family: Consolas, Monaco, monospace;
}

pre {
  background: #2c3e50;
  color: #ecf0f1;
  padding: 15px;
  margin: 15px 0;
  border-radius: 6px;
  overflow-x: auto;
}

pre code {
  background: transparent;
  color: #ecf0f1;
  padding: 0;
}

/* ===== 列表样式 ===== */
ul {
  margin: 12px 0;
  padding-left: 20px;
}

ul li {
  margin: 8px 0;
  line-height: 1.8;
}

ul li::marker {
  content: "▸ ";
  color: #3498db;
}

ol {
  margin: 12px 0;
  padding-left: 20px;
}

ol li {
  margin: 8px 0;
  line-height: 1.8;
}

/* ===== 分割线 ===== */
hr {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 25px 0;
}

/* ===== 图片样式 ===== */
img {
  max-width: 100%;
  margin: 15px auto;
  display: block;
  border-radius: 6px;
}

主题 2：清新简约（绿色系）

适合生活分享、阅读笔记、个人成长等温和内容。

CSS

/* ===== 全局设置 ===== */
.note-to-mp {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  padding: 20px;
  background: #fafffe;
  color: #2d3436;
  line-height: 1.9;
}

/* ===== 标题样式 ===== */
h1 {
  font-size: 24px;
  font-weight: bold;
  color: #00b894;
  text-align: center;
  padding: 18px 20px;
  margin: 20px 0 15px;
  background: #e8f8f5;
  border-radius: 8px;
  border: 2px solid #b2f5ea;
}

h2::before {
  content: "🌿 ";
}

h2 {
  font-size: 20px;
  font-weight: bold;
  color: #00b894;
  padding: 8px 0;
  margin: 22px 0 12px;
  border-bottom: 2px solid #81e6d9;
}

h3 {
  font-size: 17px;
  font-weight: bold;
  color: #00796b;
  margin: 18px 0 10px;
  padding-left: 12px;
  border-left: 3px solid #81e6d9;
}

/* ===== 正文样式 ===== */
p {
  font-size: 15px;
  color: #333;
  margin: 10px 0;
  text-align: justify;
}

/* ===== 强调样式 ===== */
strong {
  color: #00b894;
  font-weight: bold;
  background: #e8f8f5;
  padding: 2px 6px;
  border-radius: 3px;
}

em {
  color: #718096;
  font-style: italic;
}

/* ===== 引用块 ===== */
blockquote::before {
  content: "💭 ";
}

blockquote {
  background: #f0fff4;
  border-left: 4px solid #68d391;
  padding: 15px 18px;
  margin: 15px 0;
  color: #2d3436;
  border-radius: 0 6px 6px 0;
}

/* ===== 代码样式 ===== */
code {
  background: #f0fff4;
  color: #00796b;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 14px;
  font-family: Consolas, Monaco, monospace;
}

pre {
  background: #1a202c;
  color: #e6fffa;
  padding: 15px;
  margin: 15px 0;
  border-radius: 6px;
  overflow-x: auto;
}

pre code {
  background: transparent;
  color: #e6fffa;
  padding: 0;
}

/* ===== 列表样式 ===== */
ul {
  margin: 12px 0;
  padding-left: 20px;
}

ul li {
  margin: 8px 0;
  line-height: 1.9;
}

ul li::marker {
  content: "✓ ";
  color: #00b894;
}

ol {
  margin: 12px 0;
  padding-left: 20px;
}

ol li {
  margin: 8px 0;
  line-height: 1.9;
}

/* ===== 分割线 ===== */
hr {
  border: none;
  border-top: 1px solid #e0e0e0;
  margin: 25px 0;
}

/* ===== 图片样式 ===== */
img {
  max-width: 100%;
  margin: 15px auto;
  display: block;
  border-radius: 8px;
}

主题 3：温暖活力（橙色系）

适合创意分享、励志内容、热点话题等活跃内容。

CSS

/* ===== 全局设置 ===== */
.note-to-mp {
  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  padding: 20px;
  background: #fffaf5;
  color: #333;
  line-height: 1.8;
}

/* ===== 标题样式 ===== */
h1 {
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  padding: 16px 20px;
  margin: 20px 0 15px;
  background: linear-gradient(135deg, #ff6b6b 0%, #ff8e53 100%);
  border-radius: 10px;
}

h2::before {
  content: "🔥 ";
}

h2 {
  font-size: 19px;
  font-weight: bold;
  color: #ff6b6b;
  padding: 10px 18px;
  margin: 22px 0 12px;
  background: #fff;
  border-radius: 20px;
  border: 2px solid #ffe0d9;
  display: inline-block;
}

h3 {
  font-size: 17px;
  font-weight: bold;
  color: #ff8e53;
  margin: 18px 0 10px;
  padding-bottom: 6px;
  border-bottom: 2px dotted #ffccbc;
}

/* ===== 正文样式 ===== */
p {
  font-size: 15px;
  color: #444;
  margin: 10px 0;
  text-align: justify;
}

/* ===== 强调样式 ===== */
strong {
  color: #ff6b6b;
  font-weight: bold;
  background: #fff5f2;
  padding: 2px 6px;
  border-radius: 3px;
  border-bottom: 2px solid #ffccbc;
}

em {
  color: #8d8d8d;
  font-style: italic;
}

/* ===== 引用块 ===== */
blockquote::before {
  content: "💡 ";
}

blockquote {
  background: #fff9e6;
  border-left: 4px solid #ff9a3c;
  padding: 15px 18px;
  margin: 15px 0;
  color: #555;
  border-radius: 0 8px 8px 0;
}

/* ===== 代码样式 ===== */
code {
  background: #fff5f2;
  color: #d63031;
  padding: 2px 6px;
  border-radius: 3px;
  font-size: 14px;
  font-family: Consolas, Monaco, monospace;
}

pre {
  background: #2d3436;
  color: #fdcb6e;
  padding: 15px;
  margin: 15px 0;
  border-radius: 6px;
  overflow-x: auto;
}

pre code {
  background: transparent;
  color: #fdcb6e;
  padding: 0;
}

/* ===== 列表样式 ===== */
ul {
  margin: 12px 0;
  padding-left: 20px;
}

ul li {
  margin: 8px 0;
  line-height: 1.8;
}

ul li::marker {
  content: "● ";
  color: #ff6b6b;
}

ol {
  margin: 12px 0;
  padding-left: 20px;
}

ol li {
  margin: 8px 0;
  line-height: 1.8;
}

/* ===== 分割线 ===== */
hr {
  border: none;
  border-top: 1px solid #ffe0d9;
  margin: 25px 0;
}

/* ===== 图片样式 ===== */
img {
  max-width: 100%;
  margin: 15px auto;
  display: block;
  border-radius: 8px;
}

三、自定义技巧

1. 颜色替换

主题色：标题、强调、边框（如 #3498db）
背景色：引用块、代码（如 #f8f9fa）
文字色：正文内容（建议 #333 - #555）

2. 字号调整

正文：15-16px
标题：h1(24px) > h2(20px) > h3(17px)
行高：1.8-2.0（中文推荐 1.8）

3. 间距优化

段落间距：margin: 10px 0
标题间距：上 20px，下 12px
内容块间距：15px

4. 兼容性说明

避免使用：

position: absolute/fixed（不支持）
复杂 box-shadow（部分支持）
text-shadow（部分支持）
动画和过渡效果

优先使用：

基础颜色和背景
边框和圆角
内外边距
简单渐变

四、AI 提示词

我正在使用一款名叫 note to mp 的 obsidian插件，这个插件的 github 主页是https://github.com/sunbooshi/note-to-mp ，请你先阅读插件的说明文档，然后帮我生成一个自定义主题的CSS代码，可以参考抖音官网的设计风格

开始打造你的专属风格 ✨

V4 Obsidian 一键发布到公众号和小红书

插件下载 #

1. Note to RED（小红书插件） #

2. NoteToMP（公众号插件） #

NoteToMP自定义CSS样式案例 #

一、基础样式片段 #

1. 为标题添加 emoji 装饰 #

2. 美化引用框 #

3. 突出强调文字 #

4. 自定义列表样式 #

二、完整主题方案 #

主题 1：商务专业（蓝色系） #

主题 2：清新简约（绿色系） #

主题 3：温暖活力（橙色系） #

三、自定义技巧 #

1. 颜色替换 #

2. 字号调整 #

3. 间距优化 #

4. 兼容性说明 #

四、AI 提示词 #

插件下载

1. Note to RED（小红书插件）

2. NoteToMP（公众号插件）

NoteToMP自定义CSS样式案例

一、基础样式片段

1. 为标题添加 emoji 装饰

2. 美化引用框

3. 突出强调文字

4. 自定义列表样式

二、完整主题方案

主题 1：商务专业（蓝色系）

主题 2：清新简约（绿色系）

主题 3：温暖活力（橙色系）

三、自定义技巧

1. 颜色替换

2. 字号调整

3. 间距优化

4. 兼容性说明

四、AI 提示词