前言
Typecho 主题开发首先需要搭建PHP开发环境，可以参考 通过VS Code搭建轻量级PHP开发环境 一文，但实际上，如果你只是微调一下别人的主题，不打算自己开发，那么直接跳过这个也是可以的，因为PHP程序完全可以通过记事本编写，然后直接放到服务器上运行就可以了，不需打包、编译等一系列预处理的工作，但为了普适性，我还是得从开发者的角度来阐述这个问题。
1. 技术储备
理论上讲，如果需要完成一个 Typecho 主题的开发，你至少应该会 HTML、CSS、JavaScript以及PHP 四门语言。
但不用担心，它们都特别简单，如果只是开发 Typecho 主题的话，甚至都不需要专门花时间去学习。当然，从个人经验来看，这里实际上还是需要分两种情况。
- 第一种情况，如果完全没有编程基础，连面向对象、分支、循环的概念都没有，也不知道
HTML标签和CSS样式分别是干什么的，那确实需要花时间学一下，毕竟编程思维必须还是要有的，好在网上这方面的免费学习资源多如牛毛； - 第二种情况，有其它语言编程经验，这种情况就简单了，说明编程思维是有了，直接上手就可以了，因为虽然语法可能会略有不同，但能看懂、能识别对错就够了，有问题查文档，问AI，因为我很多时候就是面向文心一言，豆包等开发的。虽然它们有时候会乱说，但是有开发经验的你，验证结果并不困难。
这里最大的障碍可能就是没有编程思维，AI都不知道该怎么问，就跟老师提问“还有问题没？”一样，脑子里面一片空白的同学肯定是提不出问题来的。
当然，如果时间充足的话，无论是哪一种情况，系统的学一下，肯定是更好的，这样开发效率更高，不用什么都去查了。
2. 认识Typecho默认主题
从 Typecho的GitHub仓库 下载到源码后，可以在其 usr\themes 下面看到两个内置主题：classic-22和default。而我们通常的主题开发都会参考default实现，或者直接基于default修改。
注：
我使用的代码是从作者官方镜像joyqi/typecho:nightly-php8.2-fpm中复制出来的，因为我直接从GitHub仓库下载的在本地运行都有些问题，所以就直接从容器中复制出了一份最贴近生产环境、也最干净的代码。
接下来我们来简单认识一下 default 主题，目录结构如下图所示：
这里面最核心的是index.php文件，它是主题的入口，一些主题的元数据，如作者、描述、版本等也在这个文件里声明。另外一个是screenshot.png，它是后台主题列表显示的缩略图，这个文件虽然不那么重要，但会影响到一个主题的完整性。
所以，index.php文件里面的注释是一定要写的。
其它比较重要的文件还有：
functions.php： Typecho 提供了一套插件机制，通过在functions.php中添加相应的钩子函数，可以更好的自定义和扩展主题的功能，因此，该文件名是固定的，正常情况下，不能随便修改；page.php：默认独立页面的显示模板，如我博客中的留言板和关于我，而时间轴、作品墙等则是自定义独立页面模板，和page.php无关，这个我们后面再介绍；post.php：文章详情页面的显示模板，这个在开发博客网站的时候通常也是必须的，因为正常的网站，或许没有独立页面，但一定会有文章详情页；404.php：这个好理解，就是文件找不到的时候会跳转的页面。
上面提到的几个文件，包括index.php和screenshot.png，大概率所有的主题中都会有，而剩下的文件就可有可无了。
3. 实现Hello World主题
3.1 最简单的Hello World
根据上一节分析的，我们接下来只保留index.php和screenshot.png两个文件，依葫芦画瓢，实现一个最简单的Hello World主题。
如上图所示，在usr\themes目录下面新建一个HelloWorld目录，增加index.php和screenshot.png两个文件，并且在index.php中添加注释和内容，然后就可以到后台启用主题了。
启用之后，就是上图所示的样子，点击网站，就可以到前台查看主题效果了。
就这样，一个最简单的主题就开发好了。怎么样，是不是很简单？
3.2 扩展Hello World
但上面的主题，明显很不灵活，只能显示Hello World，如果想显示Hello Laozhu，就只能修改源代码了。我希望它是可配置的，就像我们常见的主题配置一样。这就需要用到functions.php文件了，前面说到过，可以在这个文件里面通过钩子函数扩展主题，接下来我们扩展一下。
在HelloWorld目录中添加functions.php文件，并在文件中添加一个themeConfig($form)函数，这是一个钩子函数，因此函数名也是固定的。在函数中添加一个文本控件就可以了，其它常用的控件还有Checkbox、Radio、Select等，它们都可以在如下图所示的源码目录中找到。
接下来需要到页面中引用这项配置，把该替换的地方替换掉。
这里的hello()函数名就是前面Text表单的字符串名称'hello'了，有其它语言开发经验的人一定会感叹，这种用法简直太方便了！
最后，就可以在外观中看到，多了一项设置外观的选项卡，在这里就可配置我们刚才添加的配置项了。
保存设置后，就可以再次检验效果啦。
到此，一个可配置的主题就也开发好了。
结语
文章写到这里，我相信一些有经验的开发者可能已经能够举一反三，大概能感觉到Typecho主题该怎么开发了，更复杂的主题无非就是做布局，写样式，然后针对各种钩子写接口实现了。
好了，这篇文章就先到这里，后续文章再继续尝试剖析更多的细节吧！
最后，想要用好 Typecho，少不了 PHP 的相关知识，点击下方按钮可获取全套的 PHP 零基础视频教程。
百度网盘
上述学习资源均来源于网络，搜集整理不易，仅供学习研究使用，如有需要，请保存至个人网盘备份，以防下架或丢失！
相关推荐
- 终于收到 Google Adsense 漂洋过海邮寄过来的 PIN 码了 2025-03-13
- 为博客网站增加一个简单的算术验证码，防止机器人垃圾评论轰炸 2025-03-12
- 如何基于 Typecho 实现中英双语网站（下） 2025-02-20
- 如何基于 Typecho 实现中英双语网站（上） 2025-02-09
- Typecho中添加外链跳转的过渡页 2024-12-18
评论14
wellknow
谢谢老朱的无私分享，时间轴和作品墙是如何实现的？在哪里有指导文章？
老朱
https://ilaozhu.com/archives/2097/这个里面的自定义模板页，不过没有写的很详细，你可以配合github上的源码参考一下，这个主题开源了
麻花与千层饼
大佬，能否出一期web本地开发环境搭建的教程，主要是小白不知道怎么在本地安装typecho😭
老朱
之前有写过的：https://ilaozhu.com/archives/2002/
酷小呵
大佬，我的网站恢复了，现在可以看到我弄的这个主题的样式啥的了： http://t.kuhehe.top/ 就是不会弄评论区和归档也有问题，不知道大佬有时间能否帮忙看一下呀？谢谢
老朱
你可以参考一下我的代码，分别对应的是主题中的comments.php和post-archives.php两个文件，实现倒不怎么复杂，就是调样式有点麻烦，你也可以复制过去然后直接改样式
酷小呵
我这两天，也用typecho搞了一个主题，样式直接用的hexo主题stellar(这么好看！)，不过现在搭建它的虚拟主机被攻击，现在打不开😭
老孙
这个我看过.有人想移植没想到你已经完成了.牛啊
酷小呵
其实我就是那个在你博客评论说想让你看看能否移植stellar主题的网友🤔
还没弄好，评论区不知道怎么弄，标签详情页也有问题🙃
老孙
我就是觉得这个主题它原本的设置也太复杂了如果把功能全部做出来太费时间了我实在是懒得搞了...
老孙
昂..评论区先写好html 然后硬套呗😅
老朱
我的也时不时有攻击，目前是通过屏蔽IP解决的🤣
Huo
好厉害！
一个字，真牛逼！
老朱
三个字，绝！😁