wordpress使用子主题来更新主题

最近自己用的wordpress的主题更新了，就想更新下。但是打开升级页面后返现wordpress提示：

主题

以下主题有可用更新，点选需要升级的主题，然后点击“升级主题”。

请注意：所有之前对主题文件的修改都将丢失。请考虑使用子主题方式来对主题做出修改。

悲剧了！由于作者以前修改过主题，那么更新后肯定神马都没了。这里wordpress建议使用【 子主题 】，于是到了官网看了下教程，大概知道怎么做了，这里笔记下过程：

首先看下自己都改了哪些东西：

作者使用的主题是zalive 1.11版本，自己小修改了下CSS和php，但是不记得修改了哪些地方，就直接对比了。
首先从后台上把已经存在的主题拖下来：

然后去官网下个原始版本的：

对比，发现改动其实很小~~那就好办了。其实只是修改了一个header.php文件，增加了一个menu.js，让菜单可以淡入淡出。

但是需要注意的是WP后台的【 外观 / Edit CSS】的内容是无法对比出来的，这里把【Edit CSS】的内容拷贝出来，放到后面使用。

然后根据介绍建立指定的目录及文件：

+zalive_modify
	-style.css
	+template
		-header.php
	+js
		-menu.js

根据官方的介绍，sytle.css是必须有的，而且对格式和注释也有很大的要求。这里笔记下style.css的内容，里面加了一部分我自己修改的CSS，即上面说的【Edit CSS】：

/*
Theme Name: zalive_modify      ==>>这是主题的名称
Description: a modify version of zalive  ==>>这是主题的介绍
Author: cstriker1407 ==>>修改者
Template: zalive ==>>父主题的目录名，区别大小写。
*/

@import url("../zalive/style.css"); ==>>必须明确的导入父主题的样式表

== 以下是作者自定义的CSS部分 ==
body {
	font-family: Microsoft YaHei, Helvetica, Arial, sans-serif;
}

#content {
	background: rgba(232,231,231,0.4);
}

.content-two-columns {
	background: rgba(232,231,231,0.4);
	width: 900px;
	margin-right: 269px;
	border-right: 1px solid #C9C9C9;
	margin-top: 110px;
}

#sidebar {
	width: 269px;
	margin-right: -270px;
	float: left;
}

#header {
	position: fixed;
	left: 50%;
	width: 1170px;
	margin-left: -585px;
	z-index: 999;
}

header.php和menu.js 是作者当前主题的文件，直接复制过来就可以了。

这里需要注意的是header.php的改动点：

由于作者对WP主题开发不熟，不清楚子主题的template_url为何为指向父主题，为了简单，作者直接把这里改成：

<script type=”text/javascript” src=”<?php bloginfo(‘template_url’); ?>_modify/js/menu.js”></script>

加了一个 _modify ，这样就可以找到 menu.js 文件了。

上传及使用主题：

将zalive_modify文件夹上传到wordpress后台的themes目录，然后启用它。然后修改下菜单，修改下背景，就和之前的主题一样了。

搞定这个之后，就可以将父主题升级了，而且不会影响到修改。

备注：

wordpress关于子主题的介绍非常的详细，文件的覆盖逻辑和调用的先后顺序都讲解的很清晰，基本上仔细阅读下教程，就能开搞了。