Skip to content
wordpress-theme-development-modularization

2021从零开始开发WordPress主题教程(二):模块化开发

距离SEO禅写《2021从零开始开发WordPress主题教程(一):了解目录结构》已经有很长的一段时间,现才有时间继续写第二篇,放心一定不会太监,只是还没想好要怎么写,现在有了大概的思路,就暂时记录下来,前一篇文章简单介绍了WordPress主题开发的基本要求,那就是目录下面必须包含,index.phpstyle.css这两个文件,一个主题可大可小,但是肯定不止两个文件,这篇就说下WordPress主题的模块化开发

开发过前端的朋友们肯定很熟悉模块化,因为不管你使用什么框架,配合ES6的模块化和Webpack打包工具的支持,都能将一个大的前端系统划分成不同的模块,不同的组件,WordPress是使用PHP语言编写的,PHP也有语言级别的模块化支持,比如requireinclude,这些是语言层面提供的模块化支持,但是这篇重点说的是WordPress自身提供的模块化支持。

Template Tags

WordPress 提供了很多template tag,那什么是模板标签呢?其实就是一些具有特定功能的函数,比如说获取网站的名称,logo,作者信息,这些template tag当然不止获取信息那么简单,光靠获取信息可没办法模块化开发WordPress主题,所以WordPress还提供了一些其他类型的模板标签函数,比如说获取头部,侧边栏,底部模板的功能函数:

get_header
get_sidebar
get_footer

这些标签函数『返回』的就是模板代码了,比如说header.php,sidebar.php,footer.php等模板页面,这里的返回并不是真正意义的返回,读过源代码可以知道是使用了hook,返回的是false或者void,这里暂时不去深究,WordPress提供了许多有用的模板标签,可以参考Template tags列表,注意这个页面上提到的只是一部分,其他的还需要到源代码里面看。

Conditional Tags

除了前面提到的Template Tags,这里还需要再提一提另一类特殊功能函数conditional条件标签,我们知道语言层面的条件语法,如if语句,他需要有个判定条件,比如说当前的页面是否首页?还是文章页?这时候wordpress就自己提供了一些函数去判断,如果要自己去写就麻烦多了,这些函数类似下面格式:

is_front_page
is_home
has_excerpt

具体详细的列表可以参考:conditianal tags列表

主题目录结构

随着主题越来越大,我们不可能把所有文件都放在根目录,一定会按功能特性区分开,把他们放在不同的文件夹,类似下面的目录结构:

assets (dir)
      - css (dir)
      - images (dir)
      - js (dir)
inc (dir)
template-parts (dir)
      - footer (dir)
      - header (dir)
      - navigation (dir)
      - page (dir)
      - post (dir)
404.php
archive.php
comments.php
footer.php
front-page.php
functions.php 
header.php
index.php
page.php
README.txt
rtl.css
screenshot.png
search.php
searchform.php
sidebar.php
single.php
style.css

其他都在后面慢慢会介绍到,这里说下functions.php文件,当主题通过style.css识别之后,如果主题是启用状态,wordpress就会去读取functions.php的内容,这相当于整个主题的main入口函数,无论是如何模块化,最终的入口是在这个文件,记住这点很重要。

其实要真正进行模块化开发,还需要介绍到class,但是这是PHP语言和设计模式的东西了,不是一两篇文章能介绍完的,这个系列应该是从易到难的一个渐进式WordPress主题开发教程,先使用简单的方法去实现一个主题,之后再根据设计模式来进行改进。如果觉得SEO禅的文章对你有帮助,就收藏下,现在下去时间比较稳定,就会继续持续更新,如果有什么想问的可以留言评论。

作者:SEO禅
本文链接:2021从零开始开发WordPress主题教程(二):模块化开发
版权申明:如无特殊说明,本站文章均为作者原创,著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处,谢谢!

标签:,

发表评论

您的电子邮箱地址不会被公开。