-
-
-
-
Mozz Plus - Typecho响应式昼夜双色简约主题
Mozz主题亮点
- 主题清新自然,简约适用
- 基于pjax技术,页面无感刷新
- 支持DarkMode深色模式一键切换
- 支持评论,只需填写QQ与昵称无需注册。
- 可以后台自行创建新页面并支持设置自定义图标(iconfont)
- 支持文章顶置(滑动轮播)
- 响应式代码,完美过度动画。
- 文章目录/平滑定位
- 支持代码高亮,自动解析代码语言。
- 支持插入在线视频,图文视频混合排版。观看demo
- 基于Typecho超轻博客框架,功能却十分齐全。
- 代码内置百度SEO动态自动提交工具
开发版
基于gulp
构建的ssr项目,极简的配置,一个命令gulp即可完成自动打包操作(本项目中gulp已配置好,无需修改任何代码即可使用)。了解gulp
开发阶段:
- 自动、即时的less、js、编译,毫无察觉
- 支持es5、es6、es7语法,混合编译
- 丰富的npm插件随意import
- 简化代码结构,看齐组件化、低耦合
- 加入jquery,支持操作dom
- 已经处理好的jquery.pjax的事件周期,无需关心
打包阶段:
- 执行
gulp
命令,只需4个字母即可完成项目打包 - 合并全部js、less,打包自动压缩混淆
- 自动化版本,静态资源(js,css)自动添加版本号,避免版本更新缓存问题
赞助作者
本主题使用的Typecho是本作者定制版,使用官网版本不能完全体验本主题功能。以下两个版本均包含定制版Typecho更新包(代码)
主题售价 | 价格 | 说明 |
---|---|---|
情怀标准版 | ¥19.99 | 一杯卡布奇诺的价格,立即拥有自己的Mozz,免费升级,代码压缩,不可二次开发、不可去除Mozz版本标识,赠送2DLive插件(请主动索取) |
专业开发版 | ¥99 | 标准版内容+获得未压缩代码,可二次开发,去除标识,以及标准版全部福利,升级可补差价,享受技术咨询服务,拉你进主题开发群和各界前端大佬们畅聊。 |
付款请截图,加QQ:584363361,谢谢支持
以下是主题配置教程文档
自定义独立页面的图标
- 登陆iconfont,找到喜欢的图标,点击下载按钮
- 进入页面,点击
复制svg
- 添加字段
icon
,值为刚才复制的东西ctrl+v
导航栏跳转外部页面
- 如果你想直接外链到外部页面:添加字段
target
,值为跳转url
,默认新窗口打开外部页面
SEO优化-设置禁止爬虫读取
这个字段是为了SEO优化而设置的字段。我们要知道一旦爬虫跳转到了外部地址他就不会再就来了。
- 如果你不想让爬虫访问这个链接:添加自定义字段
rel
,值为external nofollow
。当然也可以自己填写其他值。
添加友情链接模版页面
- 新建独立页面,取名
随意
,右侧自定义模版,选择page-guys
友情链接 - 后台
主题=>设置外观
配置友情链接相关信息,格式:[头像url=>名字=>网址=>骚话]
设置首页顶部文章轮播
- 文章页面增加自定义字段
top
,值随意,默认根据文章发布日期,降序显示,滑动切换
设置文章缩略图
- 首页文章卡片:设置字段
thumb
,值为图片地址,缩略图优先调用thumb
字段的图片,如不设置,文章首图作为缩略图 - 轮播:默认调文章首图
在文章中插入视频
1.在文章编辑器中插入以下格式代码,也可以通过编辑器的视频按钮添加,支持快捷键调用Ctrl+W
,目前只支持Mp4格式远程地址。
{% https://qny.mqllin.cn/gamevideo_20190711_102933.mp4 %}
2.在文章编辑器中插入B站的视频ifram代码,方法如图:
注意!B站生成的代码是最基础的,我们可以自己添加url参数
实现更好的体验。
- BILIBILI 地址PC端参数
&high_quality=1 (1=最高画质 0=最低画质)
&danmaku=0 (1=打开弹幕 0=关闭弹幕)
- iframe 参数
allowfullscreen="allowfullscreen" #移动端允许全屏
sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts" #禁止跳转到B站
完整的ifram代码示列:
<iframe src="//player.bilibili.com/player.html?aid=60016166&cid=104514776&page=1&high_quality=1&danmaku=0" allowfullscreen="allowfullscreen" width="100%" height="500" scrolling="no" frameborder="0" sandbox="allow-top-navigation allow-same-origin allow-forms allow-scripts"></iframe>
设置评论头像
后台找到个人设置=>个人资料
- 填写
昵称
:评论显示的昵称 - 填写
个人主页
:也就是博客的地址,注意区分ssl
,也就是https
和http
- 填写
邮箱
:必须qq邮箱,否则无法拉去博主头像地址
其他常见问题
如果你的左侧分类自动收缩不能正常展开
- 后台
设置=>基本
中的站点地址
的url地址
时候同浏览器中地址相同,注意区分ssl
,也就是https
和http
- [勾选] 必须填写邮箱
- [勾选] 必须填写网址
- [勾选] 同一 IP 发布评论的时间间隔限制为 1 分钟