如何制作一套属于自己的主题
很多网友说不知道如何仿制一套博客页面,于是就有了这篇文章
阅读本文,需要一定的开发经验
主题机制
与其它的资讯类程序类似,主题文件放在一个文件夹里面,通过服务端的完成数据的渲染,这样的好处在于友好的SEO,首次打开快,对浏览器依赖少。
Zrlog使用博客页面使用了/post
/
的路由,当浏览器访问诸如(http://blog.zrlog.com) 程序代码会根据对应了URI
的寻找对应的方法。
JFinal机制是寻找对应的方法,如果没有对应的方法是会调用index
这个方法,如果也没有 index
方法就会扔出404
的错误页。
最终执行是下面这个方法
查询出来的文章数据存放在request域里面。
通过如下代码判断选择对应需要渲染的模板文件
制作前提
jsp
(熟悉常用的el表达式,jstl标签库)
基础的 html+css
(了解常用的元素和布局方式)
先看下默认的主题文件夹的结构
对应目录为 /include/templates/default
├── 404.jsp (文章不存在时,被 detail.jsp,page.jsp 通过 include 指令使用)
├── css (网页样式文件)
├── detail.jsp (文章详细页数据)
├── fonts (用到的第三方字体文件)
├── footer.jsp (公共的网站底部,通常是版权,统计代码,备案号数据)
├── header.jsp (公共的网站头部数据,通常是指导航条数据)
├── images (存放图片资源文件)
├── index.jsp (这个文件通过和page.jsp文件一致,如果不进行特殊定制的话)
├── js (存放需要用到javascript代码)
├── language (存放主题中的一些描述语句,主要用于多语言)
├── page.jsp (文章列表页数据)
├── setting (存放主题设置的页面)
└── template.properties (用于管理界面展示使用,描述主题的一些信息)
通过将静态文件放到不同文件夹下面,方便管理。上面罗列的是部分通常结构。
当然也可以按照自己命令方式比如 css 可以使用 style。这都没有任何限制的。主题至少要 page.jsp
detail.jsp
这2个文件。
具体如何引用样式,字体文件。需要在这2页面中去控制。
主题数据
Zrlog目前只有2个页面,及文章列表页,文章详细页。只需要编写对应模板代码就可以了。主题需要用到数据的数据都存放在Servlet的Request域里面。
开发环境下面,通过在代码中引入 dev.jsp
这个页面可以在浏览器的控制台对应Request域里面的内容。
公共数据
- _res (存放主题使用到配置,全局化的字典)
- init (全局数据,包括侧边栏菜单,导航条,网站设置)
- templateUrl (主题静态文件存放的绝对地址)
- baseUrl (用于部分非绝对路径地址的拼接)
- requestUrl (浏览器的请求的完整地址)
- searchUrl (搜索文章接口数据的提交地址)
文章列表页
- pager (快速生成文章分页条)
- data (文章列表页的文章数据)
文章详细页
- log (文章的详细数据,包含评论数据)
注意事项
- 任何文件后缀为
jsp
,properties
,是无法通过浏览器方式访问的
共享模板
如果你也想你编写的主题可以被其他人使用,可以将主题文件压缩为.zip文件,以邮件的方式发送到 i@zrlog.com。
最后如果有不理解的地方,欢迎在评论区留言或者加交流群 (QQ群:6399942)
Reproduced please indicate the author and the source, and error a link to this page.
text link:
/make-theme-for-zrlog.html
