Bubble——Typecho 清新风格响应式主题

      发布在:源码中心, 网站源码      评论:0 条评论

转载自作者博客!地址https://tntofu.com/archives/24.html

Typecho 清新风格响应式主题。

化繁为简,如沐清风。

样式如你所见。

Github repo: https://github.com/trinitrotofu/Bubble

如果觉得本主题还不错的话可以给个 star 哦,这是对开源主题作者们最大的鼓励。

特性

我真佩服自己写文案的水平。

使用

安装

直接下载 zip 源码,解压后修改文件夹名称,移动到 Typecho 主题目录,也可以直接在服务器上用 git clone 下载主题。

设置

主题设置页面位置:Typecho 后台->控制台->外观->设置外观。

站点 LOGO

该项应为一个图片的 URL 地址,将显示在浏览器顶部标签标题左边。

请勿使用相对地址。

站点头像

该项应为一个图片的 URL 地址,将显示在首页大标题上方。

请勿使用相对地址。

首页背景图像

该项应为一个图片的 URL 地址,用以设定网站首页背景图片,留空则使用默认紫色渐变背景。

请勿使用相对地址。

随机背景图像地址

该项应为一个或多个图片的 URL 地址,用以设定网站文章页、独立页面以及其他页面的头图,设定后将从给定的图片中随机抽取一个显示,留空则使用默认紫色渐变背景。

URL 之间用换行隔开,即每行一个 URL,请勿包含多余字符

请勿使用相对地址。

背景气泡

该项用以选择是否在首页以及文章页顶部背景处显示半透明气泡。

页脚左下角文字

该项用以设定页脚左下角的说明文字,如 Copyright 和 备案信息。

可添加 HTML 代码以实现更丰富的功能,如跳转链接等。

页脚小工具

该项用以选择是否在页面底部显示“最新评论”、“最新文章”和“近期归档”。

自定义 css

该项用以提供自定义 css 接口,用户可以填入自己需要的 css 代码来改变主题外观,例如更改字体大小。

自定义 css 的生效不需要清空缓存。

全站 pjax 模式

该项用以选择是否启用全站 pjax 模式提升用户访问体验。

请注意:开启该功能后可能会导致站点一些功能不正常,例如如果您未使用主题自带数学公式渲染,而是选择使用其他插件实现该功能,则会导致无刷新打开页面时数学公式插件不工作,因此请仔细检查后决定是否开启该模式。

如果您发现部分功能确实出现了问题,而您又希望开启该模式,则请查看“pjax 回调代码”一项的说明。

pjax 回调代码

该项用以设定 pjax 渲染完毕后需执行的 JS 代码,以此解决上一项中提到的插件不工作之类的问题。

例如您有一个叫做myFunction()的函数在其他插件中调用了,但您发现它在全站 pjax 模式下不工作,则您应该在该项中填入以下内容:

myFunction();
JavaScript

那么在 pjax 执行完毕之后会调用myFunction(),问题就解决了。

katex 数学公式渲染

该项用以选择是否启用 katex 数学公式渲染

prism.js 代码高亮

该项用以选择是否启用 prism.js 代码高亮

prism.js 高亮主题

该项用以选择 prism.js 代码高亮的主题配色

短代码

高亮代码框

标签名:

语法:

<bbcode type="颜色类型">代码框内容</bbcode>
HTML

示例:

<bbcode type="success">这是绿色高亮代码框,用以显示推荐信息</bbcode>
<bbcode type="danger">这是红色高亮代码框,用以显示警告信息</bbcode>
<bbcode type="warning">这是橙色高亮代码框,用以显示注意信息</bbcode>
<bbcode type="secondary">这是灰色高亮代码框,用以显示引用信息</bbcode>
<bbcode type="info">这是蓝绿色高亮代码框,用以显示高亮信息</bbcode>
<bbcode type="default">这是深蓝色高亮代码框,用以显示高亮信息</bbcode>
<bbcode type="primary">这是紫色高亮代码框,用以显示高亮信息</bbcode>
HTML

效果:

Bubble——Typecho 清新风格响应式主题

友链

标签名:

语法:

<bblist>
<bblink link="友链 URL" icon="友链图标 URL" des="友链描述">友链名称</bblink>
</bblist>
HTML

示例:

<bblist>
<bblink link="https://tntofu.com" icon="https://tntofu.com/usr/uploads/2020/03/4228973783.jpg" des="三硝基豆腐的博客">豆腐蒸锅</bblink>
<bblink link="https://blog.boxpaper.club" icon="https://tntofu.com/usr/uploads/2020/04/2709766458.png" des="/ No Result !">Rorical</bblink>
</bblist>
HTML

效果:

Bubble——Typecho 清新风格响应式主题

更新

更新步骤为:删除旧版本,并安装新版本

请注意,由于 Typecho 本身设计的原因,主题更新后可能会添加新的设置项,如果不禁用主题并重新启用(通过启用其他主题),新设置项将被留空并可能导致 Bug,所以请在更新后重启主题,或者请仔细检查是否有留空的设置项(这里主要指选择型设置项,文本类设置项似乎没这个问题)

截图

Bubble——Typecho 清新风格响应式主题

License

Open sourced under the MIT license.

其他

Todo

更新历史

3.0.2

3.0.1

3.0.0

注:此次更新主要由 Rorical 贡献代码,十分感谢

2.3.0

2.2.2

2.2.1

2.2

2.1

2.0

2.0 之前

我不记得了,也懒得看

Responses