WordPress 主题制作（一）主题的基本构成

来源：互联网发布：how is it和what is it 编辑：程序博客网时间：2024/04/28 02:53

一个WordPress主题至少要包括下面两个文件：

style.css
index.php

必须包含index.php是因为它是生成web页面的默认文件，如果WordPress找不到到其它文件，它就会调用index.php。

style.css是WordPress主题的主样式表，虽然你也可以引入其它的样式表文件，但是style.css必须存在。style.css还有一个主要作用就是包含了主题的元数据信息，这些信息会出现在主题管理器中。WordPress自带的Twenty Fifteen主题的style.css头部内容如下：

/*Theme Name: Twenty FifteenTheme URI: https://wordpress.org/themes/twentyfifteen/Author: the WordPress teamAuthor URI: https://wordpress.org/Description: Our 2015 default theme is clean, blog-focused, and designed for clarity. Twenty Fifteen's simple, straightforward typography is readable on a wide variety of screen sizes, and suitable for multiple languages. We designed it using a mobile-first approach, meaning your content takes center-stage, regardless of whether your visitors arrive by smartphone, tablet, laptop, or desktop computer.Version: 1.2License: GNU General Public License v2 or laterLicense URI: http://www.gnu.org/licenses/gpl-2.0.htmlTags: black, blue, gray, pink, purple, white, yellow, dark, light, two-columns, left-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-readyText Domain: twentyfifteenThis 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主题的style.css中都应该包含元数据，但不是所有的元数据都是必须的，WordPress会忽略没有的部分。

Theme Name: 主题的完整名称
Theme URI: 主题下载链接
Author: 作者
Author URI: 作者主页
Description: 描述
Version: 版本
License: 授权协议
License URI: 授权协议详细内容网址
Tags: 标签
Text Domain: 本地化唯一标识符

在style.css的元数据注解的结尾，你还可以加入更多的注释。

在WordPress的安装目录wp-content\themes中创建一个test文件夹，再新建style.css和index.php两个空文件，如果你的WordPress是安装在本地，通过http://localhost/wp-admin进入后台管理界面，在“外观-主题“菜单下面就可以看到多了一个test主题，启用它后，你会发现WordPress打开后页面是空白，这是因为我们的主题文件内容还是空的。

通常WordPress主题都包含下面的模板文件：

header.php
footer.php
sidebar.php
comments.php
searchform.php

header.php

header.php文件通常包括在所有页面头部所需要的内容，下面是一个示例：

<?php/*** The Header for our theme.**/?><!DOCTYPE html><html <?php language_attributes(); ?>><head><meta charset="<?php bloginfo( 'charset' ); ?>" /><meta name="viewport" content="width=device-width" /><title><?php wp_title( '|', true, 'right' ); ?></title><!-- HTML5 SHIV for IE --><!-- If using Modernizr you can remove this script! --><!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]--><?php wp_head(); ?></head><body <?php body_class(); ?>><header class="site-header"><h1><a href="<?php echo home_url(); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/logo.jpg" alt=" "></a></h1></header>

它包含了下面几个部分:

DOCTYPE 声明
<html> 开始标签
<head>标签及其中内容
<body>开始标签

wp_head()

wp_head()应该出现在所有的页面中，并且在</head>结束标签之前。它的功能是包含主题所用的样式表文件，脚本文件及用到的插件。

wp_title()

wp_title()是用来为所访问的页面自动生成标题，它有三个参数：

分隔字符串
是否显示标题或以PHP字符串的形式返回
分隔符的位置

默认的情况下，它只是返回当前页面的标题。

footer.php

footer.php文件内容相对就少得多，它包含了HTML文件的结尾，你在这里可以找到</body></html>标签，你应当在主题的所有页面属部包含它。它也需要调用一个特殊的函数wp_footer()。

wp_footer()

和wp_header()一样，它也需要在所有主题页面中调用，在</body>结束标签之前。在这里，WordPress会为登录用户生成管理工具导航栏，当你发现页面顶部突然出现30px的空白，又想不出原因时，你应该记住wp_footer()。

sidebar.php

sidebar.php用来显示在多个页面中出现的侧边栏，它通常包含了WordPress中的小工具。

comments.php

comments.php用来显示文章的评论。

searchform.php

searchform.php用来显示搜索框，如果没有该文件，WordPress会自动生成一个默认的。

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>"><div><label class="screen-reader-text" for="s">Search for:</label><input type="text" value="" name="s" id="s" /><input type="submit" id="searchsubmit" value="Search" /></div></form>

包含模板文件可以通过PHP的include()来完成，但WordPress准备了一些模板函数来调用这些模板文件：

get_header()
get_footer()
get_sidebar()
get_search_form()
comments_template()

下面是一个模板文件的调用片断：

<?php get_header(); ?><div class="container"><div class="search"><?php get_search_form(); ?></div><div class="main"><?php // do stuff ?><?php comments_template(); ?></div><?php get_sidebar(); ?></div><?php get_footer(); ?>

这些模板函数还可以使用参数，WordPress会根据参数查找对应的模板文件，如：

get_sidebar('secondary');

会调用模板文件sidebar-secondary.php。

comments_template()默认情况下，它只会显示comments.php文件中的评论内容。它也可以带两个参数，一个是模板名，它必须是完整的模板名并包含相对于主题目录的相对路径，如：'/custom-comments.php'。另一个参数是Boolean类型，表示是否将评论按类型分开显示，默认情况下它是false。

functions.php

这个文件在主题的根目录下，并且在wordpress的页面初始化时自动加载。你可以其中编写自定义的代码供主题模板调用，或调用WordPress的系统函数来改变其功能或设置。

0 0