0°

wordpress 主题开发入门教程(一)

从本章开始,我们一起来学习一下 wordpress 主题的开发,在学习之前,我们需要搭建一个 wordpress 本地开发的环境,可以参考如何使用phpstudy在windows上搭建wordpress本地运行环境

创建主题

第一节我们先来学习如何创建一个最简单的 wordpress 主题,最简单的主题只需要两个文件,一个用于描述主题简介和样式的 syle.css, 以及一个首页模板 index.php, 让我们在 wordpress 的主题目录下新建一个文件夹,主题目录位于“wordpress根目录/wp-content/themes/”,我们把新目录命名为 mytheme, 然后用文本编辑器打开在这个文件夹,这里推荐使用 vscode,  然后我们新建两个文件 index.php, style.css,  如下图所示:

wordpress主题路径

wordpress 使用VS code进行主题开发

增加目录简介

这样 wordpress 还无法识别我们的主题,我们还需要增加主题描述,wordpress 的主题描述位于style.css的头部注释里,这里我们参考一下 wordpress 自带的 twentyseventeen 主题,把它的 style.css 头部注释复制到我们的 style.css 修改一下,如下所示

wordpress 主题 style.css 文件简介

其中注释行的描述如下

  • Theme Name: 主题名
  • Theme URI: 主题的官网链接
  • Author: 主题作者名
  • Author URI: 主题作者个人主页链接
  • Description: 主题描述
  • Version: 主题版本
  • License: 许可协议
  • Lisence URI: 许可协议描述链接
  • Text Domain: 主题翻译所属的文本域
  • Tags: 主题标签(在wordpress主题商店中显示)

应用我们的主题

经过以上步骤,我们在 wordpress 后台打开主题,即可看到这个新建的主题, 点击启用即可应用我们的主题,在主题介绍上可以看到我们刚才在 style.css 中填写的一些信息, 启用后,我们在浏览器打开我们的站点,会发现页面什么也没有,因为我们的模板文件 index.php 是空的,下一章,酷屋将教大家在首页怎么循环展示文章

wordpress后台显示新创建的主题

wordpress主题信息

 

「点点赞赏,手留余香」

    还没有人赞赏,快来当第一个赞赏的人吧!
0 条回复 A 作者 M 管理员
    所有的伟大,都源于一个勇敢的开始!
欢迎您,新朋友,感谢参与互动!欢迎您 {{author}},您在本站有{{commentsCount}}条评论