WordPress主题开发系列实战教程WP建站教程视频教程

WP主题开发02：wordpress主题开发流程

任何企业，在生产产品时，都会有一个操作流程或生产流程。比如服装企业，他们会首先通过时装设计师设计出服装样式效果图片，然后，会叫工厂的打板人员根据设计图来打出一个样板，接着会放到工厂里，让服装工人根据板样来制作服装，制作好后，还会对服装进行熨烫、绞边等等操作。我们开发wordpress主题模板，同样也是需要有一个流程的，尤其是IT公司里团队开发时。流程的好处是：可以让不同特长的员工分工合作，达到最好的效率。

下面，我们一起来看看wordpress主题开发的流程有哪些吧。

第一步：美工设计wordpress主题模板的效果图。

在我们开发wordpress主题模板前，我们需要先知道，这个模板到底长得是一个什么样子，也就是说，我们的开发，要有一个目标，然后按着这个目标来进行一步一步地开发。当然，我们可以通过文本来描述网站的样子。但是最直观的，当然是网站的效果图了。

?通过效果图，我们就知道这个网站长成什么样子，头部是什么个样子，底部是个什么样子，中间主体又是个什么样子，这些都可以一目了然。在企业里，一般都会由美工去设计这个效果图。如果是个人的话，如果懂平面设计软件，也是可以轻松弄出来的。我们常用来设计的软件一般是photoshop。当然，也有其它的绘图软件。

第二步：对效果图进行切图操作。

wordpess主题的效果图设计好后，我们接下来就要对它进行切图的操作。其实，就我个人而言，在常规开发中，这个切图步骤是可有可无的。对于一个wordpress主题开发的高手来说，他们也许只需要看着效果图来开发就可以了。当然，对IT企业来说，切图还是有必要的，因为把效果图切成小图后，前端就可以直接把这些小图放到前端页面上展示，可以直观地让客户看到效果。切图软件的选择，我们可以选择photoshop来进行，photoshop就带有切刀工具。

第三步：根据效果图编写静态模板。

切完图后，我们就进入到第三个流程——编写静态模板。wordpress主题的静态模板编辑是一个必须的流程，这个过程是逃不掉的。这个流程中，我们会把切图切下来的小图片，通过HTML代码来进行组合布局，达到第一步中的效果图的效果。这样，我们就可以在浏览器中观看到它的网页版的效果了。静态模板虽然不是真正意义上的wordpress主题模板，但是，它已经让网站的轮廓可以通过浏览器就可以查看，这样，我们就可以把模板的静态展示，给客户观看，提出意见。然后不断完善，达到客户的需求。

第四步：把静态模板转换成wordpress动态模板。

这一步是正式把效果图演变成真正的wordpress主题模板。在我们做好了静态模板后，我们就可以根据它的布局，来使用wordpress程序所提供的函数来调用数据库中的数据，让前端的页面的数据不再是死数据——一成不变。我们的网站需要的是，只要后台发表了文章，后台的数据就要做出相应的变化，这就是动态网站优势。如：顶部导航菜单，我们就可以在后台进行设置，然后，在wordpress主题的动态模板中，通过 wp_nav_menu()函数来调用，就可以在前台页面的顶部展现。

第五步：安装动态模板到网站。

一般情况下，我们都会在本地电脑中，一边开发wordpress动态模板，一边对它进行测试。所以，在我们写完wordpress动态模板后，我们对它的测试工作也同时完成了。当然，你仍然可以在本地环境中对它进行多次的测试。

这时，我们可以直接在我们的服务器上的网站上来安装我们开发好的wordpress主题模板了。安装wordpress主题很简单，可以通过2种方式来安装：1、直接通过FTP软件把我们开发好的wordpresss主题模板文件上传到网站根目录下的/wp-content/themes/ 目录下；2、也可以先把wordpress主题模板的所有文件压缩成一个zip后缀的压缩文件，然后在wordpress网站后台的主题菜单中去上传安装。如果正确安装wordpress主题，可以参阅锐锋堂相关的文章，里面有详细的解说。

通过上面的介绍，我们了解到，我们在开发wordpress主题模板时，全经哪几个流程。只要我们按照这个流程来认真操作，就会有效减少出错的机率。就算出现错误，我们也可以在最短的时间内，找到是在哪个流程中出现了错误，对于企业来说，就很容易找到出错的当事人，就可以有针对性地进行修补，可见，开发流程还是非常重要的。

开发一个简单的WordPress主题

引言

此教程为WordPress开发app（小程序）接口开发教程系列教程。

很多人认为制作一个WP主题很麻烦，但其实不然，只需要几分钟你就可以制作出一个属于自己的WP主题，因为一个WP主题它其实只需要包含几个文件就足够了。

教程开始

1、创建一个文件夹，名字自定义，此处我的文件夹名称为wpApp（使用编辑器为sublime）

2、在该文件夹下面新建文件style.css

3、在style.ss中写入以下代码：

/*Theme Name: wpApp（主题名称）Theme URI: 主题地址Author: sliverRing(主题作者)Author URI: (作者博客)Description: 一个wpapp主题(主题描述)Version: 1.0.0（主题版本）*/

如图：

4、在该文件夹下面创建index.php文件，并写入以下代码：

<?phpget_header(); //wp函数，引入头部echo '世界，你好！';get_footer();//wp函数引入底部?>

如图：

5、打包主题，上传至WP程序的主题根目录，之后在WP管理后台你就可以看到自己的主题了，然后点击启用，访问域名你将得到以下界面：

结束

好了，至此一个简易的WP主题就开发完成了，后期将使用此主题进行App开发。

WP主题开发03：如何制作wordpress主题的效果图？

在我们开发wordpress主题模板时，我们首先要有一个参照物，这个参照物可以是一个word描述文档，可以是一个网站，也可以是一个制作好的效果图。一般情况下，客户会通过word文档的形式来描述他对wordpress主题的功能需求，但这并不能够给人以形象化，也就是说，开发者并不能具体了解到——这处wordpress主题到底长得是个什么样子。这时，我们就要有一个主题效果图或参照网站来作为我们开发的参照物，这样，我们才可以有的放矢，而不会毫无头绪。

那么，我们该怎样来制作wordpress主题模板的效果图呢？这就要看具体情况了，如：团队联合开发、个人开发等等情况。主要分为以下三种方式来制作效果图。

方法一：通过专业的设计软件来设计wordpress主题的效果图。

如果你是IT团队来开发wordpress主题，团队中一般都会有一个专业的美工人员，这时，就可以通过美工人员来通过专业的设计软件来设计wordpress主题的效果图。

或者，你是一个个人开发者，而同时，你也精通photoshop这类效果图设计软件，那么，也可以自己通过软件来设计wordpress主题的效果图。

photoshop设计效果图

再或者，你不擅长这类设计软件，你也可以在淘宝或其它类似网站，花钱请别人来设计这个wordpress主题模板的效果图，其它所花的费用也不是很高，网上，几十元到几百元的都有。总之，最终的目的，是要获取一个漂亮的wordpress主题效果。

方法二：通过网站截图来制作wordpress主题的效果图。

这种方法，主要针对的是这样一类客户：1、很中意一个网站的整体布局，觉得正是自己所要的；2、要求不高的客户。对于这类客户，我们就没必要再去请美工人员去专门设计wordpress效果图了，我们只需要有针对性地截取他们所提供的网站的截图就可以了。

怎么截取网站的网页？大家都知道，一般情况下，一个网页往往都很长的，需要拉动滚动条，才能看完整个网页。这时，如果只用普通的截图软件（如：QQ截图）是截取不了整个网页的。那我们使用什么来截取整个网页呢？

长网页截取效果图

嗯，曾经为了拷贝别人的网站，我就使用搜狗浏览器的一个网页截图功能，来截取整个网站的所有需要的页面：首页、分类页、文章页、单页面、搜索页等等。至于其它浏览器，我不知道有没有这个功能，但我一直在使用搜狗浏览器的这个功能，这也是使用它的一个意外发现。我们只需要点击搜狗浏览器 “文件”菜单下的“另存为图片”，就可以把当前浏览的网页保存为一张图片（如上图）。

方法三：通过手绘来制作wordpress主题的效果图。

如果不会photoshop这类设计软件，也没有看中的网站作为参照，这时，如果你有手绘的功底，也可以自己来手绘wordpress主题的效果图。如果你有画画的功底，你可以通过手中的笔来手绘效果；如果你没有画画的天赋，你也可以通过 笔和尺子在白纸上画出一个网站的基本轮廓，也就是我们经常说的草图。作为经验丰富的wordpress主题的开发者，完全可以根据一个草图来开发主题的。当然，如果想进行下一步中的切图，也可以通过扫描仪把草图扫描到我们的电脑中。

手绘草图 效果图

通过上面的三种方法，我们可以制作出不同情况不同需求下的wordpress主题效果图。当然，如果你够专业，或者你们是一个团队开发，那么肯定是选择第一种方法来制作wordpress主题模板的效果图了。而针对个人开发者来说，就不是那么回事了，并不是每一个开发者都是美工高手，有的开发者，可能从来都没有碰过设计软件。选择哪种方式来制作效果图，你可以根据具体的情况来做决定。