公民

美观、简洁、细腻、高性能、响应灵敏,最初是为 Star Citizen Wiki 创建的。

感谢你对公民的支持。现在,Citizen 已经来到了她的 1.2.43-beta.2 版本。从这个版本开始,此主题将仅支持搭载于 Boinky

Boinky 是专为单页化网站设计的、特殊的 Typecho。 通过与定制设计的小型 typechoCore 引擎配合工作,来实现客户端无缝 SPA 体验。


公民现已作为 Boinky 的默认皮肤提供。故本页面将一并介绍二者的所有特性。

全新的 UI 与系统

秉持去后台化的思想,Boinky 合并了前台和后台的概念。 管理员与已注册用户可通过路径 me 来直接访问任意特殊页面,其涵盖原版 Typecho 的所有 admin 路径。 同原生 TP 一样,此路径可自由修改,以增强私人站点的安全性。 除登录操作以外,所有页面全部以 PJAX 方式进行加载,修改系统使其以 JSON 执行响应,从而实现全站单页化。作为默认皮肤,Citizen 提供了 Typecho 在被修改后的主题开发范例。 此外,系统内核经过了少量优化,以适配新的加载惯例。

Boinky 被设计为拥抱下一代服务器/浏览器,应用了 PHP8 的全新特性,面向 ES6,不考虑脑瘫 IE... 总之主打一个 NextGeneration。其借鉴了一众优秀软件的优秀特性与功能,包括 MediaWiki、Drupal、XenForo、Ghost 以及 Jekyll。 若你熟悉这些软件,或许会在 Boinky 中见到它们的掠影。

动态页面与 xhrReady

开发 Boinky 的初衷,完全是因为我“迫切地需要”一个能够很好地与单页应用体系协同工作的 CMS。 起初我觉得要实现所谓“与 XHR 很好地协同”的这个构想,应该无需在代码层面上做太多的工作,但随着需求的深入推进, 大量动态请求之间的协调使得事情开始变得困难起来。于是我设计了一个微型引擎。 这个为 Typecho 独特打造的小轮子,大大简化了伴随 AJAX 而来的各种 JavaScript 问题——对于 Typecho 而言,恰到好处。

邮件、Newsletter 与通知

心心念念的邮件推送!虽然我很不能理解原生 TP 对邮件功能的视而不见,但作为程序员, 相比于不停地抱怨,自己更多应该做的是亲自去实现,所以本次 Boinky 为我们带来了全新的站点邮件外发系统, 基于 SMTP。当然,还有 Ghost 玩家喜爱的 Newsletter 功能,坏消息是它们的稳定性尚待测试。 除此之外,还为管理员贴心地设置了若干个关键行为节点的邮件通知选项,当然,这一功能未来会拓展至 WebHook 支持。

富文本与源代码编辑器

这部分描述的是内置于 Citizen 的功能。

作为面向现代浏览器的主题,Citizen 使用 CKEditor5 以及 CodeMirror6 作为首选编辑器,它们都是 ES6 标准的。 它们分别作为富文本和源代码编辑器预置在文章和页面工作区。此外,Citizen 还允许访客使用富文本编辑器。网站的访客能够以受限的富文本格式进行评论,或者发送表情。 所有这些编辑器均为定制版本,待其就绪发布时,你可以在 NPM 中获取所有的源代码并自行执行构建。对于可视化编辑器,其集成了一众有趣的插件, 包括格式刷、自定义模板、快速指令、同样基于 CM6 的源代码编辑模式。

发送表情,但不只是小黄豆

无论你是管理员还是评论者,只要具有使用编辑器的权限,即能够发送表情。

使用同样基于 CKEditor 生态的现代化表情插件,管理员与访客能够轻松插入任意表情,从“黄豆”到动图。 这些表情插入即小部件化,对编辑器友好。此外,还允许通过搜索来快速找到想要的表情。 在不久的将来,结构化管理表情将变得更加容易,届时另会引入 Lottie 技术,以优化高清表情表现。 基于表情插件的特性,编辑器还能够为文章带来矢量图标支持,例如插入类似这样的的品牌图标

释放灵感,专注创作

目前 Markdown 已暂时不受支持。预估在若干个版本之后,基于短代码的编辑体系会被重新考虑。 但这并不意味着创作受到阻塞。相反,Carol 编辑器——她得名于行尸走肉,同样被赋予着其背后主人公简单纯粹的品质——正准备重新定义你创作的体验。 撰写页面的布局得到了极大的简化。它与可视化特性共同增强创作时的专注感,文思泉涌或许也只在下一刹那。 同时,Typecho 原生的草稿功能得到了增强。现在,允许编辑者直接通过CTRL+S快捷键来显式执行草稿的保存。

随心配置,轻松管理

绝大多数管理页面均得到了重做。常用的创建与编辑流程将能够直接在弹窗中完成,而无需在页面之间反复横跳; 批量选择的整体控件得到了优化。原本负责收纳若干操作的下拉框被拆分成独立的按钮,且与表单融为一体,整体 Workflow 更加一目了然。系统设置页面现在拥有了侧边栏,允许管理员更加方便地跳转于各个子配置页面; 同时由于使用了借鉴 OOUI 标准样式的表单控件,设置项现已变得更加简约清晰。

功能可重用与可扩展性

使用 typechoCore,开发者被允许直接创建具有基本交互功能的实用控件,而非 Citizen 独有。 Boinky 及 typechoCore 加入了大量基本交互支持,包括 jQPjax、Ajax 表单、事件控制、系统级通知、响应处理、对象代理、全局状态变量、动态资源请求、生命周期控制、对话框、快捷键、视窗滚动、Lazyload、页面控制、内容插入、正文目录、CAPTCHA 支持, 以及与 Typecho 紧密配合的内容处理策略。使用上述实用工具便可快速开发与部署一个前端实例,而无需从头自行编写兼容性代码。 系统原生自带 typechoCore 库,所有功能开箱即用。

简约、轻量、高性能

得益于新的底层支持,公民较之前的版本在性能与加载速度上有所提升。页面骨架与元素的简约感被悉数保留,创作的意义回归至内容本身。我们知道 Citizen 是衍生自 StarCitizen Wiki 的作品,而后者显然已经足够优秀。但我深知她原本是被设计作为一个 Wiki 的皮肤,而非 Blog。 她们的目标群体不同、运营/编辑者不同、根本目的不同、软件原理不同。在此差异基础上, 对于 Citizen For Wiki 的很多关键元素,我按照自己的理解重新进行了设计,以令其更加个性化、更加符合类 FlatDesign、 更加易于理解和使用,以及更加细腻柔顺。我希望 Citizen 为她的访客带来尽可能温和而非生硬的浏览体验,以及随处可见的细致和惊喜。

鸣谢

以下朋友们(不分先后)为编写 Boinky 与 Citizen 做出了宝贵贡献,特在此表示衷心的感谢。

添加新评论

点击评论者的头像,即可对其进行回复。

    木子詹
    木子詹 6 月 5 日

    最近在搞些啥

    Saammaa
    Saammaa 回复 @木子詹 | 6 月 5 日

    血脑屏障

    木子詹
    木子詹 回复 @Saammaa | 6 月 14 日

    cke?版本几啊

    Saammaa
    Saammaa 回复 @木子詹 | 4 天前

    14

    Saammaa
    Saammaa 5 月 31 日

    现在允许插入表情咯~太棒咯

    王云子
    王云子 5 月 21 日

    厉害哦,好看的主题

    Saammaa
    Saammaa 回复 @王云子 | 5 月 29 日

    欸嘿嘿谢谢夸奖~

    我吃红提子
    我吃红提子 4 月 20 日

    打卡

    花坊有约
    花坊有约 3 月 24 日

    坐等更新

    Saammaa
    Saammaa 回复 @花坊有约 | 3 月 28 日

    快了快了,这个更新会让你觉得十分炸裂

    花坊有约
    花坊有约 回复 @Saammaa | 3 月 28 日

    越来越期待了

    理智的西瓜
    理智的西瓜 2 月 22 日

    主题作者你好,我使用了你的主题并进行了大量改动,现在已经稳定运行中,我需要在自己的站内标注主题来源吗,感谢(我目前没有标)

    Saammaa
    Saammaa 回复 @理智的西瓜 | 3 月 24 日

    无需标注~

    Jack
    Jack 2023 年 12 月 23 日

    博主您好,刚接触typecho有点不太懂,那个分类自定义页面模板怎么用啊?我点击分类显示“404 Not Found”呢?辛苦回复,万分感谢。

    Saammaa
    Saammaa 回复 @Jack | 2023 年 12 月 24 日

    Typecho 需要手动在后台添加页面,具体是在“撰写 -> 创建页面”中找到名为“自定义模板”的选项,然后从中选择“分类总览”即可。

    jack
    jack 回复 @Saammaa | 2023 年 12 月 24 日

    这个我是按照这样操作的,为啥还是显示404呢。这是我操作步骤截图:https://pic.imgdb.cn/item/65878c93c458853aef3b126c.png
    博主有空的话可以帮忙看一下吗?谢谢。

    阿微叔叔
    阿微叔叔 回复 @jack | 2023 年 12 月 24 日

    你这可能是链接设置有问题 不解析吧 是不是这个伪静态 解析没设置好 设置——永久链接

    jack
    jack 回复 @阿微叔叔 | 2023 年 12 月 25 日

    您好,是这么设置吗?设置之后404问题还是存在呢
    https://pic.imgdb.cn/item/6588ec63c458853aefcf3da5.jpg

    Ammmm
    Ammmm 2023 年 11 月 29 日

    播放器那个不知道是要自己起个服务还是什么的弄不好,我直接先用你的apiurl了......
    define('API_URI', 'https://saammaa.com/play.php/');
    有空看到了教教呗

    Saammaa
    Saammaa 回复 @Ammmm | 2023 年 11 月 29 日

    哈哈哈哈我的 API 是定制的,固定只能返回我自己的歌单!不过现在已经面向大家开放啦;
    这个播放器服务确实有一点问题,俺已经追加了个新版本改好了,可以下载新的 play.php 替换一下哟

    Ammmm
    Ammmm 回复 @Saammaa | 2023 年 11 月 30 日

    栓Q,还有一个问题,那些css和js居然都是引用的远端的,我说怎么改了那么多都没生效。
    直接把 headfooter 这个两个 func 里的相应文件注释掉应该就会自动用本地的了吧。还是说要怎么改呢

    Saammaa
    Saammaa 回复 @Ammmm | 2023 年 12 月 01 日

    emm不会默认自动用本地的,还是需要手动在那个函数里面自己引用一下那些文件的本地地址才行奥,对于 render.css 应该用本地的 skin.css 作为替代,JS 的话,core-compiled.js 是所有其它 JS 文件的集成包,改完某个 JS 之后,要记得将它的 min 版本在 core.compiled.js 里面做一下替换