博客元素

博客元素

导航栏

1首页 文档库 博客 专题 娱乐 生活 索引 关于

demo地址：https://onedayxyy.cn/

4种站点风格

支持 完整博客风/简约博客风/文档风/产品官网风。

风格1：完整博客风

demo地址：https://onedayxyy.cn/

风格2：简约博客风

demo地址：https://wiki.eryajf.net/

风格3：文档风

案例：vitepress风格（会变颜色的动态环）

demo地址：https://notes.ksah.cn/

案例：简约风

记录于2026年6月21日，来自@白木。

案例：有点意思（宇宙）

记录于2026.7.8,来自@KOK。

风格4：产品官网风

demo地址：https://starlight.astro.build/zh-cn/

4种首页壁纸风格

支持壁纸模式切换；（全屏模式壁纸、半屏模式壁纸、背景模式壁纸、无壁纸模式）。

案例：全屏模式壁纸

1首页全屏模式壁纸轮播 & 打字机 & 小箭头
2
3首页banner壁纸轮播：精选风景、美女壁纸轮播
4
5首页 壁纸 随机 轮播（具有打字机、大波浪、3个feature图片（可选）、向下的小箭头、由远及近的缩放效果）；

demo地址：https://onedayxyy.cn/

视频效果：

案例：半屏模式壁纸

demo地址：https://wiki.eryajf.net/

案例：背景模式壁纸

案例：无壁纸模式

首页文章布局风格

案例：卡片风格

案例：横排风格

案例：纯文字风格

案例：最美博客风格

 1😎以下4个模块：
 2在首页各模块只显示2行文章，其余以更多按钮展示。
 3
 4文档
 5
 6博客
 7
 8生活
 9
10感悟
11
12
13😎文章呈现方式：
14卡片、横排无文字、横排图文 显示
15
16
17😎
18筛选方式：
19按创建时间、最近更新时间
20按标签、分类

🍊案例：最美博客首页模块布局

demo地址：https://poetize.cn/

首页卡片模块

 1个人简介
 2重要通告
 3日历、节假日倒计时
 4最新评论
 5精选文章
 6文章分类
 7热门标签
 8友情链接
 9赞赏清单
10站点统计
11关注公众号

视频效果：

兼具文档库和博客风格

需要同时兼具文档库和博客风格：文档库就是类似多层级目录效果，博客就是一篇篇文章。

文档库：

demo地址：

https://imfing.github.io/hextra/zh-cn/docs/

博客：

demo地址：

https://imfing.github.io/hextra/zh-cn/blog/

博客背景大图

dmeo地址：https://teek.seasir.top/pages/d834fd

footer

demo地址：https://onedayxyy.cn/

代码块 查看更多风格

案例：毛玻璃（@白木）

demo地址：https://onedayxyy.cn/topic/hugo-teek-install

文档创建时间、最近修改时间

demo地址：https://onedayxyy.cn/topic/HugoTeek-is-yyds/

能支持百万md构建

需能支持百万md构建；

自带评论、全文搜索、统计、点赞、纠错等功能

• 支持 自带评论、全文搜索、统计、点赞、纠错等功能；（支持 即使后端挂掉，也不影响站点正常访问（备注：这里的后端我希望是eo边缘函数提供的类似后端功能））
• 内置的全文搜索必须能秒搜索东西、且支持全文模糊搜索；

😎 站点统计 功能：

demo地址：https://onedayxyy.cn/

首页右下角小火箭 和 评论按钮

demo地址：https://onedayxyy.cn/

侧边栏、正文、目录 三栏自适应

demo地址：https://onedayxyy.cn/

markdown语法

告警容器

demo地址：https://onedayxyy.cn/

🍊配置：

 1::: info
 2这是一条info，自定义格式：info+空格+自定义文字
 3:::
 4
 5::: tip 提示
 6这是一个提示，自定义格式：tip+空格+自定义文字
 7:::
 8
 9::: warning 警告
10这是一条警告，自定义格式：warning+空格+自定义文字
11:::
12
13::: danger 危险
14这是一个危险警告，自定义格式：danger+空格+自定义文字
15:::

🍊效果：

折叠

demo地址：https://onedayxyy.cn/

🍊语法：

1::: details 点我查看
2这是一条详情，自定义格式：details+空格+自定义文字
3:::

🍊效果：

友链

🍊效果：

demo地址：https://onedayxyy.cn/about/friend-links/

网站导航

demo地址：https://onedayxyy.cn/about/websites/

留言区

demo地址：https://onedayxyy.cn/about/liuyanqu/

移动端发布文章

• 需支持移动端发布文章，编辑博客配置；

所有功能均抽离成图形化

• 凡是代码支持的功能，均可以在图形化里点点点配置完成；

菜单栏样式

侧边栏样式

文章目录样式

滑动条样式

首页滑动体验 & 切换页面体验

整体站点风格

开箱即用，部署简单

作品集模块

朋友圈

思考

时间轴

相册、音乐、观影厅

图标

• 图标要风格一致，足够漂亮；

字体

• 字体要适合中文阅读，要好看；

备份功能

• 具备一键备份、定期备份站点功能；

订阅制

• 具备订阅制功能，拒绝白嫖；

代码块 查看更多风格

案例：csdn风格

hugo-teek风格：https://hugo-teek.onedayxyy.cn/topic/grhke/

案例：跳动的小箭头（@时光）

赞赏

案例：hugo-teek

https://wiki.xxdevops.cn/about/thanks/

首页卡片赞赏：

案例：蘑菇社区

案例：张洪HEO

https://blog.zhheo.com/

字体

案例：sin博客

字体不错

作者回复：

字体位置：2025.12.30-sin大佬好看的博客字体

字体名称：

首页文章卡片 hover效果

案例：上移效果

案例：往外扩散效果

blur-模糊

md编辑器

案例：milkdown（@白嫖小王子）

基于go后端+静态前端，前端借鉴于ThriveX博客

https://blog.pigeoooon.site/

案例：wp古堡编辑器（@白木）

2026年2月4日记录。

强加密 & 付费阅读

需求

案例：w3c的astro站点

https://astro.w3c.cool/ w3c这个astro不就支持 强加密 & 付费阅读 吗？

rss

超链接风格

案例：rz风格

2026年4月28日记录。

网站demo：https://onedayxyy.cn/oneblog/beauty-blog/

视频效果：

控制台放置很多小工具

案例：我是清羽飞扬

记录于2026年5月30日

站点：https://www.liushen.fun/

结束