南宁网站建设公司,南宁网络公司,南宁网站建设醉懂网络,为SEO优化而生!
首页 联系我们 电话咨询 短信咨询 QQ咨询
南宁网站建设公司 > 图文教程 > 【图文教程】 WordPress主题开发:文件结构 >

【图文教程】 WordPress主题开发:文件结构

编辑 : 南宁网站建设_醉懂网络科技有限公司 日期:2018-01-08

一览

CSS 样式文件和 JS 脚本文件

Style.css

函数文件

模板文件

文字版本的加载顺序

主页

文章页面

页面

分类页面

标签页面

作者页面

日期页面

搜索页面

404 页面

附件页面

总结

在上节课完成了一个简单的主题的开发过程,但是毕竟是一个简单的主题,所以功能非常简陋,比如常见的 404 处理都没有。这节课先来了解一下 WordPress 的主题文件结构,通过对主题结构的了解,你会明白,WordPress 主题应该有哪些文件、每个文件都能解决什么样的功能,通过这样就明白应该使用什么样的文件来完成一些特殊的功能。

一览

WordPress 主题可能会有很多文件,不过总体来说可以将它们分为三类:

  • CSS 样式文件和 JS 脚本文件:style.css ;

  • 函数文件:function.php ;

  • 模板文件:index.phphome.phpsingle.php

CSS 样式文件和 JS 脚本文件

CSS 样式文件和 JS 脚本文件是我们的主题最常见的两个文件,他们构成了主题的样式和页面内的效果交互。其中最重要的,就是 style.css 文件。除了 style.css 意外,还可能看到 rtl.css (Right-To-Left),这个是给一些特殊的语言,用于从右向左阅读习惯的人使用的,大部分情况下,我们是不需要这个的。

Style.css

Style.css 文件不仅承载着我们主题的样式表文件,还记录了主题的默认信息,比如主题名、主题描述、主题作者等等。一个典型的例子就是在上一节课中定义的 GitChat 主题的模板文件:

/*
Theme Name: GitChat
Theme URI: http://gitbook.cn/gitchat/column/5a16601f13c02f4a35c9f8ad
Author: 白宦成
Author URI: http://gitbook.cn/gitchat/column/5a16601f13c02f4a35c9f8ad
Description: GitChat WordPress 演示达人课
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blue
Text Domain: gitchat

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

函数文件

函数文件实现了我们的 WordPress 主题的各种功能,比如管理后台、特殊的内容输出、特殊的内容过滤器等等,一般来说,都会将其放在 functions.php 当中。但并不绝对,毕竟主题代码可能会非常的复杂,这个时候,可能会根据实际情况,将其放在其他文件夹中保存,然后在 functions.php 中引用,以提升代码的可读性。

模板文件

模板文件是 WordPress 定义好的一系列文件,无法对其重命名,不过可以直接使用这些名字来创建文件。具体的模板文件列表如下:

  • index.php:主模板,这个模板必须提供。

  • comments.php:评论模板。

  • front-page.php:首页模板,当切换为静态首页时,可以选择这个。

  • home.php:主页模板,默认的首页。如果开启了静态首页,这个模板则用于展示最新的文字。

  • single.php:单独页面模板,显示单独的一篇文章时被调用。对于这个以及其他的请求模板,如果模板不存在会使用index.php

  • single-{post-type}.php:自定义单独页面模板。例如,single-books.php 展示自定义文章类型为 books的文章. 如果文章类型未被设置则使用index.php

  • page.php:页面模板,独立页面调用。

  • category.php:分类模板。分类页面调用。

  • tag.php:标签模板,标签页面调用。

  • taxonomy.php:术语模板,请求自定义分类法的术语时使用。

  • author.php:作者模板,作者页面调用。

  • date.php:日期/时间模板,按时间查询时使用的模板。

  • archive.php:存档模板,查询分类,作者或日期时使用的模板。需要注意的是,该模板将会分别被category.phpauthor.phpdate.php所覆盖(如果存在的话)。

  • search.php:搜索结果模板,显示搜索结果时使用的模板。

  • attachment.php:附件模板,查看单个附件时使用的模板。

  • image.php:图片附件模板,当在 WordPress 中查看单个图片时将调用此模板,如果不存在此模板,则调用 attachment.php 模板。

  • 404.php:404 错误页面模板,当 WordPress 无法查找到匹配查询的日志或页面时,使用 404.php 文件。

这么多文件,到底是如何加载的呢?接下来一一说明。

这里使用了来自 wphierachy 的图片,这张图说明了 WordPress 的模板加载顺序。使用这张图,来说明模板到底是按照怎样一个顺序加载的。

这张图中,灰色的的方块代表着一个一个的页面,意味着我们的一个个不同的需求;红色的方块则代表着文件名含变量的文件模板,它们会根据变量的值,加载不同的模板;淡蓝色的则代表着普通模板;深蓝的代表主要的页面模板。

这张图的查看的顺序是从左向右查看,举个例子,当我们需要查看一个目录的页面时,首先,这个页面是一个归档类型的页面(archive),然后继续向右查找,找到我们要看的目录归档(Category Archive);然后继续向右看,我们看到指向了category-$slug.php,这个文件是变量文件, WordPress 会根据我们目录的别名(slug),查询是否存在对应的文件,如果有这个文件,就进行渲染,不再输出。如果不存在,则继续向右查找;继续向右看到了 category-$id.php,当到了这一步后, WordPress 会根据目录的 ID 查询,是否存在对应的文件,如果存在则继续查找,如果不存在,则继续向右查找。继续向右,看到了淡蓝色的 category.php,如果这个文件存在,则进行渲染。如果不存在,则继续向右查找,查找到 archive.php,最后一直会查找到 index.php.

上面就是典型的一个页面的查询轨迹,所有的页面都会遵循这个查找模式,进行查找。

在图中可以看到,所有的文件查找不到的情况下,最终就会查找到 index.php 上,这也就是为什么在一开始,便创建 index.php,通过这个文件,我们的主题便可以很好的提供服务。后续通过对页面的细分,添加不同的模板,实现更好的体验。

文字版本的加载顺序

上面的版本每次都要查询图片可能不是很方便,这里我总结了一份文字版本的加载顺序,读者可以根据这个加载顺序来制作模板。加载顺序从序号小的开始,如果查不到这个文件,则查询序号更大的文件是否存在。

主页
  • home.php

  • index.php

文章页面
  • single-$posttype.php

  • single.php

  • index.php

页面
  • 自定义页面模板

  • page-$slug.php

  • page-$id.php

  • page.php

  • index.php

分类页面
  • category-$slug.php

  • category-$id.php

  • category.php

  • archive.php

  • index.php

标签页面
  • tag-$slug.php

  • tag-$Id.php

  • tag.php

  • archive.php

  • index.php

作者页面
  • author-$nickname.php

  • author-$Id.php

  • author.php

  • archive.php

  • index.php

日期页面
  • date.php

  • archive.php

  • index.php

搜索页面
  • search.php

  • index.php

404 页面
  • 404.php

  • index.php

附件页面
  • $mimetype.php

  • attachment.php

  • single.php

  • index.php

总结

经过上面的内容,我想你已经明白了,是如何制作这些特殊的页面了,我们可以通过创建不同文件名的文件,将其放在主题根目录来实现不同的功能。

不过,在页面中,提到了「自定义页面模板」,这个是怎么用的?别急,在下一课细细说来。


南宁网站建设, 南宁最懂网络科技有限公司.版权申明:本文章来源于网络,如有侵权,请联系15917697062,我们收到后立即删除,谢谢!特别注意:本站所有转载文章言论不代表本站观点,本站所提供的摄影照片,插画,设计作品,如需使用,请与原作者联系,版权归原作者所有

上一篇 >【图文教程】WordPress 主题开发:快速入门 [南宁网站建设首页] [打印] [返回上页] 下一篇 >【图文教程】WordPress 主题一些特殊的页面

与本文相关文章南宁网站建设醉懂网络科技为你推荐:

NetConcepts跨境B2B数字营销交流会南宁平价的网络优化联系电话南宁小程序开发网络公司_让每个商家拥有最适合自己的小程序如何实现301_301怎么判断?南宁网站建设公司又上线一个头条小程序 南宁做网站的公司有哪些?今日头条小程序_可支持模糊搜索东莞大众家电维修清洗微信小程序十年谷歌外贸SEO优化经验分享 [第二篇]十年谷歌外贸SEO优化经验分享遂宁空调家电维修上门_家电维修微信小程序上线如何使用 WordPress 的邮件发文功能WordPress 数据库操作 WPDB 指南东莞SEO分享老域名的重要性_SEO入门一定要清楚!微信支付商户售卖商品举例微信小程序 新电商业 大未来小程序临近过年更新功能【Gif多图】最常用的Sublime Text 16个 快捷 ...零元钱使用电脑无线鼠标【图文教程】使用 Polylang 插件建设一个多语言站点

醉懂网络科技,为SEO而生!网站建设 And 代理加盟

cache
Processed in 0.004980 Second.