本专栏介绍如何开发设计你自己的 WordPress 主题。如果你希望了解更多如何安装和应用主题的内容,请参阅应用主题文档。本文的内容不同于应用主题,因为所讨论的是编写代码去构建你自己的主题的技术内容,而非怎样去激活主题或者是哪里可以获得新主题。

为什么要使用 WordPress 主题?

WordPress 主题由一系列文件和 CSS 样式表构成,构成了一个美丽的 WordPress 网站。每个主题都是不同的, 这样WordPress用户就可以随时更改 WordPress 网站的外观。

你也许想为自己开发 WordPress 主题,或者制作公开发行的的主题。但是除了这个为什么要自己制作主题呢?

  • 创建自己独特的 WordPress 主题外观.
  • 利用模板模板标签, 和WordPress 循环 来产生不同的效果.
  • 为了产生不同的效果,比如在 category pages 页面和搜索结果页面产生个性的效果.
  • 为了迅速从两个主题改变你的博客外观,可以充分利用 Theme or style switcher 这个插件迅速改变外观.
  • 设计 WordPress 主题,这样大家就可以通过网络更好的使用你的作品.

WordPress 主题有很多优点.

  • WordPress 主题把 CSS 样式表和模板文件 从系统中独立出来,所以这样升级博客的时候就不会破坏你的主题样式.
  • 允许你自由的定制主题样式.
  • 允许你迅速改变主题.
  • 你甚至都不需要学习HTML,CSS,PHP 等,即可拥有一个美观的主题.

为什么要自己制作主题呢?这才是问题的关键.

  • 这是一个学习 CSS,HTML,和 PHP 的好机会。
  • 这是一个积累你的 CSS,HTML,PHP 实践经验的的机会。
  • 制作主题的过程中充满创造力。
  • 这非常的有趣(大多数情况下)。
  • 如果你 设计公共主题, 你会感觉非常好,因为你为 WordPress 社区做出了自己的贡献 (增加技术圈内资质)。

在本专栏中能学习到哪些知识?

  1. WordPress 的深度使用技巧
  2. WordPress 的主题开发
  3. WordPress 的插件开发
  4. 独立制作一个完整的博客
  5. 独立制作一个完整的电子商务网站

WordPress 主题模板开发标准

WordPress 主题应该按照如下标准开发:

主题的剖析

WordPress主题目录位于 wp-content/themes/。主题的子目录拥有所有样式文件、模板文件、可选的函数文件 (functions.php)、JavaScript 文件、图片等。比如说一个叫做 "test" 的主题就会放在 wp-content/themes/test/目录里。请避免使用数字名字,这会导致无法在主题列表中正常显示出来。

WordPress每一个发行版都会有一个默认的主题。请认真查看默认的主题,这样可能会对制作你自己的主题有帮助。

WordPress 主题除了图片和JavaScript,经常由三种文件构成。

  1. 样式表文件 style.css, 控制着页面的外观
  2. 函数文件 (functions.php)。
  3. 模板文件,它控制着从数据库中调出的数据所呈现的外观。
  4. ...

让我们单独看一下。

主题样式表( style.css )

CSS文件不仅定义了你的主题样式,style.css *必须 以注释的形式列出主题的详细信息。*两个不同的主题是不允许拥有相同的表述的 , 因为这样会导致主题选择出错.如果你通过拷贝一个你已经制作的主题来制作你新的主题,请确保先更改这些头部注释.

下面是样式表头部注释的例子,被称作样式表头注释。比如主题"Bachelor":

/*
Theme Name: Bachelor
Theme URI: http://taper.io/themes/bachelor
Author: Ayuan
Author URI: http://taper.io/
Description: The Bachelor theme for TaperLabs takes us back to the blog, featuring a full range of post formats, each displayed beautifully in their own unique way. Design details abound, starting with a vibrant color scheme and matching header images, beautiful typography and icons, and a flexible layout that looks great on any device, big or small.
Version: 1.0
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Tags: black, brown, orange, tan, white, yellow, light, one-column, two-columns, right-sidebar, flexible-width, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready
Text Domain: bachelor 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 主题文件结构开始,讲解并创建实例来分别讨论函数文件、模板文件、基本模板、自定义页面模板、搜索查询模板、定义模板、模板的引用、插件 API 钩子等的用法及机制。快速简单的入门到了解这一方便简洁的开源 CMS 系统中。

WordPress 主题开发:从入门到精通(必读)的更多相关文章

  1. Nginx开发从入门到精通 学习目录分享学习 (阿里著作)

    Nginx开发从入门到精通   缘起 nginx由于出色的性能,在世界范围内受到了越来越多人的关注,在淘宝内部它更是被广泛的使用,众多的开发以及运维同学都迫切的想要了解nginx模块的开发以及它的内部 ...

  2. 黄聪:《跟黄聪学WordPress主题开发》

    又一个作品完成!<跟黄聪学Wordpress主题开发>,国内最好的Wordpress主题模版开发视频教程!! 目录预览: WordPress官方源文件层式结构讲解 WordPress数据库 ...

  3. C# Windows服务开发从入门到精通

    一.课程介绍 大家都知道如果想要程序一直运行在windows服务器上,最好是把程序写成windows服务程序:这样程序会随着系统的自动启动而启动,自动关闭而关闭,不需要用户直接登录,直接开机就可以启动 ...

  4. wordpress 主题开发

    https://yusi123.com/3205.html https://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tut ...

  5. 《Java 开发从入门到精通》—— 2.3 使用IDE工具序

    本节书摘来异步社区<Java 开发从入门到精通>一书中的第2章,第2.3节,作者: 扶松柏 , 陈小玉,更多章节内容可以访问云栖社区"异步社区"公众号查看. 2.3 使 ...

  6. WordPress 主题开发 - (三) 开发工具 待翻译

    Before we get started building any WordPress Theme, we’re going to need to get our development tools ...

  7. WordPress 主题开发 - (一) 前言 待翻译

    原文出自: http://themeshaper.com/2012/10/22/the-themeshaper-wordpress-theme-tutorial-2nd-edition/ THE TH ...

  8. [转]WordPress主题开发:主题初始化

    本文转自:http://www.cnblogs.com/tinyphp/p/4391182.html 在最简单的情况下,一个WordPress主题由两个文件构成: index.php -------- ...

  9. WordPress主题开发:style.css主题信息标记

    在最简单的情况下,一个WordPress主题由两个文件构成: index.php ------------------主模版 style.css -------------------主样式表 而且s ...

随机推荐

  1. 滚动页面产生动画WOW.js的用法

    简介 在一些网页上,当你滚动页面的时候会看到各式各样的元素动画效果,非常动感.WOW.js 就是一款帮助你实现这种 CSS 动画效果的插件.WOW.js 依赖 animate.css,所以它支持 an ...

  2. 如何用纯 CSS 绘制一个世界上不存在的彭罗斯三角形

    效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/RyvgMZ 可交互视频教 ...

  3. 最长上升子序列(Longest increasing subsequence)

    问题描述        对于一串数A={a1a2a3…an},它的子序列为S={s1s2s3…sn},满足{s1<s2<s3<…<sm}.求A的最长子序列的长度. 动态规划法 ...

  4. 使用zookeeper报错 stat is not executed because it is not in the whitelist. envi is not executed because it is not in the whitelist.

    在使用四字命令或者zk ui界面查看zookeeper集群时,出现如下提示: stat is not executed because it is not in the whitelist. envi ...

  5. 安装kubuctl

    安装和设置kubectl 使用Kubernetes命令行工具kubectl在Kubernetes上部署和管理应用程序.使用kubectl,可以检查集群资源; 创建,删除和更新组件. 以下是安装kube ...

  6. 分布式的几件小事(九)zookeeper都有哪些使用场景

    1.zookeeper介绍 ZooKeeper是一个分布式的,开放源码的分布式应用程序协调服务,是Google的Chubby一个开源的实现,是Hadoop和Hbase的重要组件.它是一个为分布式应用提 ...

  7. 物联网的语言c,python,go等

    日本生鱼片 电热水器的使用方法http://www.hiry.cn/b/mt/33959.html 物联网层次很多,首先要看你从事哪个层级的工作了.既然你问语言,那么肯定是开发类的工作,开发类的对象中 ...

  8. easyui datagrid连续删除问题

    如果在datagrid中直接将index传给easyui自带的deletRow方法来删除当前点击行,一开始并没有问题,但是当连续删除的时候就或出问题了. 原因是datagrid行是根据datagrid ...

  9. BeanUtils组件的使用

    BeanUtils能够使我们更方便的进行javabean的赋值操作,它的底层是反射的原理 主要方法有 copyProperties(Object object,String name,String v ...

  10. dedecms sql 替换 或 删除

    UPDATE dede_archives SET writer='你需要修改的作者' WHERE writer=''; UPDATE dede_archives SET source='你需要修改的来 ...