博客网站使用指南

欢迎使用我的个人博客网站！本指南将详细介绍博客网站的各项功能和使用方法，帮助您更好地浏览和使用博客网站。

目录

网站概况

欢迎来到Jay的博客！这是一个记录技术成长、分享学习心得和生活感悟的数字空间。

  • 网站名称：Jay的博客
  • 网站副标题：分享技术的个人博客
  • 作者：Jay
  • 创建时间：2026年1月

技术栈：

  • Hexo（静态博客生成器）
  • Butterfly（现代化的Hexo主题）
  • GitHub Pages（免费、稳定的静态网站托管服务）
  • Giscus（基于GitHub Discussions的评论系统）
  • Local Search（本地搜索，无需第三方服务）

导航菜单

网站顶部导航栏采用固定设计，包含以下主要栏目：

  • 首页：展示最新发布的文章，动态打字机效果的副标题轮播，美观的文章卡片式布局
  • 关于我：详细介绍博主的个人信息、技术栈和联系方式
  • 内容：包含归档、分类、标签和博客历程
  • 工具箱：提供各种实用工具和资源，完全免费，无需注册
  • 社区：友链和留言功能，使用Giscus评论系统
  • 创作投稿：提供文章投稿的相关信息和指南
  • 订阅：提供RSS订阅功能，方便用户订阅最新文章

文章阅读

文章布局

  • 顶部区域：醒目文章标题、发布时间、更新时间、分类标签和封面图片
  • 右侧边栏：作者信息、最新评论、热门文章、分类列表、标签云、归档和网站统计

文章功能

  • 目录导航：点击目录项可快速跳转到对应章节，支持平滑滚动
  • 字数统计：显示文章总字数和预计阅读时间
  • 阅读模式：点击右下角按钮可切换到专注阅读模式
  • 评论系统：集成Giscus评论，支持GitHub账号登录
  • 相关文章：智能推荐相关主题的文章
  • 上下篇导航：文章底部提供上下篇快速导航
  • 版权信息：文章底部清晰显示版权声明

代码块

  • 主题：现代化的ocean主题，支持语法高亮
  • 功能：一键复制代码、自动识别代码语言、代码块高度限制、支持收缩/展开、支持行号显示

数学公式

  • 支持：使用高性能的KaTeX渲染数学公式
  • 语法：行内公式 $公式$，块级公式 $$公式$$

搜索功能

  • 类型：本地搜索（基于JavaScript实现，无需服务器支持）
  • 位置：页面右上角的搜索图标
  • 功能：支持文章标题和内容的全文搜索，搜索结果实时高亮，支持结果预览和搜索历史
  • 特点：搜索速度快，保护用户隐私，支持中文搜索

主题切换

  • 暗色模式：点击右下角的齿轮图标找到日夜切换按钮切换亮色/暗色模式，夜间阅读更舒适
  • 阅读模式：点击右下角的书本图标进入专注阅读模式，去除干扰元素
  • 繁简中文转换：点击右下角的转换图标切换简体/繁体中文
  • 颜色转换：点击右下角的调色盘图标切换多种主题颜色
  • 节日主题转换：点击左下角的节日主题转换图标切换节日主题

交互功能

  • 返回顶部：点击右下角的箭头图标快速返回页面顶部
  • 侧边栏控制：点击右下角的侧边栏图标可隐藏/显示右侧边栏
  • 点击效果：点击页面任意位置会出现爱心动画，增加趣味性
  • 图片查看：支持图片点击放大查看，使用Fancybox插件
  • 随机名言显示：在首页顶部随机显示一条名言，增加阅读兴趣
  • 进度条显示：支持在顶部显示文章阅读进度，方便用户跟踪阅读进度
  • 评论互动：支持读者在文章下方发表评论，与作者和其他读者互动
  • 分享功能：支持将文章分享到社交媒体平台
  • 打赏功能：支持读者对喜欢的文章进行打赏，支持微信支付和支付宝

性能优化

  • 图片懒加载：仅当图片进入视口时才加载
  • CDN加速：使用jsDelivr全球CDN加速静态资源
  • PWA支持：支持渐进式Web应用，可添加到桌面
  • 离线缓存：集成Service Worker，实现离线访问功能
  • 代码压缩：对HTML、CSS和JavaScript代码进行压缩
  • 资源缓存：合理设置缓存策略，减少重复请求

移动端优化：

  • 响应式设计，适配各种屏幕尺寸
  • 优化字体大小和行高，提升可读性
  • 增大点击区域，适配触摸操作
  • 小屏幕设备上默认隐藏侧边栏

统计功能

  • 百度统计：网站访问数据统计
  • 不蒜子统计：网站总访问量、独立访客数和文章阅读量

RSS订阅

  • 功能：提供RSS订阅功能，方便用户订阅最新文章
  • 地址：https://jay-r-j.github.io/atom.xml
  • 优势：实时获取最新文章推送，支持多种RSS阅读器，无广告干扰

使用技巧

  1. 快速搜索：点击右上角搜索图标，输入关键词即可搜索文章
  2. 主题切换：根据个人喜好和阅读环境切换暗色/亮色模式
  3. 专注阅读：使用阅读模式获得更好的阅读体验
  4. 订阅更新：通过RSS订阅获取最新文章推送
  5. 参与评论：使用GitHub账号登录评论，与作者和其他读者互动
  6. 分享文章：将喜欢的文章分享到社交媒体
  7. 使用目录导航：长文章可通过左侧目录快速定位
  8. 图片放大查看：点击文章中的图片可放大查看细节
  9. 返回顶部：阅读长文章时，点击右下角箭头图标快速返回顶部
  10. 隐藏/显示侧边栏：点击右下角侧边栏图标可切换侧边栏显示状态
  11. 复制代码：点击代码块右上角的复制按钮可一键复制代码
  12. 繁简中文切换：根据个人阅读习惯切换简体/繁体中文

移动端使用技巧：

  • 移动端访问时，侧边栏默认隐藏，点击左上角菜单按钮可展开导航菜单
  • 点击右上角搜索图标可打开搜索框
  • 点击文章中的图片可放大查看

浏览器支持

  • Chrome（推荐）
  • Firefox
  • Safari
  • Edge

联系方式

如果您有任何问题、建议或合作意向，欢迎通过以下方式联系我：

合作方式

  • 文章投稿：欢迎投稿分享您的技术经验和学习心得
  • 友情链接：欢迎互换友情链接，互相支持
  • 技术合作：欢迎技术交流和合作开发
  • 广告合作：提供合理的广告合作方案

反馈渠道

  • 留言板：在博客留言板留下您的意见和建议
  • GitHub Issues：通过GitHub提交Issue反馈问题
  • CSDN评论：在CSDN博客文章下留言

🎉 感谢阅读！

非常感谢您阅读这份博客使用指南！希望它能帮助您更好地了解和使用我的博客网站。

博客还在不断发展和完善中，我会持续更新优质内容，优化网站功能和用户体验。如果您有任何问题、建议或想法，欢迎随时与我联系。

您的支持和反馈是我前进的动力！

最后，祝您在我的博客中度过愉快的时光，收获知识和灵感！

📅 更新时间：2026-02-5
✍️ 作者：Jay