一直想找一个简单的主题，试过很多的主题了，最后还是选定了系统自带的最新版本 TwentyTwelve 对照网上的众多版本进行修改。东西都是网上东拼西凑过来的，最终实现的效果就是现在的样子，发个帖子记录一下所有修改过的地方。
创建子主题并链接父主题
先解释下什么是父主题和子主题。
所谓父主题，就是你在搭建网站时所选用的主题模板，比如我所使用的twenty twelve主题，那么网站就是根据这个主题的设置展示。
所谓子主题，就是父主题的延伸，父与子的关系，通过子主题可以修改、添加、覆盖父主题的一些样式。子主题存在的意义在于，当你通过子主题修改网站的样式，不会因为父主题的更新，而失去之前的修改。一般情况下，我们会将子主题命名为xxxx-child，如twenty twelve的子主题名就是twenty twelve child。
那么如何创建子主题呢？
首先，你要建立一个文件夹，可以命名为xxxx-child（就是在父主题名的基础上添加child），这个文件夹建议和父主题文件夹同级，方便操作。
接下来就是链接子主题和父主题，因为你要在父主题的基础上优先展示子主题样式，那么就不得不将它们链接在一起。有三个重要的文件：
style.css——样式表
functions.php——函数模板
screenshot.jpg——子主题缩略图
首先是样式表style.css，在这个样式表中，你需要在开头添加以下说明内容：
/*
Theme Name: Twenty Twelve-child
Theme URI: /
Description: Xie二次开发twentytwelve子主题
Author: Xie
Author URI: /
Template:twentytwelve
Version: 1.1.0
*/
这个不难理解，就是告诉程序，它就是twentytwelve主题的子主题，这段内容中，最重要的部分就是Template，后边的内容一定要和父主题的文件夹名一样，不然子主题将无法正常工作，其余部分你就可以改成自己的内容。
接下来便是调用子主题，需要用到functions.php，这里插一句，过去在调用子主题，一般是在子主题的style.css的说明内容下添加一句：
@import url("../twentytwelve/style.css");
但现在不太建议这样去做，具体原因我不清楚。
如今的做法是，在functions.php开头添加以下内容：
<?php
/* Function to enqueue stylesheet from parent theme */
function child_enqueue__parent_scripts() {
wp_enqueue_style( 'parent', get_template_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'child_enqueue__parent_scripts');
或是：
<?php
add_action( 'wp_enqueue_scripts', 'twentytwelve_enqueue_styles' );
function twentytwelve_enqueue_styles() {
$parent_style = 'parent-style'; // This is 'twentytwelve-style' for the Twenty Twelve theme.
wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
wp_enqueue_style( 'child-style',
get_stylesheet_directory_uri() . '/style.css',
array( $parent_style ),
wp_get_theme()->get('Version')
);
}
以上两种方法经过我的测试，都可用，具体用哪个，你可以根据自己的喜好选择。这段内容的意思就是告诉程序，我创建了子主题并且引用子主题的样式。切记，functions.php在内容的最开始一定有'<?php’这个函数头，这代表开始，如果不存在这个函数头，这个文件将没用。
再就是screenshot.jpg，子主题的缩略图，可以自己制作一个，就像我这篇文章题图的那样，建议尺寸是880×660。
将这个包含这三个文件的子主题文件上传到wordpress后台，在主题选项里，你就可以看到这个子主题了，点击启用即可。记住，千万不要删掉父主题哦，不然你的子主题也没用。
除了上面说的三个文件，其他还要修改什么，就从父主题文件夹里复制到子主题修改即可，比如你要修改网站页脚内容，就把footer.php文件复制到子主题，然后修改子主题footer.php的内容即可。这也是子主题比较便利的优点。
网站整体字体设置以及禁用谷歌字体
用wordpress新搭建的网站，是存在Google font的，但在国内，这种字体加载很慢甚至不能加载，严重拖累了网站的打开速度，那么我们就要禁用它，方式就是在functions.php内添加这样一段代码：
//禁用谷歌字体
function mytheme_dequeue_fonts() {
wp_dequeue_style( 'twentytwelve-fonts' );
}
add_action( 'wp_enqueue_scripts', 'mytheme_dequeue_fonts', 11 );
接着就是设置网站的字体，将以下代码添加到style.css中：
/* 整体字体设置 */
body {
font-family:"Segoe UI","Microsoft YaHei","Hiragino Sans GB",STXihei,"Heiti SC",Roboto,"Droid Sans Fallback",Tahoma,Verdana,Arial,"Segoe UI Emoji",sans-serif;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0;
outline:0;
padding:0;
vertical-align:baseline;
}
body.custom-font-enabled {
font-family:"Segoe UI","Microsoft YaHei","Hiragino Sans GB",STXihei,"Heiti SC",Roboto,"Droid Sans Fallback",Tahoma,Verdana,Arial,"Segoe UI Emoji",sans-serif;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0;
outline:0;
padding:0;
vertical-align:baseline;
}
这里有三个注意点。
第一、font-family中的字体名要用英文，比如“微软雅黑”，我们就需要写成“Microsoft YaHei”，这是为了支持更多的浏览器版本和设备；
第二、字体不一定要和我的一样，你也可以根据自己喜欢选择其他字体，比如思源宋体等；
第三、除了中文字体，也要有英文字体、特殊字体等，不然可能会出现显示问题。
网页整体宽度修改（并修改背景颜色为白色）
因为我个人感觉twentytwelve主题的内容宽度有点窄，所以我就修改了一下，而且默认的背景颜色是淡灰色，也被我改成了白色，如此两边就不会显得太过空荡荡了。
这里需要修改两个地方：
一个是style.css，把以下内容加到style.css中即可：
/* 网页宽度 */
.site {
margin: 0 auto;
max-width: 1190px;
max-width: 85rem;
overflow: auto;
}
另一处修改需要在网站后台自定义中调整，路径为：“wordpress管理后台——外观——自定义——颜色——背景颜色——修改为纯白色即可”。这仅仅只是参考，如果你更喜欢原本的样式，可以不做修改。
网页头部和底部间距修改
这个比较简单，修改一下css，调整上下边距既可，代码如下：
/* 网页头部和底部间距 */
body .site {
margin-top: 0;
margin-bottom: 0;
}
为首页等页面的文章添加摘要功能，设置摘要字数，并添加继续阅读
如果你没有在编辑文章时添加摘要的习惯，那么系统就会自动抓取预设的字数展示成摘要（当然是从正文的开头抓取），如果预设的达不到你的要求，就需要修改了。
另外，系统预设的没有“继续阅读”这四个字，只有“continue reading”，你也可以根据自己喜好改成中文。
要实现这些，将以下内容加入子主题的functions.php中即可：
//添加截取摘要汉字字数为200个
function custom_excerpt_length( $length ) {
return 200;
}
add_filter( 'excerpt_length', 'custom_excerpt_length', 999 );
//为摘要添加继续阅读字样
// Remove the ... from excerpt and change the text
function change_excerpt_more()
{
function new_excerpt_more($more)
{
// Use .read-more to style the link
return ' [......]<span class="read-more"> <a href="' . get_permalink($post->ID) . '"><br/><br/>继续阅读»»»</a></span>';
}
add_filter('excerpt_more', 'new_excerpt_more');
}
add_action('after_setup_theme', 'change_excerpt_more');
接着打开content.php，找到这段代码：
<?php if ( is_search() ) : // Only display excerpts for search. ?>
<div class="entry-summary">
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->
修改为：
<?php if ( is_search() || is_category() || is_archive() || is_home() ) : //Display Excerpts for Search category archive home ?>
<div class="entry-summary">
<?php the_excerpt(); ?>
</div><!-- .entry-summary -->
另外，你想要多少字，也可以修改，将functions.php代码内的“200”修改为其他数字即可，下面的“继续阅读”和“[……]”以及“》》》”也都是可以修改的。
网页头部空白处添加搜索框
默认情况下，网页右上角是一片空白，感觉空荡荡的，所以加个搜索框吧，虽然侧边栏小工具处可以添加搜索框，但并不好看。
需要两处修改：
第一处是header.php，在该php里找到</hgroup>，在它之后添加以下代码：
<div class="header-search"><?php get_search_form(); ?></div><!--网站头部添加搜索框-->第二处打开style.css，添加以下代码：
/* 头部添加搜索框 */
.header-search {
float: right;
margin-top: -50px;
}
@media (max-width: 650px) {
.header-search {
display: none;
}
}简单解释一下。这里有一个很巧妙的东西，就是@media(max-width:650px)这句，media是媒体的意思，max-width:650px是最大宽度650px，这句话的意思就是媒体设备的最大宽度为650px。为什么要加上这句？其实就是为了限制接下来的代码，在宽度650px以下的设备才会发挥效果。什么样的媒体设备最大宽度在650px以下呢？其实就是手机。整体意思就是，设定这个搜索框在手机端不显示。当然，你也可以根据自己喜好修改。